javascript判断一个对象是否为数组

javascript判断一个对象是否为数组

大家好,又见面了,我是全栈君。

在JavaScript中,可以通过typeof操作符来判断基本数据类型(Undefined、Null、Boolean、Number和String),同时相信大家也熟知typeof对于对象的判断是不准确的,因为特殊值Null被认为是一个空的对象的引用。

对于数组的创建,可以使用构造函数,通过传递数量

var colors = new Array(3);

也可以在构造函数中传递值来创建数组

var colors = new Array('red', 'blue', 'green');

创建数组的第二种基本方法是使用数组字面量

var colors = ['red', 'blue', 'green'];

判断一个对象是否为数组,最先想到的就是instanceof操作符,通过判断对象是否为Array的实例来达到目的

var array = [];
console.log(array instanceof Array); // true

使用instanceof操作符的问题在于它假定只有一个全局执行环境。

然而这在某些特殊环境下并不安全,下面引用自MDN:

在浏览器中,我们的脚本可能需要在多个窗口之间进行交互。多个窗口意味着多个全局环境,不同的全局环境拥有不同的全局对象,从而拥有不同的内置类型构造函数。这可能会引发一些问题。比如,表达式 [] instanceof window.frames[0].Array 会返回false,因为Array.prototype !== window.frames[0].Array.prototype

因此,需要另寻别的方法来判断。

大家知道在任何值上调用Object原生的toString()方法,都会返回一个[object NativeConstructorName]格式的字符串。

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

利用这一点我们可以进一步将其封装成一个通用函数

function isArray(value) {
  return Object.prototype.toString.call(value).slice(8, -1) === 'Array';
}

在ES5中,为了解决这个问题,提供了Array.isArray()方法来确定某个值到底是不是数组,而不管它是在哪个全局作用域中创建的。

var colors = [];
console.log(Array.isArray(colors)); // true

行文到此应该结束了,因为判断数组的方法其实没有什么好说的。但是在ES6中,由于增加了一种新数据类型Symbol,并通过Symbol暴露了一些内部操作,导致了在判断的结果上会出现一些不确定情况。

和本文相关的一个是Symbol.hasInstance方法,它是执行操作符instanceof时内部调用的方法,用于检测对象的继承信息。当我们调用colors instanceof Array时,实际上调用的是Array[Symbol.hasInstance](colors)

如果没有了解过Symbol的童鞋还不清楚这意味着什么,且看下面的例子:

var sameArray = {
  [Symbol.hasInstance](instance) {
    return Array.isArray(instance);
  }
}

console.log([] instanceof sameArray); // true

这里我们定义了sameArrayinstance行为,内部调用了Array.isArray()方法来判断传入的参数是否为一个数组。同样我们可以改变一个classinstanceof行为,这里需要注意一点的是在class中是作为类的静态方法。

class Person {
  static [Symbol.hasInstance](instance) {
    return Array.isArray(instance);
  }
}

最重要的是我们可以直接改变内置Array的instanceof行为,导致其完全不可靠。

var colors = [];
Object.defineProperty(Array, Symbol.hasInstance, {
  value(v) {
    return false;
  }
})
console.log(colors instanceof Array); // false
console.log(Array.isArray(colors)); // true

上面我们提到使用Object原生的toString()方法来判断值是否为数组的实例。这在ES5中是一个很有效的方式,但在ES6中我们同样可以通过Symbol.toStringTag来改变Object.prototype.toString()的默认值。

Array.prototype[Symbol.toStringTag] = 'Magic';
var colors = [];
console.log(Object.prototype.toString.call(colors)); // "[object Magic]"

这也意味着Object.prototype.toString()不是一个十分可靠的识别对象类型的方式。

注意:虽然语言本身不会阻止你使用Symbol.toStringTag属性来改变对象内建的toString()方法的默认值,但还是不建议这样做。

最后:不论是在ES5还是ES6中,最可靠和最安全的数组判断方法是使用原生的Array.isArray()方法,而在ES3中我们可以直接使用Object.prototype.toString()来达到数组识别的目的。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/108170.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 在idea中创建web项目_idea部署web项目

    在idea中创建web项目_idea部署web项目前言:很高兴能够用自己所学知识为你提供答疑!!!今天我就来操作下如何使用idea这款软件创建web项目。步骤:1.创建项目首先新建一个项目然后选择最后一个,创建一个空白的Java项目,点击Next。这个时候给项目命名,我在这里命名为java_web,下面那个可以更改项目存放的路径,我这里放到自定的路径,点击Finish。刚进来的时候,idea会提醒你是否新建一个模块,先点击×,一会我们再创建模块。2.配置jdk这个时候,我们先来配置jdk的路径,以及tomcat的路径,方便之后

    2022年4月19日
    63
  • oracle中的rownum详解

    oracle中的rownum详解1.概述rownum是Oracle引入的虚列。在物理上这个虚列并不存在,只是在查询时才构造出来。伪列通常是自由分配的,用户无法执行修改等操作。2.特点关于rownum有以下主要特点:1)row

    2022年7月2日
    20
  • 如何通过异业联盟会员体系赋能实体商家?完善消费者的会员权益[通俗易懂]

    如何通过异业联盟会员体系赋能实体商家?完善消费者的会员权益[通俗易懂]2015年房地产行业进入白银时代,市场竞争异常剧烈,目前有万达、大禹加州湾、宏泰第一城等诸多项目,那类似的行业怎样在这激烈的市场竞争中立于不败之地?怎样才能占据更多的市场份额?怎样才能以更少的投入取得更大的回报?需要解决以上种种问题难吗?也未必难,今天向大家提出更好的方案和方法:异业联盟。异业联盟的好处1、对企业来讲可以让客户资源从10变成100甚至1000这也是资源整合,资源营销的核心。2、减少广告费用的投入,而把一部分广告的费用转嫁给消费者,为消费者省钱,符合“客

    2022年6月29日
    30
  • 如何更好地使用笔记本的触控板(Touchpad)

    如何更好地使用笔记本的触控板(Touchpad)

    2022年3月7日
    42
  • 插入排序

    插入排序

    2021年12月14日
    51
  • Pytroch入坑 3. 自己的人脸数据+迁移学习(resnet18)

    Pytroch入坑 3. 自己的人脸数据+迁移学习(resnet18)本文转载自:http://www.zhongruitech.com/856941441.html0.前言之前是使用了mnist数据,且网络结构比较简单,针对自己的数据,如何使用更复杂、经典的网络呢?1.数据集目标是人脸识别,可以看做一个多分类问题,本次实验的数据集为ferest,共200个人,1400张38080图片,比较小。分为train和val两个目录,每个目录下都有200个…

    2022年5月25日
    49

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号