资讯专栏INFORMATION COLUMN

[学习笔记] JavaScript 检测数组

ZweiZhao / 1400人阅读

摘要:从而将传入的数组误判为非数组。每个类在内部都有一个属性,这个属性就指定了上述字符串中的构造函数名。的方法不能检测非原生的构造函数的构造函数名,因此,开发人员定义的任何构造函数都将返回。

JS的经典问题之一就是“检测一个对象是不是数组”,本文总结了3种检测方法。

instanceof检测方法
var arr = [];
if (arr instanceof Array) {
    // do something
}

存在问题
instanceof 操作符假设只有一个全局执行环境。如果网页中包含多个框架,那实际上存在两个以上的不同全局执行环境,从而存在两个以上不同版本的Array构造函数。如果从一个框架向另一个框架传入数组,那么传入的数组与第二框架中原生的数组分别具有各自不同的构造函数。从而将传入的数组误判为非数组。

如果只有一个全局执行环境,可以用 instanceof 检测数组。

Array.isArray()方法
var arr = [];
if (Array.isArray(arr)) {
    // do something
}

这个方法克服了instanceof的问题,可以确定某个变量是不是数组,而不管它是在哪个全局执行环境中创建的。
但是支持Array.isArray()方法的浏览器有IE9+、Firefox4+、Safari5+、Opera10.5+和Chrome。对于不支持这个方法的浏览器怎么办呢?第三种——万能方法。

万能方法
function isArray(arr) {
    return Object.prototype.toString.call(arr) == "[object Array]";
}

var arr = [];
isArray(arr);

原理
在任何值上调用Object原生的toString() 方法,都会返回一个[object NativeConstructorName] 格式的字符串。每个类在内部都有一个[ [Class] ]属性,这个属性就指定了上述字符串中的构造函数名NativeConstructorName。如:

var arr = [];
console.log(Object.pototype.toString.call(arr)); // "[object Array]"

这种思路也可用于检测某个值是不是原生函数或正则表达式。

// Array
Object.prototype.toString.call(value); // "[object Array]"

// Function
Object.prototype.toString.call(value); // "[object Function]"

// RegExp
Object.prototype.toString.call(value); // "[object RegExp]"

// Date
Object.prototype.toString.call(value); // "[object Date]"
  

Object的toString()方法不能检测非原生的构造函数的构造函数名,因此,开发人员定义的任何构造函数都将返回[object Object]。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/85777.html

相关文章

  • JavaScript框架学习笔记(一)

    摘要:基本的学习思路是跟着框架设计这本书,甚至可以说是这本书的读书笔记。也参考很多网上解读的博客和学习资料。当然,最重要的资料还是框架的源代码。后来由于开发者反对,新兴的框架都在命名空间上构建。 JavaScript框架学习笔记(一) 我为什么要学习框架 更深入的理解工具,以后用起来更顺手而且也能做一定的工具取舍,学习理解新工具也就更快, 对提升js水平也很有帮助,框架有很多解决坑的经典思...

    Shonim 评论0 收藏0
  • es5学习笔记——拜读JavaScript高级程序设计(持续更新)

    摘要:当以非构造函数形式被调用时,等同于。并且,函数执行完毕后,其活动对象不会被销毁,因为匿名函数的作用域链仍然在引用这个活动对象。知道闭包被销毁,创建函数的活动对象才会被回收。 本着尽可能多的完善基础知识,打好基础,做一条有梦想的咸鱼。 1.数据类型 基本数据类型:Undefined,Null,Boolean,Number,String,一种复杂数据类型Object 2.typeof操...

    reclay 评论0 收藏0
  • Lodash学习笔记 - slice函数

    摘要:文档地址中文文档英文文档源码地址第一个函数是,不过源码中依赖了,所以第一篇文章就从开始。这个函数的作用就是裁剪数组,从下标开始,到下标结束,但是并不包含,并将结果作为一个数组返回。并且注明了这个方法用于代替来确保数组正确返回。 百忙之中(闲来无事)想抽点时间好好读一下源码,于是就选了Lodash来写一个系列罢。读源码顺序就按照loadsh文档顺序来。 文档地址:中文文档   英文文档源...

    lei___ 评论0 收藏0
  • javascript高级程序设计》笔记检测数组的方法

    摘要:如果网页中包含多个框架,那实际上就存在两个以上不同的全局执行环境,从而存在两个以上不同版本的构造函数。如果你从一个框架向另一个框架传入一个数组,那么传入的数组与在第二个框架中原生创建的数组分别具有各自不同的构造函数。 如何检测某个变量是否为数组? 《javascript 高级程序设计》原文摘录: 自从 ECMAScript 3 做出规定以后,就出现了确定某个对象是不是数组的经典问题...

    wums 评论0 收藏0
  • javascript高程3 学习笔记(二)

    摘要:的理解函数与其他语言函数最大的不同在于,其不介意传入多少参数以及参数的类型比如函数的形参有两个,但是调用函数传入的参数可以写一个,三个或不写参数对应等,解析器都可以正常解析,这是因为中参数在内部是以一个数组形式来表示,故而不需要关系传入参数 ECMAScript function的理解 ECMAScript 函数与其他语言函数最大的不同在于,其不介意传入多少参数以及参数的类型...

    JerryWangSAP 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<