javascript 判断一个对象为数组的方法


Posted in Javascript onMay 03, 2017

javascript 判断一个对象为数组的方法

数组对象

js的数组是无类型的:数组元素可以是任意类型,并且同一个数组中的不同元素也可能有不同的类型。数组的元素可以是对象或其他数组,这样就可以创建复杂的数据结构。

通常我们可以用一元运算符typeof来判断js的数据类型,但是对于数组这样一个特殊的对象却只能返回"object"

typeof [1,2,3]
"object"
typeof 100
"number"
typeof false
"boolean"
typeof undefined
"undefined"
typeof NaN
"number"
typeof function(){}
"function"
typeof null
"object"

判断数组的方法

instanceof

instanceof 是一个二元运算符,左边操作数是一个对象,不是的话返回false,右边操作数是一个函数对象或者函数构造器,不是的话返回false。原理是通过判断左操作数的对象的原型链上是否具有右操作数的构造函数的prototype属性。

[1,2] instanceof Array 
true

Array.isArray(arr)

这个ES5新增的一个Array方法,该方法是Array对象的一个静态函数,用来判断一个对象是不是数组。

Array.isArray([1,2])
true

如果页面里面有n个frame,就存在多个window,每个window都有自己的Array对象,比如确定子window里的某个数组是不是Array时,用instanceof这个方法就不行了

var fr=window.frames[0];
fr.onload=function(){
  console.log(fr.arr instanceof Array);//false
  console.log(Array.isArray(fr.arr));//true
  //arr是另外一个页面的一个数组
}

Object.prototype.toString.call(arr) === “[object Array]”

Object.prototype.toString.call([1,2])
"[object Array]"

arr.constructor.name==='Array'

[1,2].constructor.name==='Array';
true

但是对象的constructor属性可以被改写,改写后用改方法判断就不行了

var arr=[1,2];
arr.constructor={};
arr.constructor.name === "Array" //undefined
false

其他方法 可以通过数组的一些独有的方法判断该对象是不是数组,比如join,push等

var c=[1,2];
c.push('3');//3
console.log(c)
[1, 2, "3"]

var c="12";
c.push('3');
//Uncaught TypeError: c.push is not a function(…)


var c=[1,2];
c.join('');
"12"

var c='12';
c.join('');
//Uncaught TypeError: c.join is not a function(…)

总结

通过上面的几种判断对象为数组对象的方法分析,使用Array.isArray(arr)和Oblect.prototype.toString.call(arr)是比较好的方法。

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
js Function类型
Dec 04 Javascript
让元素在网页中可拖动示例代码
Aug 13 Javascript
JavaScript获取路径设计源码
May 22 Javascript
js阻止事件追加的具体实现
Oct 15 Javascript
JS组件Bootstrap Select2使用方法详解
Apr 17 Javascript
javascript时间差插件分享
Jul 18 Javascript
window.open打开窗口被拦截的快速解决方法
Aug 04 Javascript
JavaScript使用键盘输入控制实现数字验证功能
Aug 19 Javascript
AngularJs Understanding the Model Component
Sep 02 Javascript
Bootstrap警告(Alerts)的实现方法
Mar 22 Javascript
React router动态加载组件之适配器模式的应用详解
Sep 12 Javascript
解决vue2中使用elementUi打包报错的问题
Sep 22 Javascript
深入理解node.js之path模块
May 03 #Javascript
判断颜色是否合法的正则表达式(详解)
May 03 #Javascript
Vue input控件通过value绑定动态属性及修饰符的方法
May 03 #Javascript
ES6中参数的默认值语法介绍
May 03 #Javascript
Express之get,pos请求参数的获取
May 02 #Javascript
利用prop-types第三方库对组件的props中的变量进行类型检测
May 02 #Javascript
xmlplus组件设计系列之路由(ViewStack)(7)
May 02 #Javascript
You might like
PHP三元运算符的结合性介绍
2012/01/10 PHP
详解PHP版本兼容之openssl调用参数
2018/07/25 PHP
根据分辨率不同,调用不同的css文件
2006/07/07 Javascript
Prototype PeriodicalExecuter对象 学习
2009/07/19 Javascript
js实现日期级联效果
2014/01/23 Javascript
jQuery打印指定区域Html页面并自动分页
2014/07/04 Javascript
js显示文本框提示文字的方法
2015/05/07 Javascript
JS+CSS实现DIV层的展开、收缩效果
2016/01/28 Javascript
自己动手制作基于jQuery的Web页面加载进度条插件
2016/06/03 Javascript
基于bootstrap-datetimepicker.js不支持IE8的快速解决方法
2016/11/07 Javascript
利用VUE框架,实现列表分页功能示例代码
2017/01/12 Javascript
nodejs中全局变量的实例解析
2017/03/07 NodeJs
JavaScript设计模式之策略模式详解
2017/06/09 Javascript
基于JS实现仿京东搜索栏随滑动透明度渐变效果
2017/07/10 Javascript
axios如何取消重复无用的请求详解
2019/12/15 Javascript
如何通过JS实现日历简单算法
2020/10/14 Javascript
[02:07]DOTA2新英雄展现中国元素,完美“圣典”亮相央视
2016/12/19 DOTA
python使用Tkinter实现在线音乐播放器
2018/01/30 Python
python如何实现int函数的方法示例
2018/02/19 Python
python模块导入的细节详解
2018/12/10 Python
Python为何不能用可变对象作为默认参数的值
2019/07/01 Python
Python3+Appium安装使用教程
2019/07/05 Python
python实现QQ邮箱发送邮件
2020/03/06 Python
python3的pip路径在哪
2020/06/23 Python
Django静态文件加载失败解决方案
2020/08/26 Python
python+requests实现接口测试的完整步骤
2020/10/27 Python
canvas粒子动画背景的实现示例
2018/09/03 HTML / CSS
如何判断计算机可能已经中马
2013/03/22 面试题
2013年保送生自荐信格式
2013/11/20 职场文书
护士求职推荐信范文
2013/11/23 职场文书
给公司的建议书范文
2014/05/13 职场文书
期末复习计划
2015/01/19 职场文书
合作意向协议书
2015/01/29 职场文书
vue如何批量引入组件、注册和使用详解
2021/05/12 Vue.js
深入探讨opencv图像矫正算法实战
2021/05/21 Python
详解CSS中的特指度和层叠问题
2021/07/15 HTML / CSS