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 相关文章推荐
JS+css 图片自动缩放自适应大小
Aug 08 Javascript
jquery获取元素值的方法(常见的表单元素)
Nov 15 Javascript
js获取客户端外网ip的简单实例
Nov 21 Javascript
JavaScript清空数组元素的两种方法简单比较
Jul 10 Javascript
jquery制作属于自己的select自定义样式
Nov 23 Javascript
js实现文本框输入文字个数限制代码
Dec 25 Javascript
JavaScript类型系统之布尔Boolean类型详解
Jun 26 Javascript
vue.js 使用v-if v-else发现没有执行解决办法
May 15 Javascript
关于Vue单页面骨架屏实践记录
Dec 13 Javascript
Parcel 打包示例(React HelloWorld)
Jan 16 Javascript
element-ui 表格数据时间格式化的方法
Aug 24 Javascript
babel7.x和webpack4.x配置vue项目的方法步骤
May 12 Javascript
轻松理解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中常用的三种设计模式详解【单例模式、工厂模式、观察者模式】
2019/06/14 PHP
PHP生成zip压缩包的常用方法示例
2019/08/22 PHP
PHP设计模式(七)组合模式Composite实例详解【结构型】
2020/05/02 PHP
Javascript图像处理思路及实现代码
2012/12/25 Javascript
给事件响应函数传参数的四种方式小结
2013/12/05 Javascript
网页下载文件期间如何防止用户对网页进行其他操作
2014/06/27 Javascript
解决js下referer兼容各大浏览器的方法
2014/11/03 Javascript
javascript实现博客园页面右下角返回顶部按钮
2015/02/22 Javascript
javascript动态设置样式style实例分析
2015/05/13 Javascript
js实现的万能flv网页播放器代码
2016/04/30 Javascript
利用AJAX实现WordPress中的文章列表及评论的分页功能
2016/05/17 Javascript
jQuery元素属性操作实例(设置、获取及删除元素属性)
2016/09/08 Javascript
Angular2-primeNG文件上传模块FileUpload使用详解
2017/01/14 Javascript
详解Node 定时器
2018/02/26 Javascript
详解Vue基于vue-quill-editor富文本编辑器使用心得
2019/01/03 Javascript
详解JavaScript原生封装ajax请求和Jquery中的ajax请求
2019/02/14 jQuery
nodejs提示:cross-device link not permitted, rename错误的解决方法
2019/06/10 NodeJs
vue.js实现双击放大预览功能
2020/06/23 Javascript
javascript实现倒计时提示框
2021/03/02 Javascript
[02:08]什么藏在DOTA2 TI9“小紫本”里?斧王历险记告诉你!
2019/05/17 DOTA
Python中函数的参数传递与可变长参数介绍
2015/06/30 Python
Python中Collections模块的Counter容器类使用教程
2016/05/31 Python
详解Python之数据序列化(json、pickle、shelve)
2017/03/30 Python
pandas.DataFrame选取/排除特定行的方法
2018/07/03 Python
Python关于excel和shp的使用在matplotlib
2019/01/03 Python
在主流系统之上安装Pygame的方法
2020/05/20 Python
Python中免验证跳转到内容页的实例代码
2020/10/23 Python
如何创建一个Flask项目并进行简单配置
2020/11/18 Python
BIFFI美国站:意大利BIFFI BOUTIQUES豪华多品牌时装零售公司
2020/02/11 全球购物
《匆匆》教学反思
2014/02/22 职场文书
风险评估实施方案
2014/03/09 职场文书
2014五一国际劳动节活动总结范文
2014/04/14 职场文书
艺术设计专业毕业生推荐信
2014/07/08 职场文书
行政专员岗位职责说明书
2014/07/30 职场文书
单位同意报考证明
2015/06/17 职场文书
golang中的空接口使用详解
2021/03/30 Python