97

There is two ways to figure out if an array is an array or an object. Using typeof item === "object"; will return true for an object and an array since arrays are relatively new to javascript and arrays are prototypes of objects(may have worded this wrong, feel free to correct me). So the two ways I know of to determine if an Array is an Array are:

Solution 1:

Array.isArray(item);

Solution 2:

item instanceof Array;

My questions are:

  1. What is the difference between these two solutions?
  2. Which of these two is the preferred solution?
  3. Which has a faster process time?
5
  • 2
    possible duplicate of which is the best method used for checking isarray
    – Barmar
    Mar 9, 2014 at 23:38
  • 3
    isArray is more generic. It works across iframes, which isntanceof does not. It also looks like that isArray will correctly recognize typed arrays in ES6. Mar 9, 2014 at 23:40
  • I’m sticking to instanceof Array, because: 1. the syntax is consistent with instanceof (other classes), 2. for my Node.js, Arrays and instances extending Array are constructed by the same Array in the same execution context. Dec 4, 2022 at 19:57
  • @FelixKling, you said “isArray will correctly recognize typed arrays,” but on my Chrome 107, Array.isArray(new Uint8Array) is false. Dec 4, 2022 at 20:00
  • @КонстантинВан You are correct, it doesn't look like it covers typed arrays. Dec 5, 2022 at 9:09

2 Answers 2

93

1.What is the difference between these two solutions?

isArray is an ES5 method so not supported by older browsers, but it reliably determines if an object is an Array.

instanceof only checks if Array.prototype is on an object's [[Prototype]] chain. It fails when checking arrays across frames since the Array constructor used for the instance will likely be different to the one used for the test.

2.Which of these two is the preferred solution?

"Preferred" assumes some criterion for selection. Generally, the preferred method is something like:

if (Object.prototype.toString.call(obj) == '[object Array]')

which suits ES3 browsers and works across frames. If only ES5 browsers are in consideration, isArray is likely OK.

3.Which has a faster process time?

Largely irrelevant, since the processing time for both is negligible. Far more important to select the one that is reliable. An Array.isArray method can be added to browsers that don't have it built–in using:

if (!Array.isArray) {
    Array.isArray = function(obj) {
      return Object.prototype.toString.call(obj) == '[object Array]';
    }
}
9
  • 1
    Wouldn't triple equals === be more reliable?
    – Vad
    Dec 10, 2018 at 23:37
  • 9
    @vad—No. Object.prototype.toString always returns a string, so the results for == and === are identical.
    – RobG
    Dec 11, 2018 at 1:24
  • 2
    @CertainPerformance—sure, but the above only suggests using a pollyfill where Array.isArray is not available, which excludes ECMAScript 2015 (introduced 4 years after ES5 and isArray) and later.
    – RobG
    Feb 12, 2019 at 6:54
  • 2
    > "Largely irrelevant, since the processing time for both is negligible." That depends on how much you're calling these methods. In some context, e.g. games performance is ultra important.
    – HankMoody
    Mar 7, 2019 at 13:24
  • 1
    I could argue though, that even if in a case == and === are identical, the latter still must be used. I mean, we dont choose selectively safety guidelines based on where we think they fit. We put them everywhere to form a habit, just in case something is forgotten, for a case we didnt think could happen or anything stupid happens. It's not good practice to be selective with good practices, they should be applied everywhere or dont use them at all.
    – Eksapsy
    Oct 22, 2020 at 14:51
45
  1. Difference between Array.isArray(item) and item instanceof Array

    As Felix Kling mentioned in the comment, instanceof Array doesn't work across iframes. To give you a specific example, try the following code:

    var iframeEl = document.createElement('iframe');
    document.body.appendChild(iframeEl);
    iframeArray = window.frames[window.frames.length - 1].Array;
    
    var array1 = new Array(1,1,1,1);
    var array2 = new iframeArray(1,1,1,1);
    
    console.log(array1 instanceof Array);  // true    
    console.log(Array.isArray(array1));  // true
    
    console.log(array2 instanceof Array);  // false    
    console.log(Array.isArray(array2));  // true    
    

    As you see in the example above, array created with the Array constructor in iframe (i.e. array2) is not recognized as an array when you use instanceof Array. However, it is correctly identified as an array when using Array.isArray().

    If you are interested in knowing why instanceof Array doesn't work across different globals (i.e. iframe or window), you can read more about it on here.

  2. Which of these two is the preferred solution?

    In most cases instanceof Array should be enough. However, since instanceof Array doesn't work correctly across iframes/window, Array.isArray() would be more robust solution.

    Make sure to check for browser compatibility though. If you need to support IE 8 or less, Array.isArray() won't work (see Mozilla's doc).

  3. Which has a faster process time?

    According to this jsperf, instanceof Array is faster than Array.isArray(). Which makes sense, because Array.isArray() performs more robust checking and therefore takes a slight performance hit.

2
  • 14
    Just came across this and would like to note that Array.isArray() in some browsers is now significantly faster than instanceof Array Aug 23, 2017 at 21:17
  • Also, instanceof Array has a syntax consistent with instanceof OtherClasses. Unless you have multiple execution contexts, as in the browser environment, I recommend instanceof Array more. Dec 4, 2022 at 20:08

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy