Javascript isArray 数组类型检测函数

1、typeof操作符。对于Function、String、Number、Undefined这几种类型的对象来说，不会有什么问题，但是针对Array的对象就没什么用途了：
Js代码


代码如下:

alert(typeof null); // "object"
alert(typeof []); // "object"

2、instanceof操作符。此操作符检测对象的原型链是否指向构造函数的prototype对象，恩，听起来不错，应该可以解决我们的数组检测问题：
Js代码


代码如下:

var arr = [];
alert(arr instanceof Array); // true

3、对象的constructor属性。除了instanceof，我们还可以利用每个对象都具有constructor的属性来判断其类型，于是乎我们可以这样做:
Js代码


代码如下:

var arr = [];
alert(arr.constructor == Array); // true

貌似后两个解决方案是无懈可击的，但真的是这样么？天有不测风云，当你在多个frame中来回穿梭的时候，令人沮丧的问题出现了：
Js代码


代码如下:

var iframe = document.createElement('iframe');
document.body.appendChild(iframe);
xArray = window.frames[window.frames.length-1].Array;
var arr = new xArray(1,2,3); // [1,2,3]
// 哎呀！
arr instanceof Array; // false
// 哎呀呀！
arr.constructor === Array; // false

由于每个iframe都有一套自己的执行环境，跨frame实例化的对象彼此是不共享原型链的，因此导致上述检测代码失效！怎么办怎么办？？嗯，javascript是动态语言，或许万金油“鸭式辨型”（duck type）可以助我们一臂之力“如果它走起路来像鸭子，叫起来也像鸭子，那就当他是鸭子吧”，同理，可以检测某些数组对象特有的能力来做判断，这个法子已经有人用了，比如Prototype框架，来看看它实现的Object.isArray方法：
Js代码


代码如下:

isArray: function(object) {
return object != null && typeof object == "object" &&
'splice' in object && 'join' in object;
}

isArray：”object，你有splice、join这两个数组特有的方法吗？”
object:“嗯，没错我有！”
isArray：“好吧，那你就是个数组了，哪怕你是冒充的，囧……”
Js代码


代码如下:

var trickster = { splice: 1, join: 2 };
Object.isArray(trickster); // 假冒成功，耶

没错，这个解决方案给人的感觉有点别扭，任何一个具有'splice'和'join'属性的对象都能通过这个检测！怎么办怎么办怎么办？？别着急，仔细想想，其实我们需要的是一个能取得对象实际类型，而且又能跨frame使用的方法即可。这不，细心的老外在翻阅ECMA262标准的时候发现了这个（btw，我也看了，怎么就没发现这个用途呢，囧）：
ECMA-262 写道


代码如下:

Object.prototype.toString( ) When the toString method is called, the following steps are taken:
1. Get the [[Class]] property of this object.
2. Compute a string value by concatenating the three strings “[object “, Result (1), and “]”.
3. Return Result (2)

上面的规范定义了Object.prototype.toString的行为：首先，取得对象的一个内部属性[[Class]]，然后依据这个属性，返回一个类似于"[object Array]"的字符串作为结果（看过ECMA标准的应该都知道，[[]]用来表示语言内部用到的、外部不可直接访问的属性，称为“内部属性”）。利用这个方法，再配合call，我们可以取得任何对象的内部属性[[Class]]，然后把类型检测转化为字符串比较，以达到我们的目的。还是先来看看在ECMA标准中Array的描述吧：
ECMA-262 写道


代码如下:

new Array([ item0[, item1 [,…]]])
The [[Class]] property of the newly constructed object is set to “Array”.

于是乎，可以改写之前的isArray函数以利用这个特性，如下：
Js代码


代码如下:

function isArray(o) {
return Object.prototype.toString.call(o) === '[object Array]';
}

call改变toString的this引用为待检测的对象，返回此对象的字符串表示，然后对比此字符串是否是'[object Array]'，以判断其是否是Array的实例。也许你要问了，为什么不直接o.toString()？嗯，虽然Array继承自Object，也会有toString方法，但是这个方法有可能会被改写而达不到我们的要求，而Object.prototype则是老虎的屁股，很少有人敢去碰它的，所以能一定程度保证其“纯洁性”：）
与前面几个方案不同，这个方法很好的解决了跨frame对象构建的问题，经过测试，各大浏览器兼容性也很好，可以放心使用。一个好消息是，很多框架，比如jQuery、Base2等等，都计划借鉴此方法以实现某些特殊的，比如数组、正则表达式等对象的类型判定，不用我们自己写了。

赞 (0)

