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 相关文章推荐
Javascript 面向对象之重载
May 04 Javascript
jQuery代码优化 遍历篇
Nov 01 Javascript
JS图片无缝滚动(简单利于使用)
Jun 17 Javascript
jQuery如何实现点击页面获得当前点击元素的id或其他信息
Jan 09 Javascript
JavaScript获取当前页面上的指定对象示例代码
Feb 28 Javascript
jQuery过滤HTML标签并高亮显示关键字的方法
Aug 07 Javascript
JS中闭包的经典用法小结(2则示例)
Dec 28 Javascript
微信浏览器禁止页面下拉查看网址实例详解
Jun 28 Javascript
React Native 集成jpush-react-native的示例代码
Aug 16 Javascript
详解使用webpack打包编写一个vue-toast插件
Nov 08 Javascript
小程序实现日历左右滑动效果
Oct 21 Javascript
小程序如何写动态标签的实现方法
Feb 05 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的ob_start();控制您的浏览器cache!
2006/11/25 PHP
PHP实现格式化文件数据大小显示的方法
2015/01/03 PHP
PHP中的命名空间相关概念浅析
2015/01/22 PHP
php实现替换手机号中间数字为*号及隐藏IP最后几位的方法
2016/11/16 PHP
PHP PDOStatement::nextRowset讲解
2019/02/01 PHP
PHP htmlspecialchars_decode()函数用法讲解
2019/03/01 PHP
Mac系统下搭建Nginx+php-fpm实例讲解
2020/12/15 PHP
nodejs命令行参数处理模块commander使用实例
2014/09/17 NodeJs
2014最热门的JavaScript代码高亮插件推荐
2014/11/25 Javascript
jQuery使用prepend()方法在元素前添加内容用法实例
2015/03/26 Javascript
javascript中$(function() {});写与不写有哪些区别
2015/08/10 Javascript
浅谈javascript的Array.prototype.slice.call
2015/08/31 Javascript
用jQuery的AJax实现异步访问、异步加载
2016/11/02 Javascript
JS实现的简单轮播图运动效果示例
2016/12/22 Javascript
详解PHP中pathinfo()函数导致的安全问题
2017/01/05 Javascript
jquery表单验证插件validation使用方法详解
2017/01/20 Javascript
限时抢购-倒计时的完整实例(分享)
2017/09/17 Javascript
在vue中使用css modules替代scroped的方法
2018/03/10 Javascript
vue3.0 CLI - 2.6 - 组件的复用入门教程
2018/09/14 Javascript
vue使用laydate时间插件的方法
2018/11/14 Javascript
Vue实现数据请求拦截
2019/10/23 Javascript
微信小程序语音同步智能识别的实现案例代码解析
2020/05/29 Javascript
解读Python中degrees()方法的使用
2015/05/18 Python
快速了解Python中的装饰器
2018/01/11 Python
Django页面数据的缓存与使用的具体方法
2019/04/23 Python
对PyQt5的输入对话框使用(QInputDialog)详解
2019/06/25 Python
如何用Python和JS实现的Web SSH工具
2021/02/23 Python
Anya Hindmarch官网:奢侈设计师手袋及配饰
2018/11/15 全球购物
华为c/c++笔试题
2016/01/25 面试题
试述DBMS的主要功能
2016/11/13 面试题
保密承诺书
2014/03/27 职场文书
3.15消费者权益日活动总结
2015/02/09 职场文书
因家庭原因离职的辞职信范文
2015/05/12 职场文书
企业法人任命书
2015/09/21 职场文书
Python基础之进程详解
2021/05/21 Python
Python加密与解密模块hashlib与hmac
2022/06/05 Python