判断一个变量是数组Array类型的方法

 更新时间:2013年09月16日 12:12:04   投稿:whsnow  
JavaScript中如何判断一个变量是数组Array类型呢?本文向大家提供一个比较不错的方法,可以说是无懈可击了

在很多时候,我们都需要对一个变量进行数组类型的判断。JavaScript中如何判断一个变量是数组Array类型呢?我最近研究了一下,并分享给大家,希望能对大家有所帮助。

JavaScript中检测对象的方法
1.typeof操作符
这种方法对于一些常用的类型来说那算是毫无压力,比如Function、String、Number、Undefined等,但是要是检测Array的对象就不起作用了。

复制代码 代码如下:

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"

2.instanceof操作符
这个操作符和JavaScript中面向对象有点关系,了解这个就先得了解JavaScript中的面向对象。因为这个操作符是检测对象的原型链是否指向构造函数的prototype对象的。
var arr = [1,2,3,1];
alert(arr instanceof Array); // true
3.对象的constructor属性
除了instanceof,每个对象还有constructor的属性,利用它似乎也能进行Array的判断。
复制代码 代码如下:

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

复制代码 代码如下:

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

检测数组类型方法
以上那些方法看上去无懈可击,但是终究会有些问题,接下来向大家提供一些比较不错的方法,可以说是无懈可击了。
1.Object.prototype.toString
Object.prototype.toString的行为:首先,取得对象的一个内部属性[[Class]],然后依据这个属性,返回一个类似于"[object Array]"的字符串作为结果(看过ECMA标准的应该都知道,[[]]用来表示语言内部用到的、外部不可直接访问的属性,称为“内部属性”)。利用这 个方法,再配合call,我们可以取得任何对象的内部属性[[Class]],然后把类型检测转化为字符串比较,以达到我们的目的。
复制代码 代码如下:

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

JavaScript 标准文档中定义: [[Class]] 的值只可能是下面字符串中的一个: Arguments, Array, Boolean, Date, Error, Function, JSON, Math, Number, Object, RegExp, String.
这种方法在识别内置对象时往往十分有用,但对于自定义对象请不要使用这种方法。
2.Array.isArray()
ECMAScript5将Array.isArray()正式引入JavaScript,目的就是准确地检测一个值是否为数组。IE9+、 Firefox 4+、Safari 5+、Opera 10.5+和Chrome都实现了这个方法。但是在IE8之前的版本是不支持的。
3.较好参考
综合上面的几种方法,有一个当前的判断数组的最佳写法:
复制代码 代码如下:

var arr = [1,2,3,1];
var arr2 = [{ abac : 1, abc : 2 }];
function isArrayFn(value){
if (typeof Array.isArray === "function") {
return Array.isArray(value);
}else{
return Object.prototype.toString.call(value) === "[object Array]";
}
}
alert(isArrayFn(arr));// true
alert(isArrayFn(arr2));// true

JavaScript中如何判断一个变量是数组Array类型呢?以上便是我为大家分享的JavaScript中判断一个变量是数组Array类型的方法,希望能对大家有所帮助。

相关文章

  • JavaScript模块随意拖动示例代码

    JavaScript模块随意拖动示例代码

    这篇文章主要介绍了JavaScript模块随意拖动的具体实现,需要的朋友可以参考下
    2014-05-05
  • 基于JavaScript实现自定义滚动条

    基于JavaScript实现自定义滚动条

    这篇文章主要为大家详细介绍了基于JavaScript实现自定义滚动条,可以直接使用的滚动条,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-01-01
  • 前端监控页面异常的常用方法

    前端监控页面异常的常用方法

    前端开发常见问题之一: 资源异常、js异常,页面出了问题常见的想法是:如何看到错误信息,资源脚本是否正常,像js、css、图片这些资源文件经常受网络等原因,导致资源加载异常,这些会直接影响我们的页面,本文给大家介绍前端监控页面异常的常用方法,需要的朋友可以参考下
    2025-04-04
  • canvas压缩图片转换成base64格式输出文件流

    canvas压缩图片转换成base64格式输出文件流

    本文主要介绍了canvas压缩图片转换成base64格式输出文件流的方法,具有很好的参考价值。下面跟着小编一起来看下吧
    2017-03-03
  • 原生JS实现弹幕效果的简单操作指南

    原生JS实现弹幕效果的简单操作指南

    这篇文章主要给大家介绍了关于原生JS实现弹幕效果的简单操作指南,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-11-11
  • javascript中HTMLDOM操作详解

    javascript中HTMLDOM操作详解

    这篇文章主要介绍了javascript中HTMLDOM操作详解,需要的朋友可以参考下
    2014-12-12
  • 可以读取EXCEL文件的js代码

    可以读取EXCEL文件的js代码

    js读取 EXCEL 文件 的实现代码,比较全了大家可以自行测试了。
    2009-08-08
  • js和jQuery以及easyui实现对下拉框的指定赋值方法

    js和jQuery以及easyui实现对下拉框的指定赋值方法

    下面小编就为大家分享一篇js和jQuery以及easyui实现对下拉框的指定赋值方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-01-01
  • 利用Vconsole和Fillder进行移动端抓包调试方法

    利用Vconsole和Fillder进行移动端抓包调试方法

    这篇文章主要介绍了利用Vconsole和Fillder进行移动端抓包调试,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2019-03-03
  • 微信小程序中实现双向绑定的实战过程

    微信小程序中实现双向绑定的实战过程

    最近在小程序的开发过程中,需要用到双向绑定,遇到报错才知道微信本身是不支持对象双向绑定的,折腾一番找到解决方案,下面这篇文章主要给大家介绍了关于微信小程序中实现双向绑定的相关资料,需要的朋友可以参考下
    2023-01-01

最新评论