JS检测数组类型的方法小结


Posted in Javascript onMarch 14, 2017

1.instanceof

当只有一个全局执行环境时适用,如果包含多个框架,就存在两个以上不同版本的Array构造函数,如果从一个框架向另一个框架传递数组,传入的数组与在第二个框架中原生创建的数组分别具有不同的构造函数,即为不同类型

if (value instanceof Array) {
  //对数组执行某项操作   
}

2. Array.isArray() 方法

因为是ES5新增的,只支持IE9+、Firefox 4+、Safari 5+、Opera 10.5+和Chrome

if (Array.isArray(value)) {
  //对数组执行某些操作 
}

3.Object.prototype.toString.call()方法

适用于所有环境,只支持原生的对象,Object的toString()方法不能检测非原生构造函数的构造函数名。开发人员自定义的任何构造函数都将返回[object Object]

原理:在任何值上直接调用Object的原生toString()方法,都会返回[object NativeConstrctorName]格式的字符串,每个类内部都有一个class属性,这个属性中就指定了上述字符串中构造函数名。

var value = []
console.log(Object.prototype.toString.call(value))//"[Object Array]"

由于原生数组的构造函数名和作用域无关,因此使用toString()方法就能保证输出一样的值。 

为什么不使用对象自己的toString() 方法?

var value = []
console.log(value.toString())//" "
value = ['pp','oo']
console.log(value.toString())//"pp,oo"
value = ['pp',"oo"]
console.log(Object.prototype.toString.call(value))//[object Array]

Array的tostring()方法被重写了(很多原生对象均如此),所以它会调用自己构造函数上的toString()方法,返回其他的字符串

还可以用此方法来判断是不是原生函数或者正则表达式

function isFunction(value){
    return Object.prototype.toString.call(value) === “[object Function]”
}//不适用于IE中以COM对象实现的任何函数
function isRegExp(value){
    return Object.prototype.toString.call(value) === “[object RegExp]”
}

以上所述是小编给大家介绍的JS检测数组类型的方法小结,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JavaScript null和undefined区别分析
Oct 14 Javascript
学习面向对象之面向对象的基本概念:对象和其他基本要素
Nov 30 Javascript
html超链接打开窗口大小的方法
Mar 05 Javascript
Javascript获取CSS伪元素属性的实现代码
Sep 28 Javascript
javascript实现百度地图鼠标滑动事件显示、隐藏
Apr 02 Javascript
jQuery判断指定id的对象是否存在的方法
May 22 Javascript
AngularJS 中使用Swiper制作滚动图不能滑动的解决方法
Nov 15 Javascript
Jquery Easyui表单组件Form使用详解(30)
Dec 19 Javascript
JavaScript+Html5实现按钮复制文字到剪切板功能(手机网页兼容)
Mar 30 Javascript
Koa项目搭建过程详细记录
Apr 12 Javascript
JavaScript禁止右击保存图片,禁止拖拽图片的实现代码
Apr 28 Javascript
jQuery实现评论模块
Aug 19 jQuery
轻松理解JavaScript闭包
Mar 14 #Javascript
微信小程序 页面跳转及数据传递详解
Mar 14 #Javascript
JavaScript ES6中export、import与export default的用法和区别
Mar 14 #Javascript
微信小程序 动态绑定数据及动态事件处理
Mar 14 #Javascript
Vue 2.0+Vue-router构建一个简单的单页应用(附源码)
Mar 14 #Javascript
vuejs响应用户事件(如点击事件)
Mar 14 #Javascript
微信小程序 在线支付功能的实现
Mar 14 #Javascript
You might like
php include的妙用,实现路径加密
2008/07/29 PHP
利用PHP实现短域名互转
2013/07/05 PHP
PHP分页类集锦
2014/11/18 PHP
Laravel的throttle中间件失效问题解决方法
2016/10/09 PHP
php面试中关于面向对象的相关问题
2019/02/13 PHP
javascript 一个自定义长度的文本自动换行的函数
2007/08/19 Javascript
jQuery 入门讲解1
2009/04/15 Javascript
js 函数的副作用分析
2011/08/23 Javascript
用简洁的jQuery方法toggleClass实现隔行换色
2014/10/22 Javascript
js 获取经纬度的实现方法
2016/06/20 Javascript
javascript实现简单的可随机变色网页计算器示例
2016/12/30 Javascript
ionic 自定义弹框效果
2017/06/27 Javascript
Easyui和zTree两种方式分别实现树形下拉框
2017/08/04 Javascript
原生JS获取元素的位置与尺寸实现方法
2017/10/18 Javascript
对vuejs的v-for遍历、v-bind动态改变值、v-if进行判断的实例讲解
2018/08/27 Javascript
vue里input根据value改变背景色的实例
2018/09/29 Javascript
jquery插件开发模式实例详解
2019/07/20 jQuery
vue 实现滚动到底部翻页效果(pc端)
2019/07/31 Javascript
JS扁平化输出数组的2种方法解析
2019/09/17 Javascript
[02:09]2018DOTA2亚洲邀请赛TNC赛前采访
2018/04/04 DOTA
[02:02]特效爆炸!DOTA2珍宝之瓶待你开启
2018/08/21 DOTA
Django的HttpRequest和HttpResponse对象详解
2018/01/26 Python
python opencv之SURF算法示例
2018/02/24 Python
通过Py2exe将自己的python程序打包成.exe/.app的方法
2018/05/26 Python
Python解析多帧dicom数据详解
2020/01/13 Python
matplotlib基础绘图命令之bar的使用方法
2020/08/13 Python
CSS3 渐变(Gradients)之CSS3 线性渐变
2016/07/08 HTML / CSS
施华洛世奇天猫官方旗舰店:SWAROVSKI
2017/04/17 全球购物
类如何去实现接口
2013/12/19 面试题
自动化专业个人求职信范文
2013/12/30 职场文书
债务纠纷委托书
2014/08/30 职场文书
森马旗舰店双十一营销方案
2014/09/29 职场文书
财务工作检讨书
2014/10/29 职场文书
周末问候语大全
2015/11/10 职场文书
python numpy中setdiff1d的用法说明
2021/04/22 Python
详解Vue的sync修饰符
2021/05/15 Vue.js