js判断数组四种实现方法详解图,js判断数组四种实现方法详解图片

js判断数组四种实现方法详解图,js判断数组四种实现方法详解图片,JS判断数组四种实现方法详解

本文主要介绍了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

这就是本文的全部内容。希望对大家的学习有帮助,支持我们。

js判断数组四种实现方法详解图,js判断数组四种实现方法详解图片