jQuery原始碼閱讀（十）---jQuery靜態方法分析

jQuery工具方法（靜態方法）是通過jQuery.extend方法來掛在的，extend方法的原始碼實現在這篇部落格中也有整理過。現在簡單回顧下，當jQuery.extend中的引數為一個物件時，就是擴充套件外掛的方式，也就是說裡面的方法都會擴充套件到jQuery上。因此，jQuery工具方法就是這樣實現的。

jQuery.extend({
    //裡面可以擴充套件的方法
    noConflict: function(){
        //釋放jQuery 對 $ 或者 jQuery 的使用權
    },
    ready: function(fn){
        jQuery.bindReady();
        readyList.add(fn);
        return this;
    },
    isFunction: fucntion( obj ){  },
    isArray: function( obj ){  },
    isWindow: function( obj ){  },
    isNumeric: fucntion( obj ){  },
    type: function( obj ){  },
    isPlainObject: function( obj ){  },
    isEmptyObject: function( obj ){  },
    error: function( msg ){  },
    parseXML: function( data ){  },
    parseJSON: function( data ){  },
    noop: function(){ },
    globalEval: function(){  }
    //等等，後面還有很多工具方法
});

前面兩篇部落格（noConflict函式解析 和 jQuery ready函式解析）已經把noConflict 和ready函式這兩個方法做了整理，這一次先整理關於型別檢測的工具方法，即isFunction( obj )、isArray( obj )、isNumeric( obj )、type( obj )、isWindow( obj )、isPlainObject( obj )和 isEmptyObject( obj ) 這幾個函式。

isFunction函式

function( obj ){
    return jQuery.type(obj) === 'function';
}

很簡單，直接調jQuery型別檢測type函式 ，判斷type得到的型別是否與’function’相等。

jQuery.isArray函式

isArray: Array.isArray || function( obj ){
    return jQuery.type( obj ) === 'array';
}

一般來講，利用ES5提供的原生方法isArray是比較快的， 但在某些瀏覽器不支援ES5這種方法時，就調jQuery工具方法type來判斷。

在這裡想到，之前電面時遇到的一道面試題：
如何判斷一個物件是陣列型別？有幾種方法？
這裡也簡單總結下：

1. Array.isArray(obj);        //返回true Or false
2. obj instanceof Array       //返回true Or false
3. Object.prototype.toString.call(obj)   //返回型別，如果是陣列，返回是'[object Array]'

以上三種方法也有適用性。比如原生的isArray方法，如果瀏覽器不支援ES5，那麼這種方法是不起作用的；instanceof 的話，如果有多個全域性環境，比如iFrame，那麼instanceof會受環境的影響。詳見高程第22章高階技巧。

jQuery.isNumeric方法

function( obj ){
    return !isNaN( parseFloat( obj )) && isFinite( obj );
}

在JS中，typeof NaN也是返回number;所以如果用jQuery.type()方法來判斷的話，是不會過濾掉NaN。另一方面，計算機中數值是有最大最小值的，Number.MAX_VALUE和Number.MIN_VALUE就可以知道最大最小值，所以當數值超過最大最小值時，也就沒有意義了。因此要利用原生方法isFinite()檢查數值是否超過邊界。

isWindow方法

function( obj ){
    return null != obj && obj == obj.window;
}

window一方面可以是全域性物件，一方面又可以是視窗。所以window.window是存在的，並且等於Window物件。

因此，只有當obj = window時，obj == obj.window才返回true。

isPlainObject方法

這個函式是判斷一個物件是否為物件字面值。
在這一篇部落格中，有說過物件的建立方式，有new方法，有工廠模式，也有物件字面值等等，而isPlainObject方法是判斷物件為物件字面值或者利用Object()建構函式new出來的物件。

function( obj ){
    //對於空物件，型別為Array，String，Function，Date...等不是'object'型別的物件，還有DOM物件，Window物件的情況，都認為不是PlainObject
    if(!obj || jQuery.type( obj ) !== 'object' || obj.nodeType || jQuery.isWindow( obj ))
    {
        return false;
    }

    //對於利用建構函式new出來的物件，但建構函式不是Object，也認為不是PlainObject
    try {
            // 對於自定義建構函式，然後利用自定義建構函式生成的物件，jQuery.type()返回的是"object"
            // 所以才有下面的判斷，判斷建構函式，判斷constructor不是自身的屬性，並且'isPrototypeOf'不是建構函式的原型自身的屬性，返回false
            if ( obj.constructor &&
                !hasOwn.call(obj, "constructor") &&
                !hasOwn.call(obj.constructor.prototype, "isPrototypeOf") ) {
                return false;
            }
        } catch ( e ) {
            // IE8,9 Will throw exceptions on certain host objects #9897
            return false;
        }

    //個人覺得，下面這部分直接用
    //return true
    //來代替就可以了
    var key;
    for ( key in obj ) {}
    //此時key 等於obj中最後一個屬性名/方法名
    return key === undefined || hasOwn.call( obj, key );
} 

其中

hasOwn = Object.prototype.hasOwnProperty;

這也是jQuery的一大技巧，就是把很多使用比較頻繁的，並且很長的語句用很短的有含義的語句來代替，從而縮小了程式碼量，一定程度上也能提高效能。

而在jQuery2.0版本中，前面兩種情況都處理過並未返回false之後，直接返回true.

isEmptyObject方法

空物件裡面是沒有屬性和方法的，所以用for … in來遍歷空物件時，是不會進到迴圈裡面的。

function( obj ){
    var key;
    for(key in obj)
    {
        return false;
    }
    return true;
}

關於型別檢測的一些靜態方法基本上整理完了，希望大家可以一起探討學習！