Difference between using Array.isArray and instanceof Array

匿名 (未验证) 提交于 2019-12-03 02:45:02

问题:

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?

回答1:

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 negligable. Far more important to select the one that is reliable. An Array.isArray

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


回答2:

  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.



标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!