JavaScript判断对象是否为数组


Posted in Javascript onDecember 22, 2015

文中为大家分享了三种JavaScript判断对象是否为数组的方法,

1. typeof

首先我们会想到的是使用typeof来检测数据类型,但是对于Function, String, Number, Undefined等这几种基本类型来说,使用typeof来检测都可以检测到,比如代码如下:

function test(){}
console.log(typeof 1); // number
console.log(typeof test); // function 
console.log(typeof "yunxi"); // string
console.log(typeof undefined); // undefined

但是对于数组或者正则来说,使用typeof来检测的话,那就满足不了,因为当我们检测数组或者正则的话,那么返回的类型将会是一个对象object,如下代码所示:

console.log(typeof []); // object
console.log(typeof /\d+/g); // object

2. Instanceof

由此我们很容易会想到使用instanceof来检测某个对象是否是数组的实例,该检测会返回一个布尔型(boolean),如果是数组的话,返回true,否则的话返回false;我们再来看下上面的检测是否为数组的代码如下:

console.log([] instanceof Array); // true
console.log(/\d+/g instanceof Array); // false

如上可以看到使用instanceof确实可以判断是否为数组的列子;
3. constructor属性

在javascript中,每个对象都有一个constructor属性,它引用了初始化该对象的构造函数,比如判断未知对象的类型,因此我们可以如下写一个方法,代码如下:

function isArray(obj) {
  return typeof obj == 'object' && obj.constructor == Array
}
// 测试demo
console.log(isArray([])); // true
var a = {"a":1};
console.log(isArray(a)); // false

var b = [1,2,3];
console.log(isArray(b)); // true
console.log(isArray(/\d+/g));// false

如上可以看到,通过调用isArray 方法也可以判断是否为数组的列子。
我们现在可以看到,对于第二点和第三点分别使用instanceof方法和constructor属性貌似都可以来判断是否为数组了,但是也有列外情况,比如在跨框架iframe的时候使用页面中的数组时,会失败,因为在不同的框架iframe中,创建的数组是不会相互共享其prototype属性的;如下代码测试即可得到验证~

var iframe = document.createElement('iframe');
document.body.appendChild(iframe);
xArray = window.frames[window.frames.length-1].Array;    
var arr = new xArray("1","2","3","4","5");
//这个写法IE下是不支持的,标准浏览器firefox,chrome下有

console.log(arr); // 打印出 ["1", "2", "3", "4", "5"]
console.log(arr instanceof Array); // false 
console.log(arr.constructor === Array); // false

如上的方法我们都不能来判断一个对象是否为数组的方式; 但是我们在看ECMA262中可以看到,可以使用 Object.prototype.toString.call()方法来判断一个对象是否为数组;如下代码:

function isArray(obj) {
  return Object.prototype.toString.call(obj) == '[object Array]';
}
// 代码调用
console.log(isArray([])); // true
console.log(isArray([1,2,3])); // true

var iframe = document.createElement('iframe');
document.body.appendChild(iframe);
xArray = window.frames[window.frames.length-1].Array;    
var arr = new xArray("1","2","3","4","5");

console.log(arr); // ["1","2","3","4","5"]
console.log(isArray(arr)); // true

以上就是本文的全部内容,帮助大家学习JavaScript判断对象是否为数组的方法,希望对大家的学习有所帮助。

Javascript 相关文章推荐
Javascript将string类型转换int类型
Dec 09 Javascript
JavaScript ECMA-262-3 深入解析.第三章.this
Sep 28 Javascript
jqPlot 图表中文API使用文档及源码和在线示例
Feb 07 Javascript
JQuery slideshow的一个小问题(如何发现及解决过程)
Feb 06 Javascript
Javascript实现视频轮播在pc端与移动端均可
Sep 29 Javascript
jQuery向上遍历DOM树之parents(),parent(),closest()之间的区别
Dec 02 Javascript
浅谈setTimeout 与 setInterval
Jun 23 Javascript
基于jquery实现图片相关操作(重绘、获取尺寸、调整大小、缩放)
Dec 25 Javascript
JS模拟bootstrap下拉菜单效果实例
Jun 17 Javascript
那些精彩的JavaScript代码片段
Jan 12 Javascript
微信小程序导航栏滑动定位功能示例(实现CSS3的positionsticky效果)
Jan 24 Javascript
微信小程序实现张图片合成为一张并下载
Jul 16 Javascript
javascript中类的定义方式详解(四种方式)
Dec 22 #Javascript
jquery获取select选中值的方法分析
Dec 22 #Javascript
JS设置下拉列表框当前所选值的方法
Dec 22 #Javascript
点评js异步加载的4种方式
Dec 22 #Javascript
JS模拟按钮点击功能的方法
Dec 22 #Javascript
jquery插件jquery.confirm弹出确认消息
Dec 22 #Javascript
js实现仿微博滚动显示信息的效果
Dec 21 #Javascript
You might like
PHP 中文处理技巧
2010/04/25 PHP
PHP安全配置详细说明
2011/09/26 PHP
如何判断php数组的维度
2013/06/10 PHP
php实现的百度搜索某地天气的小偷代码
2014/04/23 PHP
php字符串按照单词进行反转的方法
2015/03/14 PHP
PHP读取文件的常见几种方法
2016/11/03 PHP
PHP使用curl_multi实现并发请求的方法示例
2018/04/29 PHP
Javascript中的数学函数
2007/04/04 Javascript
ajax无刷新动态调用股票信息(改良版)
2008/11/01 Javascript
通过AJAX的JS、JQuery两种方式解析XML示例介绍
2013/09/23 Javascript
从js向Action传中文参数出现乱码问题的解决方法
2013/12/29 Javascript
基于JavaScript获取鼠标位置的各种方法
2015/12/16 Javascript
原生js二级联动效果
2017/06/20 Javascript
详解Angular2表单-模板驱动的表单(Template-Driven Forms)
2017/08/04 Javascript
Vue ElementUI之Form表单验证遇到的问题
2017/08/21 Javascript
bootstrap datetimepicker控件位置异常的解决方法
2017/11/23 Javascript
利用vue + element实现表格分页和前端搜索的方法
2017/12/25 Javascript
JS实现的文件拖拽上传功能示例
2018/05/21 Javascript
springMvc 前端用json的方式向后台传递对象数组方法
2018/08/07 Javascript
JS函数内部属性之arguments和this实例解析
2018/10/07 Javascript
react实现移动端下拉菜单的示例代码
2020/01/16 Javascript
微信小程序点击生成朋友圈分享图(遇到的坑)
2020/06/17 Javascript
Vue性能优化的方法
2020/07/30 Javascript
python密码错误三次锁定(实例讲解)
2017/11/14 Python
python 利用文件锁单例执行脚本的方法
2019/02/19 Python
python2和python3在处理字符串上的区别详解
2019/05/29 Python
使用OpenCV实现仿射变换—旋转功能
2019/08/29 Python
Python SSL证书验证问题解决方案
2020/01/13 Python
Python中join()函数多种操作代码实例
2020/01/13 Python
jupyter notebook 调用环境中的Keras或者pytorch教程
2020/04/14 Python
秘鲁购物网站:Linio秘鲁
2017/04/07 全球购物
2015年乡镇科普工作总结
2015/05/13 职场文书
终止合同协议书范本
2016/03/22 职场文书
如何起草一份正确的合伙创业协议书?
2019/07/04 职场文书
pycharm2021激活码使用教程(永久激活亲测可用)
2021/03/30 Python
CSS中float高度塌陷问题的四种解决方案
2022/04/18 HTML / CSS