相关推荐

  • JavaScript中判断变量是数组、函数或是对象类型的方法

    数组 ECMAScript5中Array.isArray是原生的判断数组的方法,IE9及以上支持.考虑到兼容性,在没有此方法的浏览器中,可以使用 Object.prototype.toString.call(obj) === '[object Array]'替代. 复制代码 代码如下: var isArray = Array.isArray || function(obj) {     return Object.prototype.toString.call(obj) === '[object

  • Javascript如何判断数据类型和数组类型

    这么基础的东西实在不应该再记录了,不过嘛,温故知新~就先从数据类型开始吧 js六大数据类型:number.string.object.Boolean.null.undefined string: 由单引号或双引号来说明,如"string" number:什么整数啊浮点数啊都叫数字,你懂的~ Boolean: 就是true和false啦 undefined:未定义,就是你创建一个变量后却没给它赋值~ null: 故名思久,null就是没有,什么也不表示 object: 这个我也很难解释的

  • JS返回只包含数字类型的数组实例分析

    本文实例分析了JS返回只包含数字类型的数组实现方法.分享给大家供大家参考,具体如下: 实现效果如:js123ldka78sdasfgr653 => [123,78,653] 一般做法 分析: 1.循环字符串每个字符,是数字的挑出来拼接在一起,不是数字的,就给他空的拼个逗号 2.将新字符串每一位转换为数组,再次遍历,存在的挑出来,即得到结果 var str="js123ldka78sdasfgr653"; var new_str=""; var arr=[];

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

    1.instanceof 当只有一个全局执行环境时适用,如果包含多个框架,就存在两个以上不同版本的Array构造函数,如果从一个框架向另一个框架传递数组,传入的数组与在第二个框架中原生创建的数组分别具有不同的构造函数,即为不同类型 if (value instanceof Array) { //对数组执行某项操作 } 2. Array.isArray() 方法 因为是ES5新增的,只支持IE9+.Firefox 4+.Safari 5+.Opera 10.5+和Chrome if (Array.

  • 浅析JavaScript中的array数组类型系统

    前面的话 数组是一组按序排列的值,相对地,对象的属性名称是无序的.从本质上讲,数组使用数字作为查找键,而对象拥有用户自定义的属性名.javascript没有真正的关联数组,但对象可用于实现关联的功能 Array()仅仅是一种特殊类型的Object(),也就是说,Array()实例基本上是拥有一些额外功能的Object()实例.数组可以保存任何类型的值,这些值可以随时更新或删除,且数组的大小是动态调整的 除了对象之外,数组Array类型可能是javascript中最常用的类型了.而且,javasc

  • 浅谈js数据类型判断与数组判断

    写在开篇: 昨天面试发现一个十分非常简单的问题竟然没有回答上来,可能也确实是因为太紧张了,感觉被自己蠢哭了.后来想想还是应该认真记录一下,这样才能印象深刻.革命尚未成功,壮实仍需努力! 1. js六大数据类型 number:数字,整数.浮点数等等, string:单引号或者双引号来说明, Boolean:返回true和false,这两个值不一定对应1和0 object:对象,可以执行new操作符后跟要创建的对象类型的名称来创建. null:只有一个值得数据类型,逻辑上讲,null值表示一个空对象

  • javascript引用类型之时间Date和数组Array

    javascript引用类型之时间Date和数组Array

    Javascript引用类型之时间Date JavaScript中的Date类型是在早期Java中的java.util.Date类基础上构建的.为此,Date类型使用自UTC 1970年1月1日零时开始经过的毫秒数来保存日期.在使用这种数据存储格式的条件下,Date类型保存的日期能够精确到1970年1月1日之前或之后的285 616年. 创建日期对象 在javascript中,可以使用Date()构造函数来创建日期对象,如: 复制代码 代码如下: var date=new Date(); 当没有

  • js判断数据类型如判断是否为数组是否为字符串等等

    1 判断是否为数组类型 2 判断是否为字符串类型 3 判断是否为数值类型 4 判断是否为日期类型 5 判断是否为函数 6 判断是否为对象 1 判断是否为数组类型 复制代码 代码如下: <script type="text/javascript"> //<![CDATA[ var a=[0]; document.write(isArray(a),'<br/>'); function isArray(obj){ return (typeof obj=='obj

  • javascript学习笔记(五) Array 数组类型介绍

    数组的创建 第一种: 复制代码 代码如下: var colors = new Array(); var colors = new Array(20);//创建包含20项的数组 var colors = new Array("Greg");//创建包含1项,即字符串"Greg"的数组 var colors = new Array("red","blue","green"); //创建包含3项 第二种: 复制代

  • Javascript isArray 数组类型检测函数

    1.typeof操作符.对于Function.String.Number.Undefined这几种类型的对象来说,不会有什么问题,但是针对Array的对象就没什么用途了: Js代码 复制代码 代码如下: alert(typeof null); // "object" alert(typeof []); // "object" 2.instanceof操作符.此操作符检测对象的原型链是否指向构造函数的prototype对象,恩,听起来不错,应该可以解决我们的数组检测问

  • JavaScript判断数组类型的方法

    前言 JavaScript中关于数组的判定问题,一直都是一个必须要掌握的点,那么,运用知识,如何判断一个类型是数组,就需要有对JavaScript使用有着深入的了解. 判断方法 一.Array.isArray ES5新增的数组方法,Array.isArray应该是我们最先想到的判定方式,现在应用的也比较广泛. const arr = [1,2,3,4] Array.isArray(arr) // true 如果是在支持ES5的浏览器中,用这样的方式自然没什么问题,但是如果是在IE9以下版本,这个

  • javascript的数组和常用函数详解

    1.认识数组 数组就是某类数据的集合,数据类型可以是整型.字符串.甚至是对象.Javascript不支持多维数组,但是因为数组里面可以包含对象(数组也是一个对象),所以数组可以通过相互嵌套实现类似多维数组的功能. 1.1 定义数组 声明有10个元素的数组: 复制代码 代码如下: var a = new Array(10); 此时为a已经开辟了内存空间,包含10个元素,用数组名称加 [下标] 来调用,例如 a[2] 但此时元素并未初始化,调用将返回 undefined.以下代码定义了个可变数组,并

  • javascript 得到变量类型的函数

    这个功能需要写一点代码来实现.下面的函数可以得到一个变量的类型,调用时传递一个变量进去,会返回用字符串形式描述的变量类型. 复制代码 代码如下: //得到x的类型,返回类型名称 function getType(x) { //如果x为null,则返回null if (x == null) return "null"; var t = typeof x; //如果x为简单类型,则返回类型名称 if (t.toLocaleLowerCase() != "object")

  • JavaScript中的object转换函数toString()与valueOf()介绍

    JavaScript中,object转换为boolean的操作非常简单:所有的object转换成boolean后均为true:即使是new Boolean(false)这样的object在转换为boolean后仍然为true. 复制代码 代码如下: var x = new Boolean(false); if(x){   console.log("x is true"); } 在将object转换为string或者number时,JavaScript会调用object的两个转换函数:t

  • c++将数组名作为函数参数对数组元素进行相应的运算

    用数组名做函数参数与用数组元素作实参有几点不同: (1)用数组元素作实参时,只要数组类型和函数的形参变量的类型一致,那么作为下标变量的数组元素的类型也和函数形参变量的类型是一致的.因此,并不要求函数的形参也是下标变量.换句话说,对数组元素的处理是按普通变量对待的.用数组名作函数参数时,则要求形参和相应的实参都必须是类型相同的数组,都必须有明确的数组说明.当形参和实参两者类型不一致时,将会发生错误. (2)用普通变量或下标变量作函数参数时,形参变量和实参变量都是由编译系统分配的两个不同的内存单元.

  • JavaScript isArray()函数判断对象类型的种种方法

    1) typeof 运算符 typeof 是一元运算符,返回结果是一个说明运算数类型的字符串.如:"number","string","boolean","object","function","undefined"(可用于判断变量是否存在). 但 typeof 的能力有限,其对于Date.RegExp类型返回的都是"object".如: 复制代码 代码如下: typ

  • isArray()函数(JavaScript中对象类型判断的几种方法)

    1) typeof 运算符 typeof 是一元运算符,返回结果是一个说明运算数类型的字符串.如:"number","string","boolean","object","function","undefined"(可用于判断变量是否存在). 但 typeof 的能力有限,其对于Date.RegExp类型返回的都是"object".如: typeof {}; //

  • JavaScript数组类型Array相关的属性与方法详解

    Array数组类型详解 在ECMAScript中除了object类型之外,Array数组用的是最常用的类型.ECMAScript数组可以在每一项存储任何类型的值,无需指定数组的长度,还可以随着数据的增长来增加数组长度,这些是和其他语言的数组不同的. 1.数组的创建方法 数组字面量方式 var arr = [1,2,3,4,5];// 简单直接用中括号包裹构建数组 数组构造函数 var arr = new Array(1,2,3,4,5);// 通过内置Array对象构建数组 2.检测数组 ins

随机推荐