当前位置:网站首页>js判断对象是否是数组的几种方式
js判断对象是否是数组的几种方式
2022-07-06 09:21:00 【玲小叮当】
js判断对象是否是数组的几种方式
1.通过instanceof判断
instanceof
运算符用于检验构造函数的prototype
属性是否出现在对象的原型链中的任何位置,返回一个布尔值。
let a = [];
a instanceof Array; //true
let b = {
};
b instanceof Array; //false
存在问题:
需要注意的是,prototype
属性是可以修改的,所以并不是最初判断为true
就一定永远为真。
其次,当我们的脚本拥有多个全局环境,例如html
中拥有多个iframe
对象,instanceof
的验证结果可能不会符合预期,例如:
//为body创建并添加一个iframe对象
var iframe = document.createElement('iframe');
document.body.appendChild(iframe);
//取得iframe对象的构造数组方法
xArray = window.frames[0].Array;
//通过构造函数获取一个实例
var arr = new xArray(1,2,3);
arr instanceof Array;//false
导致这种问题是因为iframe
会产生新的全局环境,它也会拥有自己的Array.prototype
属性,让不同环境下的属性相同很明显是不安全的做法,所以Array.prototype !== window.frames[0].Array.prototype
,想要arr instanceof Array
为true
,你得保证arr
是由原始Array
构造函数创建时才可行。
2.通过constructor判断
我们知道,实例的构造函数属性constructor
指向构造函数,那么通过constructor
属性也可以判断是否为一个数组。let a = [1,3,4]
;a.constructor === Array;//true
同样,这种判断也会存在多个全局环境的问题,导致的问题与instanceof
相同。
//为body创建并添加一个iframe标签
var iframe = document.createElement('iframe');
document.body.appendChild(iframe);
//取得iframe对象的构造数组方法
xArray = window.frames[window.frames.length-1].Array;
//通过构造函数获取一个实例
var arr = new xArray(1,2,3);
arr.constructor === Array;//false
3.通过Object.prototype.toString.call()判断
Object.prototype.toString().call()
可以获取到对象的不同类型,例如
let a = [1,2,3]
Object.prototype.toString.call(a) === '[object Array]';//true
它强大的地方在于不仅仅可以检验是否为数组,比如是否是一个函数,是否是数字等等
//检验是否是函数
let a = function () {
};
Object.prototype.toString.call(a) === '[object Function]';//true
//检验是否是数字
let b = 1;
Object.prototype.toString.call(a) === '[object Number]';//true
甚至对于多全局环境时, Object.prototype.toString().call()
也能符合预期处理判断。
//为body创建并添加一个iframe标签
var iframe = document.createElement('iframe');
document.body.appendChild(iframe);
//取得iframe对象的构造数组方法
xArray = window.frames[window.frames.length-1].Array;
//通过构造函数获取一个实例
var arr = new xArray(1,2,3);
console.log(Object.prototype.toString.call(arr) === '[object Array]');//true
4.通过Array.isArray()判断
Array.isArray()
用于确定传递的值是否是一个数组,返回一个布尔值。
let a = [1,2,3]
Array.isArray(a);//true
简单好用,而且对于多全局环境,Array.isArray()
同样能准确判断,但有个问题,Array.isArray()
是在ES5中提出,也就是说在ES5
之前可能会存在不支持此方法的情况。怎么解决呢?
判断数组方法的最终推荐
当然还是用Array.isArray()
,从ES5
新增isArray()
方法正是为了提供一个稳定可用的数组判断方法,不可能专门为此提出的好东西不用,而对于ES5之前不支持此方法的问题,我们其实可以做好兼容进行自行封装,像这样:
if (!Array.isArray) {
Array.isArray = function(arg) {
return Object.prototype.toString.call(arg) === '[object Array]';
};
}
边栏推荐
- FAQs and answers to the imitation Niuke technology blog project (I)
- MySQL锁总结(全面简洁 + 图文详解)
- ArrayList的自动扩容机制实现原理
- PriorityQueue (large root heap / small root heap /topk problem)
- 9.指针(上)
- Caching mechanism of leveldb
- 6. Function recursion
- 3. C language uses algebraic cofactor to calculate determinant
- [面試時]——我如何講清楚TCP實現可靠傳輸的機制
- 关于双亲委派机制和类加载的过程
猜你喜欢
仿牛客技术博客项目常见问题及解答(一)
Mortal immortal cultivation pointer-2
西安电子科技大学22学年上学期《射频电路基础》试题及答案
C语言入门指南
9. Pointer (upper)
(super detailed II) detailed visualization of onenet data, how to plot with intercepted data flow
Leetcode.3 无重复字符的最长子串——超过100%的解法
最新坦克大战2022-全程开发笔记-1
View UI plus released version 1.3.0, adding space and $imagepreview components
About the parental delegation mechanism and the process of class loading
随机推荐
arduino+DS18B20温度传感器(蜂鸣器报警)+LCD1602显示(IIC驱动)
The overseas sales of Xiaomi mobile phones are nearly 140million, which may explain why Xiaomi ov doesn't need Hongmeng
MPLS experiment
Application architecture of large live broadcast platform
受检异常和非受检异常的区别和理解
更改VS主题及设置背景图片
[中国近代史] 第五章测验
关于双亲委派机制和类加载的过程
Inaki Ading
[during the interview] - how can I explain the mechanism of TCP to achieve reliable transmission
C语言入门指南
Leetcode. 3. Longest substring without repeated characters - more than 100% solution
[modern Chinese history] Chapter V test
杂谈0516
1. C language matrix addition and subtraction method
String abc = new String(“abc“),到底创建了几个对象
【九阳神功】2018复旦大学应用统计真题+解析
MySQL中count(*)的实现方式
A piece of music composed by buzzer (Chengdu)
arduino+水位传感器+led显示+蜂鸣器报警