唯品秀前端博客
当前位置: 前端开发 > JavaScript > javascript如何判断数据是否是数组?

javascript如何判断数据是否是数组?

2019-05-13 分类:JavaScript 作者:管理员 阅读(1503)

判断数据类型最先让人想到的那应该就是typeof操作符,这种方法对于一些常用的类型来说那算是毫无压力,比如Function、String、Number、Undefined等,但是要是检测Array的对象就不起作用了。 利用typeof除了array和null判断为object外,其他的都可以正常判断

1
2
3
4
5
6
7
8
9
alert(typeof null); // "object"
alert(typeof function () {
return 1;
}); // "function"
alert(typeof '梦龙小站'); // "string"
alert(typeof 1); // "number"
alert(typeof a); // "undefined"
alert(typeof undefined); // "undefined"
alert(typeof []); // "object"

isArray()方法

ECMAScript5将Array.isArray()正式引入JavaScript,这货是最简单直接的判断数组方法,但它不兼容IE8及其以下低版本

1
2
3
 var fruits = ["Banana", "Orange", "Apple", "Mango"];
console.log(Array.isArray(fruits))
// true

instanceof操作符

这个操作符和JavaScript中面向对象有点关系,了解这个就先得了解JavaScript中的面向对象。因为这个操作符是检测对象的原型链是否指向构造函数的prototype对象的。

1
2
var arr = ['1',2,3,4];
alert(arr instanceof Array); // true

对象的constructor属性

除了instanceof,每个对象还有constructor的属性,利用它似乎也能进行Array的判断。

1
2
var arr = [1,2,3,1];
alert(arr.constructor === Array); // true

网上看到帖子说上面这些方法都有弊端,比如第一个兼容性不太好,后面两种在多个frame中来回穿梭的时候,这两种方法就亚历山大了。由于每个iframe都有一套自己的执行环境,跨frame实例化的对象彼此是不共享原型链的,因此导致上述检测代码失效,例如:

1
2
3
4
5
6
var iframe = document.createElement('iframe'); //创建iframe
document.body.appendChild(iframe); //添加到body中
xArray = window.frames[window.frames.length-1].Array;
var arr = new xArray(1,2,3); // 声明数组[1,2,3]
alert(arr instanceof Array); // false
alert(arr.constructor === Array); // false

无懈可击检测数组类型方法

Object.prototype.toString的行为:首先,取得对象的一个内部属性[[Class]],然后依据这个属性,返回一个类似于"[object Array]"的字符串作为结果(看过ECMA标准的应该都知道,[[]]用来表示语言内部用到的、外部不可直接访问的属性,称为“内部属性”)。利用这 个方法,再配合call,我们可以取得任何对象的内部属性[[Class]],然后把类型检测转化为字符串比较,以达到我们的目的。

1
2
3
4
5
function isArrayFn (o) {
return Object.prototype.toString.call(o) === '[object Array]';
}
var arr = [1,2,3,1];
alert(isArrayFn(arr));// true

call改变toString的this引用为待检测的对象,返回此对象的字符串表示,然后对比此字符串是否是'[object Array]',以判断其是否是Array的实例。为什么不直接o.toString()?嗯,虽然Array继承自Object,也会有 toString方法,但是这个方法有可能会被改写而达不到我们的要求,而Object.prototype则是老虎的屁股,很少有人敢去碰它的,所以能一定程度保证其“纯洁性”:)

「两年博客,如果觉得我的文章对您有用,请帮助本站成长」

赞(1) 打赏

谢谢你请我吃鸡腿*^_^*

支付宝
微信
1

谢谢你请我吃鸡腿*^_^*

支付宝
微信
标签:

上一篇:

下一篇:

你可能感兴趣

共有 0 条评论 - javascript如何判断数据是否是数组?

博客简介

唯品秀博客: weipxiu.com,一个关注Web前端开发技术、关注用户体验、坚持更多原创实战教程的个人网站,愿景:成为宇宙中最具有代表性的前端博客,期待您的参与,主题源码 

精彩评论

友情链接

他们同样是一群网虫,却不是每天泡在网上游走在淘宝和网游之间、刷着本来就快要透支的信用卡。他们或许没有踏出国门一步,但同学却不局限在一国一校,而是遍及全球!申请交换友链

站点统计

  • 文章总数: 235 篇
  • 草稿数目: 0 篇
  • 分类数目: 14 个
  • 独立页面: 6 个
  • 评论总数: 876 条
  • 链接总数: 13 个
  • 标签总数: 424 个
  • 建站时间: 1008 天
  • 注册用户: 2228 人
  • 访问总量: 8912095 次
  • 最近更新: 2019年9月19日
服务热线:
 173xxxx7240

 QQ在线交流

 旺旺在线