本文主要介绍了JS判断数组的四种实现方法的详细说明,通过实例代码进行了非常详细的介绍,对大家的学习或工作有一定的参考价值。有需要的朋友可以参考一下。
一、前言
如何判断一个对象或者一个值是不是数组,我们在面试或者工作中经常会遇到这个问题。既然频繁出现,还是要整理一下,所以本文主要基于几种判断方法,以及模式判断的原理,是否存在问题进行讨论。
二、判断对象是否是数组的几种方式
1.通过instanceof判断
instanceof运算符用于检查构造函数的prototype属性是否出现在对象的原型链中的任何位置,并返回一个布尔值。
设a=[];
数组的实例;//真
设b={ };
数组的实例;//假
在上面的代码中,instanceof运算符检测变量A的原型链上是否存在Array.prototype属性,显然A是一个具有Array.prototype属性的数组,所以为真。
存在的问题:
需要注意的是,prototype属性是可以修改的,所以如果最初判断为真,并不总是真的。
其次,当我们的脚本有多个全局环境时,比如html中有多个iframe对象,instanceof的验证结果可能不符合预期,例如:
//为正文创建并添加iframe对象
var iframe=document . createelement( iframe );
document . body . appendchild(iframe);
//获取iframe对象的构造数组方法
xArray=window.frames[0]。数组;
//通过构造函数获取实例
var arr=new xArray(1,2,3);
arr数组的实例;//假
造成这种问题是因为iframe会产生一个新的全局环境,它也会有自己的Array.prototype属性。让不同环境下的属性都一样显然是不安全的,所以Array.prototype!==window.frames [0]。如果希望Array的arr instanceof为true,就必须确保arr是由原始数组构造函数创建的。
2.通过constructor判断
我们知道,实例的构造函数属性指向构造函数,所以是否是数组也可以通过构造函数属性来判断。
设a=[1,3,4];
a .构造函数===数组;//真
同样,这种判断会有多个全局环境的问题,会导致和instanceof一样的问题。
//为正文创建并添加iframe标记
var iframe=document . createelement( iframe );
document . body . appendchild(iframe);
//获取iframe对象的构造数组方法
xArray=window . frames[window . frames . length-1]。数组;
//通过构造函数获取实例
var arr=new xArray(1,2,3);
arr.constructor===Array//假
3.通过Object.prototype.toString.call()判断
Object.prototype.tostring()。call()可以获得不同类型的对象,比如
设a=[1,2,3]
object . prototype . tostring . call(a)===[对象数组];//真
它的强大之处在于不仅可以检查是否是数组,比如是否是函数,是否是数字等等。
//检查它是否是函数
设a=function(){ };
object . prototype . tostring . call(a)===[对象函数];//真
//检查是否是数字
设b=1;
object . prototype . tostring . call(a)===[对象号];//真
即使对于多全局环境,对象。原型。tostring()。call()可以满足预期的处理判断。
//为正文创建并添加iframe标记
var iframe=document . createelement( iframe );
document . body . appendchild(iframe);
//获取iframe对象的构造数组方法
xArray=window . frames[window . frames . length-1]。数组;
//通过构造函数获取实例
var arr=new xArray(1,2,3);
console . log(object . prototype . tostring . call(arr)==[对象数组]);//真
4.通过Array.isArray()判断
Array.isArray()用于确定传递的值是否为数组,并返回一个布尔值。
设a=[1,2,3]
array . isarray(a);//真
简单易用,对于多全局环境,Array.isArray()也能准确判断。但是,有一个问题。Array.isArray()是在ES5中提出的,也就是说在ES5之前可能不支持这个方法。怎么解决?
三、判断数组方法的最终推荐
当然还是用Array.isArray()。ES5新增的isArray()方法就是为了提供一个稳定可用的数组判断方法。为了这个目的提出好的东西而不使用它是不可能的。对于之前ES5不支持这种方式的问题,我们其实可以做好兼容性,自己打包,像这样:
如果(!Array.isArray) {
Array.isArray=function(arg) {
return object . prototype . tostring . call(arg)==[对象数组];
};
}
然后给出了几种判断数组的方法,并给出了合理的建议。如果有任何问题或错误,请支持我们。
参考资料:
绝对准确地确定一个JavaScript对象是否是一个数组
Array.isArray() - MDN
实例of - MDN
这就是本文的全部内容。希望对大家的学习有帮助,支持我们。