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事件冒泡传递(cancelBubble 、stopPropagation)
May 08 Javascript
IE6下opacity与JQuery的奇妙结合
Mar 01 Javascript
select标记美化--JS式插件、后期加载
Apr 01 Javascript
js计算两个时间之间天数差的实例代码
Nov 19 Javascript
javascript检测浏览器的缩放状态实现代码
Sep 28 Javascript
js获取浏览器基本信息大全
Nov 27 Javascript
从零学习node.js之简易的网络爬虫(四)
Feb 22 Javascript
使用SVG基本操作API的实例讲解
Sep 14 Javascript
laydate如何根据开始时间或者结束时间限制范围
Nov 15 Javascript
深入理解使用Vue实现Context-Menu的思考与总结
Mar 09 Javascript
layui自定义验证,用ajax查询后台是否有重复数据,form.verify的例子
Sep 06 Javascript
js实现简单的日历显示效果函数示例
Nov 25 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 foreach 使用&(与运算符)引用赋值要注意的问题
2010/02/16 PHP
Linux下从零开始安装配置Nginx服务器+PHP开发环境
2015/12/21 PHP
php版微信公众账号第三方管理工具开发简明教程
2016/09/23 PHP
PHP房贷计算器实例代码,等额本息,等额本金
2017/04/01 PHP
浅谈PHP中的面向对象OOP中的魔术方法
2017/06/12 PHP
替代window.event.srcElement效果的可兼容性的函数
2009/12/18 Javascript
js操作二级联动实现代码
2010/07/27 Javascript
jquery实现表格奇数偶数行不同样式(有图为证及实现代码)
2013/01/23 Javascript
jquery的ajaxSubmit()异步上传图片并保存表单数据演示代码
2013/06/04 Javascript
jquery next nextAll nextUntil siblings的区别介绍
2013/10/05 Javascript
javascript结合canvas实现图片旋转效果
2015/05/03 Javascript
jQuery插件EasyUI设置datagrid的checkbox为禁用状态的方法
2016/08/05 Javascript
jQuery图片轮播实现并封装(一)
2016/12/03 Javascript
利用node.js搭建简单web服务器的方法教程
2017/02/20 Javascript
js实现简单的获取验证码按钮效果
2017/03/03 Javascript
js 获取json数组里面数组的长度实例
2017/10/31 Javascript
VueJs 搭建Axios接口请求工具
2017/11/20 Javascript
Node.js使用Angular简单示例
2018/05/11 Javascript
node.js的Express服务器基本使用教程
2019/01/09 Javascript
关于element-ui表单中限制输入纯数字的解决方式
2020/09/08 Javascript
NodeJS和浏览器中this关键字的不同之处
2021/03/03 NodeJs
Python的Tornado框架实现异步非阻塞访问数据库的示例
2016/06/30 Python
你所不知道的Python奇技淫巧13招【实用】
2016/12/14 Python
对Python中DataFrame按照行遍历的方法
2018/04/08 Python
pandas通过索引进行排序的示例
2018/11/16 Python
python实现贪吃蛇游戏
2020/03/21 Python
Python pip install如何修改默认下载路径
2020/04/29 Python
Python Socket多线程并发原理及实现
2020/12/11 Python
美国益智玩具购物网站:Fat Brain Toys
2017/11/03 全球购物
档案管理员岗位职责
2013/12/01 职场文书
产品质量承诺书范文
2014/03/27 职场文书
孩子教育的心得体会
2014/09/01 职场文书
商业用房租赁协议书
2014/10/13 职场文书
2015年求职自荐信范文
2015/03/04 职场文书
致短跑运动员加油稿
2015/07/21 职场文书
2016应届大学生自荐信模板
2016/01/28 职场文书