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中字符问题(二进制/十进制/十六进制及ASCII码之间的转换)
Nov 03 Javascript
ExtJS 简介 让你知道extjs是什么
Dec 29 Javascript
分享纯手写漂亮的表单验证
Nov 19 Javascript
jQuery Html控件基本操作(日常收集整理)
Mar 11 Javascript
Bootstrap缩略图的创建方法
Mar 22 Javascript
validationEngine 表单验证插件使用实例代码
Jun 15 Javascript
Angular+Node生成随机数的方法
Jun 16 Javascript
微信小程序的生命周期的详解
Oct 19 Javascript
vue的状态管理模式vuex
Nov 30 Javascript
AngularJS对动态增加的DOM实现ng-keyup事件示例
Mar 12 Javascript
Angular4 反向代理Details实践
May 30 Javascript
JavaScript命令模式原理与用法实例详解
Mar 10 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管理内存函数 memory_get_usage()使用介绍
2012/09/23 PHP
php设置session值和cookies的学习示例
2014/03/21 PHP
PHP实现递归复制整个文件夹的类实例
2015/08/03 PHP
PHP中header函数的用法及其注意事项详解
2016/06/13 PHP
简述php环境搭建与配置
2016/12/05 PHP
Laravel 5.5 实现禁用用户注册示例
2019/10/24 PHP
PHP使用PhpSpreadsheet操作Excel实例详解
2020/03/26 PHP
Mootools 1.2教程(21)——类(二)
2009/09/15 Javascript
ASP.NET jQuery 实例17 通过使用jQuery validation插件校验ListBox
2012/02/03 Javascript
jquery实现图片按比例缩放示例
2014/07/01 Javascript
jquery实现textarea输入框限制字数的方法
2015/01/15 Javascript
Jquery 自定义事件实现发布/订阅的简单实例
2016/06/12 Javascript
JS获取html元素的标记名实现方法
2016/10/08 Javascript
JS+HTML5实现的前端购物车功能插件实例【附demo源码下载】
2016/10/17 Javascript
JavaScript 上传文件(psd,压缩包等),图片,视频的实现方法
2017/06/19 Javascript
webpack使用 babel-loader 转换 ES6代码示例
2017/08/21 Javascript
Parcel 打包示例(React HelloWorld)
2018/01/16 Javascript
Vue中用props给data赋初始值遇到的问题解决
2018/11/27 Javascript
小程序封装wx.request请求并创建接口管理文件的实现
2019/04/29 Javascript
JS实现的tab切换并显示相应内容模块功能示例
2019/08/03 Javascript
Vue父子传递实例讲解
2020/02/14 Javascript
Python3字符串学习教程
2015/08/20 Python
Python通过递归函数输出嵌套列表元素
2020/10/15 Python
html5 浏览器支持 如何让所有的浏览器都支持HTML5标签样式
2012/12/07 HTML / CSS
如何利用input事件来监听移动端的输入
2016/04/15 HTML / CSS
HTML5中的拖放实现详解
2017/08/23 HTML / CSS
联想澳大利亚官网:Lenovo Australia
2018/01/18 全球购物
Tech21美国/加拿大:英国NO.1防摔保护壳品牌
2018/01/20 全球购物
Oracle的内存结构(Memory structures)
2015/06/10 面试题
2014红色之旅心得体会
2014/10/07 职场文书
群众路线教育查摆剖析材料
2014/10/10 职场文书
试用期辞职信范文
2015/03/02 职场文书
一百条裙子读书笔记
2015/07/01 职场文书
Nginx反向代理及负载均衡如何实现(基于linux)
2021/03/31 Servers
OpenCV-Python实现轮廓的特征值
2021/06/09 Python
【DOTA2】高能暴走TK秀!PSG LGD vs ASTER - DPC 2022 WINTER TOUR CN
2022/04/02 DOTA