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 相关文章推荐
为jquery.ui.dialog 增加“自动记住关闭时的位置”的功能
Nov 24 Javascript
jQuery1.6 使用方法一
Nov 23 Javascript
jQuery+css3动画属性制作猎豹浏览器宽屏banner焦点图
Mar 16 Javascript
JavaScript实现把数字转换成中文
Jun 29 Javascript
Active控件问题小结(附解决办法)
Jun 09 Javascript
Vuejs仿网易云音乐实现听歌及搜索功能
Mar 30 Javascript
关于JavaScript语句后面的分号问题
Dec 07 Javascript
vue中使用heatmapjs的示例代码(结合百度地图)
Sep 05 Javascript
微信小程序 调用微信授权窗口相关问题解决
Jul 25 Javascript
教你如何用Node实现API的转发(某音乐)
Sep 20 Javascript
vue渲染方式render和template的区别
Jun 05 Javascript
js前端传json后台接收‘‘被转为quot的问题解决
Nov 12 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和ACCESS写聊天室(二)
2006/10/09 PHP
phpMyAdmin 链接表的附加功能尚未激活的问题
2010/08/01 PHP
基于PHP CURL获取邮箱地址的详解
2013/06/03 PHP
win7 wamp 64位 php环境开启curl服务遇到的问题及解决方法
2018/09/16 PHP
php如何计算两坐标点之间的距离
2018/12/29 PHP
Laravel Eloquent分表方法并使用模型关联的实现
2019/11/25 PHP
innertext , insertadjacentelement , insertadjacenthtml , insertadjacenttext 等区别
2007/06/29 Javascript
JQuery 学习笔记 选择器之一
2009/07/23 Javascript
初识javascript 文档碎片
2010/07/13 Javascript
合并table相同单元格的jquery插件分享(很精简)
2011/06/20 Javascript
js 调用本地exe的例子(支持IE内核的浏览器)
2012/12/26 Javascript
JavaScript实现简单图片滚动附源码下载
2014/06/17 Javascript
使用jQuery jqPlot插件绘制柱状图
2014/12/18 Javascript
javascript继承的六大模式小结
2015/04/13 Javascript
jquery序列化方法实例分析
2015/06/10 Javascript
介绍JavaScript中Math.abs()方法的使用
2015/06/14 Javascript
jquery获取复选框checkbox的值实现方法
2016/05/30 Javascript
相册展示PhotoSwipe.js插件实现
2016/08/25 Javascript
简单的三步vuex入门
2018/05/20 Javascript
js实现时钟定时器
2020/03/26 Javascript
vue中实现图片压缩 file文件的方法
2020/05/28 Javascript
JavaScript动态生成表格的示例
2020/11/02 Javascript
python自动安装pip
2014/04/24 Python
详解Python3中的Sequence type的使用
2015/08/01 Python
python3+PyQt5实现使用剪贴板做复制与粘帖示例
2017/01/24 Python
Python MySQL数据库连接池组件pymysqlpool详解
2017/07/07 Python
python虚拟环境virtualenv的使用教程
2017/10/20 Python
简单了解pytest测试框架setup和tearDown
2020/04/14 Python
巴西图书和电子产品购物网站:Saraiva
2017/06/07 全球购物
性能服装:HYLETE
2018/08/14 全球购物
意大利一家专营包包和配饰的网上商店:Borse Last Minute
2019/08/26 全球购物
罗技英国官方网站:Logitech UK
2020/11/03 全球购物
员工工作表扬信范文
2014/01/13 职场文书
结婚喜宴主持词
2014/03/14 职场文书
2014年社区党建工作汇报材料
2014/11/02 职场文书
超市收银员岗位职责
2015/04/07 职场文书