JS several ways to judge whether an object is an array

js Several ways to determine whether an object is an array

1. adopt instanceof Judge

instanceof Operator is used to verify the of the constructor prototype Whether the attribute appears anywhere in the object's prototype chain , Returns a Boolean value .

let a = [];
a instanceof Array; //true
let b = {
    };
b instanceof Array; //false

Existing problems ：

It should be noted that ,prototype Properties can be modified , So it was not initially judged that true It must always be true .

secondly , When our script has multiple global environments , for example html Has more than one iframe object ,instanceof The verification results may not meet the expectations , for example ：

// by body Create and add a iframe object 
var iframe = document.createElement('iframe');
document.body.appendChild(iframe);
// obtain iframe Method for constructing an array of objects 
xArray = window.frames[0].Array;
// Get an instance through the constructor 
var arr = new xArray(1,2,3); 
arr instanceof Array;//false

The cause of this problem is iframe Will create a new global environment , It will also have its own Array.prototype attribute , It's obviously unsafe to have the same attributes in different environments , therefore Array.prototype !== window.frames[0].Array.prototype, to want to arr instanceof Array by true, You have to promise arr It's made up of primitive Array Only when the constructor is created .

2. adopt constructor Judge

We know , Constructor property of the instance constructor Pointing constructor , Then through the constructor Property can also determine whether it is an array .
let a = [1,3,4];
a.constructor === Array;//true
Again , This judgment will also have multiple global environment problems , Resulting problems and instanceof identical .

// by body Create and add a iframe label 
var iframe = document.createElement('iframe');
document.body.appendChild(iframe);
// obtain iframe Method for constructing an array of objects 
xArray = window.frames[window.frames.length-1].Array;
// Get an instance through the constructor 
var arr = new xArray(1,2,3); 
arr.constructor === Array;//false

3. adopt Object.prototype.toString.call() Judge

Object.prototype.toString().call() You can get different types of objects , for example

let a = [1,2,3]
Object.prototype.toString.call(a) === '[object Array]';//true

Its strength lies in that it can not only check whether it is an array , For example, whether it is a function , Is it a number, etc

// Check whether it is a function 
let a = function () {
    };
Object.prototype.toString.call(a) === '[object Function]';//true
// Check whether it is a number 
let b = 1;
Object.prototype.toString.call(a) === '[object Number]';//true

Even for multi global environments , Object.prototype.toString().call() It can also meet the expected processing judgment .

// by body Create and add a iframe label 
var iframe = document.createElement('iframe');
document.body.appendChild(iframe);
// obtain iframe Method for constructing an array of objects 
xArray = window.frames[window.frames.length-1].Array;
// Get an instance through the constructor 
var arr = new xArray(1,2,3); 
console.log(Object.prototype.toString.call(arr) === '[object Array]');//true

4. adopt Array.isArray() Judge

Array.isArray() Used to determine whether the passed value is an array , Returns a Boolean value .

let a = [1,2,3]
Array.isArray(a);//true

Simple to use , And for multi global environments ,Array.isArray() It can also accurately judge , But there's a problem ,Array.isArray() Is in ES5 It is proposed that , That is to say ES5 This method may not be supported before . How to solve it ？

The final recommendation for judging array methods

Of course, I still use Array.isArray(), from ES5 newly added isArray() Method is to provide a stable and usable array judgment method , It is impossible to put forward good things specifically for this purpose without , And for ES5 Problems that previously did not support this method , In fact, we can do compatibility and self encapsulation , like this ：

if (!Array.isArray) {
    
  Array.isArray = function(arg) {
    
    return Object.prototype.toString.call(arg) === '[object Array]';
  };
}