当前位置:网站首页>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]';
};
}
边栏推荐
- 8.C语言——位操作符与位移操作符
- 【九阳神功】2018复旦大学应用统计真题+解析
- 4.分支语句和循环语句
- Application architecture of large live broadcast platform
- Write a program to simulate the traffic lights in real life.
- [modern Chinese history] Chapter V test
- 2.C语言矩阵乘法
- (ultra detailed onenet TCP protocol access) arduino+esp8266-01s access to the Internet of things platform, upload real-time data collection /tcp transparent transmission (and how to obtain and write L
- arduino+水位传感器+led显示+蜂鸣器报警
- vector
猜你喜欢

3.猜数字游戏

(super detailed II) detailed visualization of onenet data, how to plot with intercepted data flow

7. Relationship between array, pointer and array

2. C language matrix multiplication

(超详细二)onenet数据可视化详解,如何用截取数据流绘图

Questions and answers of "Fundamentals of RF circuits" in the first semester of the 22nd academic year of Xi'an University of Electronic Science and technology

FAQs and answers to the imitation Niuke technology blog project (III)

FAQs and answers to the imitation Niuke technology blog project (II)

Mode 1 two-way serial communication is adopted between machine a and machine B, and the specific requirements are as follows: (1) the K1 key of machine a can control the ledi of machine B to turn on a

8.C语言——位操作符与位移操作符
随机推荐
Voir ui plus version 1.3.1 pour améliorer l'expérience Typescript
5. Function recursion exercise
(超详细onenet TCP协议接入)arduino+esp8266-01s接入物联网平台,上传实时采集数据/TCP透传(以及lua脚本如何获取和编写)
The overseas sales of Xiaomi mobile phones are nearly 140million, which may explain why Xiaomi ov doesn't need Hongmeng
(original) make an electronic clock with LCD1602 display to display the current time on the LCD. The display format is "hour: minute: Second: second". There are four function keys K1 ~ K4, and the fun
稻 城 亚 丁
最新坦克大战2022-全程开发笔记-2
FAQs and answers to the imitation Niuke technology blog project (III)
这次,彻底搞清楚MySQL索引
Application architecture of large live broadcast platform
6.函数的递归
String abc = new String(“abc“),到底创建了几个对象
【九阳神功】2018复旦大学应用统计真题+解析
View UI plus releases version 1.1.0, supports SSR, supports nuxt, and adds TS declaration files
[during the interview] - how can I explain the mechanism of TCP to achieve reliable transmission
MySQL锁总结(全面简洁 + 图文详解)
Network layer 7 protocol
[au cours de l'entrevue] - Comment expliquer le mécanisme de transmission fiable de TCP
Custom RPC project - frequently asked questions and explanations (Registration Center)
Wei Pai: the product is applauded, but why is the sales volume still frustrated