javascript类型判断

在ECMAScript中值分为原始类型和引用类型.

原始类型有五种分别为:Undefined, Null, Number, Boolean, String.

引用类型包括:Object, Function, Array, Date, RegExp等.

对于数据类型的坚持有几种方法,让我们由浅入深的分析下.

1. typeof是最弱的的一种检测方法

typeof运算符只返回number, string, boolean, undefined, object, function.对于基本数据类型检测还可以满足.但对于返回对象类型的就无从下手了.如:

typeof null、typeof {}、typeof window、typeof []、typeof new Date()都会返回Object.对于null可以用value === null来进行严格检测. 但对于其他

几种就不行了.所以这里仅给出基本数据类型的检测函数:

     function  type(o) { return  (o  ===   null )  ?   null  :  typeof (o)};
    document.write(type( 0 )  +   " , "   +  type( true )  +   " , "   +  type(undefined)  +  
     " , "   +  type( null )  +   " , "   +  type(type));

 

2. 使用instanceof或者constructor来检测instanceof的检测原理为：运算符左侧对象的原型链是否和右侧对象的prototype属性是同一个对象。因此这就存在问题了，假如左右侧的对象不在一个页面中，这样他们的引用就不太可能是一个对象了。典型的示例就是在存在frame的页面中，如a.html通过iframe包含b.html,如果在a.html中定义var arr=[];然后再b.html中通过parent.arr instanceof Array就会返回false，因为parent.arr的原型链是和parent.Array对象的prototype属性引用的同一个对象，而和b.html中的Array的prototype属性完全没有关系。

我们看到了instanceof对于数组类型检测存在的局限性：必须在同一个页面中的对象才能正确检测。其实采用constructor属性来判断和instanceof的局限性是一样的，因为他们都是对比的对象引用是否一样。

所以JQ给了如下判断数组的方法:

     var  isArray  =   function (arr) {  return   !! arr  &&  arr.constructor  ==  Array}
    alert(isArray([ 123 ]));

看似完美的方法,却产生了意外,那就是当左侧对象和右侧对象不在同一个页面中,那样原型链被打断了就无法判断.在FF下运行以下代码:

     var  isArray  =   function (arr) {  return   !! arr  &&  arr.constructor  ==  Array; }
    window.onload  =   function (){
         var  iframe  =  document.createElement( " iframe " );
        document.body.appendChild(iframe);
         var  xArray  =  window.frames[window.frames.length  -   1 ].Array;
         var  arr  =   new  xArray( 1 ,  2 ,  3 );
        alert(isArray(arr));  //  false
    }

3. 特性检测( Duck-typing )

采用简单的假设方式来做检测，如数组对象存在concat、splice、sort等相比其它对象特有的一些特性，因此可以通过简单判断对象是否有这些特性来进行检测。如下面的一些实现例子：

// prototype1.5的实现
function  isArray(object){
     return  object  !=   null   &&   typeof  object  ===   " object "   &&
         ' splice '   in  object  &&   ' join '   in  object;
}

// Douglas Crockford在2003年提供的方式
typeof  myArray.sort  ==   ' function ' ;

这个方法虽然避免了2方法的问题,但由于Object的伪装性,缺点也显而易见.如:

var  myArray  =  { ' splice ' :  1 ,  ' join ' :  2 ,  ' sort ' :  function (){}};
alert(isArray(myArray));
alert( typeof  myArray.sort  ==   ' function ' )

虽然是对象但可以伪装成数组的属性,而躲过检测.

4. 采用Object.prototype.toString.call(o)来检测

为什么要用Object.prototype.toString而不是Function.prototype.toString或者其它？这是和他们的toString解释方式有关系的。下面是ECMA中对Object.prototype.toString的解释：

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 )

其过程简单说来就是：1、获取对象的类名（对象类型）。2、然后将[object、获取的类名、]组合并返回。

ECMA中对Array有如下说明：

The [[Class]] property of the newly constructed object is set to “Array”.

因此我们用如下代码来检测数组：

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

这是个完美的解决方案,当然对于Function, Date等也都适用.

最后给个综合的方法

     var  is  =  {
        types: [ " Array " ,  " RegExp " ,  " Date " ,  " Number " ,  " String " ,  " Object " ]
    };
     for ( var  i  =   0 ,c;c  =  is.types[i ++ ];){
        is[c]  =  ( function (type){
             return   function (obj){
                 return  Object.prototype.toString.call(obj)  ===   ' [object  '   +  type  + ' ] ' ;
            }
        })(c);
    }

    alert(is[ " Array " ]([ 1 , 2 , 3 ]));   // true
    alert(is[ " RegExp " ]( / [0-9] / ));  //  true
    alert(is[ " Number " ]( " str " ));    //  false
今天又追加个方法
var isArray = function(arr) { return Array.toString() == arr.constructor }