博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
JS中判断对象是不是数组的方法
阅读量:5930 次
发布时间:2019-06-19

本文共 2513 字,大约阅读时间需要 8 分钟。

今天有同事突然问到如何判断一个对象是不是数组,当时只想到啦instanceof操作符,后来又搜集了一些文章,总结出以下方法。

一、typeof 操作符

在js中使用typeof操作符来判断function string number boolean undefined等是没有问题的。但是如果要检测Array就没有作用了,因为typeof判断arraynull的结果都是object

alert(typeof null); // "object"alert(typeof function () {return 1;}); // "function"alert(typeof 'abcd'); // "string"alert(typeof true); //booleanalert(typeof 1); // "number"alert(typeof a); // "undefined"alert(typeof undefined); // "undefined"alert(typeof []); // "object"复制代码

二、instanceof 操作符

var arr = [];console.log(arr instanceof Array);复制代码

arr instanceof Array的含义是:判断Arrayprorotype属性是不是在arr的原型链上,是返回true,否返回false;

三、对象的constructor属性

除了instanceof,每个对象还有constructor的属性,利用它似乎也能进行Array的判断

var arr = [];console.log(arr.constructor === Array);复制代码

四、instanceof 和 constructor 的缺陷

通过使用 instanceof 和 constructor 来判断对象是不是数组,在大多数情况下是可以的,但实际上也还是有缺陷的,当页面上有多个frame,需要在多个iframe中来回切换时,这种方法的缺陷就表现出来啦。

由于每个iframe都有一套自己的执行环境,跨frame实例化的对象彼此是不共享原型链的,因此导致instanceofconstructor失效。

var iframe = document.createElement('iframe'); //创建iframedocument.body.appendChild(iframe); //添加到body中xArray = window.frames[window.frames.length-1].Array;var arr = new xArray(1,2,3); // 声明数组[1,2,3]alert(arr instanceof Array); // falsealert(arr.constructor === Array); // false 复制代码

五、Object.prototype.toString

Object.prototype.toString的行为:首先,取得对象的一个内部属性[[Class]],然后依据这个属性,返回一个类似于"[object Array]"的字符串作为结果(看过ECMA标准的应该都知道,[[]]用来表示语言内部用到的、外部不可直接访问的属性,称为“内部属性”)。利用这 个方法,再配合call,我们可以取得任何对象的内部属性[[Class]],然后把类型检测转化为字符串比较,以达到我们的目的。

function isArrayFn (o) {return Object.prototype.toString.call(o) === '[object Array]';}var arr = [1,2,3,1];alert(isArrayFn(arr));// true 复制代码

call改变toString的this引用为待检测的对象,返回此对象的字符串表示,然后对比此字符串是否是'[object Array]',以判断其是否是Array的实例。为什么不直接o.toString()?嗯,虽然Array继承自Object,也会有 toString方法,但是这个方法有可能会被改写而达不到我们的要求,而Object.prototype则是老虎的屁股,很少有人敢去碰它的,所以能一定程度保证其“纯洁性”:)

JavaScript 标准文档中定义: [[Class]] 的值只可能是下面字符串中的一个: Arguments, Array, Boolean, Date, Error, Function, JSON, Math, Number, Object, RegExp, String. 这种方法在识别内置对象时往往十分有用,但对于自定义对象请不要使用这种方法。

六、Array.isArray()

ECMAScript5中引入了Array.isArray()方法,用于专门判断一个对象是不是数组,是返回true,不是返回false;目前所有主流浏览器和IE9+都对其进行了支持,IE8及以下浏览器不支持该方法。

七、一种最佳的判断方法

综合以上方法的优缺点,可以有一个最佳的判断数组的写法:

var arr = [1,2,3,1];var arr2 = [{ abac : 1, abc : 2 }];function isArrayFn(value){    if (typeof Array.isArray === "function") {        return Array.isArray(value);    }else{        return Object.prototype.toString.call(value) === "[object Array]";    }}console.log(isArrayFn(arr));// trueconsole.log(isArrayFn(arr2));// true复制代码

转载地址:http://dnytx.baihongyu.com/

你可能感兴趣的文章
坐标转换convertRect
查看>>
XILINX_zynq_详解(6)
查看>>
ubuntu安装LDAP
查看>>
计算机网络术语总结4
查看>>
新手小白 python之路 Day3 (string 常用方法)
查看>>
求职路 第二章 深圳篇
查看>>
如何限制青少年无节制的玩电脑--使用智能卡登录系统
查看>>
HTML5 Geolocation API工作原理[转载]
查看>>
soapUI的简单使用(webservice接口功能测试)
查看>>
框架 Hibernate
查看>>
python-while循环
查看>>
vs2008 x64编译环境 忽略了 #ifdef WIN32
查看>>
jquery 操纵 cookies 插件(1)
查看>>
ASP文件操作(FSO)详解
查看>>
浅析C#中new、override、virtual关键字的区别
查看>>
【高德地图API】从零开始学高德JS API(二)地图控件与插件——测距、圆形编辑器、鼠标工具、地图类型切换、鹰眼鱼骨...
查看>>
erlang学习之自定义behaviour
查看>>
java的几种对象(PO,VO,DAO,BO,POJO)解释 【转】
查看>>
转换时间为 “XX分钟之前”
查看>>
jquery 之validate 笔记
查看>>