JavaScript中資料型別檢測方法盤點

本文羅列了一般Js型別檢測的方法，是構建Js知識體系的一小塊。

一、Js中有5種基本資料型別

Undefined 、Null、Boolean、String、Number(包含NaN)

NaN和任何型別的值都不相等，包括NaN；isNaN用來判斷數值是不是NaN型別

二、型別判斷

1. isFinite(number)
是不是無窮大，如果不是返回true，如果是NaN，或者正負無窮大，或者非數字型別返回false

2. typeof運算子
使用的時候，空格或者typeof(param)

返回的值

string
number
boolean
undefined
function
object null也返回object

根據以上，判斷型別可以如下：

var obtainType = function(o){
     var t;
     if(o === null ) return “null”;
     else if(o !== o) return “NaN”;
     else if( (t = typeof o) !== ‘object’) return t;
}

可以識別出null、NaN string number boolean undefined function。

上面最後只剩下object，比如陣列的識別，自定義型別的識別

3. 陣列等原生型別的識別，可以採用如下

function obtainType(type) {
    return function (obj) {
        return Object.prototype.toString.call(obj) === "[object " + type + "]"
    }
}

var isObject = isType("Object")
var isString = isType("String")
var isArray = Array.isArray || isType("Array")
var isFunction = isType("Function")

4. 自定義型別判斷

/**
 * 返回函式的名字，可能為空串；不是函式，返回null
 */
Function.prototype.getName = function () {
    if ("name" in this) return this.name;
    return this.name = this.toString().match(/function\s*([^(]*)\(/)[1];
};

原生型別和自定義型別的object都可以判斷了，於是

/**
 * 返回：null NaN undefined string number boolean
 * function Array String Object（包括一些自定義型別） 自定義型別
 */
var obtainType =function(o){
    /**
     * 獲取引數型別
     * 物件直接量、Object.create、自定義建構函式的類屬性皆為Object;
     * 識別出原生型別 （內建建構函式和宿主物件）
     */
    function classOf(obj){
        return Object.prototype.toString.call(obj).slice(8, -1);
    }

    /**
     * 返回函式的名字，可能為空串；不是函式，返回null
     */
    Function.prototype.getName = function () {
        if ("name" in this) return this.name;
        return this.name = this.toString().match(/function\s*([^(]*)\(/)[1];
    };
    var t, c, n;
    // 處理null值特殊情形
    if (o === null) return "null";
    // NaN：和自身值不相等
    if (o !== o) return "NaN";
    // 識別出原生值型別和函式、undefined
    if ((t = typeof o) !== "object") return t;
    // 識別出原生型別
    if ((c = classOf(o)) !== "Object") return c;
    // 返回自定義型別建構函式名字
    if (o.constructor && typeof o.constructor === "function" &&
        (n = o.constructor.getName()))
        return n;
    return "Object";
};

5.

var strObj = new String('abc');

typeof strObj // "object"

obtainType(strObj) // "String"

三、 其它

1. Dom元素判斷
if(dom.nodeType){…Dom…}
if(dom.createElement)

2. jQuery等型別判斷
$(‘#aa’) instanceof jQuery//不支援跨多視窗和框架子頁面

3. if(a) a為null undefined 0 “” NaN時自動轉換成false
一般推薦的寫法

// bad
if (name !== '') {
    // ...stuff...
}

// good
if (name) {
    // ...stuff...
}

// bad
if (collection.length > 0) {
    // ...stuff...
}

// good
if (collection.length) {
    // ...stuff...
}