jQuery源碼學習 item1-匿名函數及其參數

jQuery 是一個 JavaScript 庫，對JavaScript進行了很好的封裝，極大地簡化了 JavaScript 編程。jQuery中用到了JavaScript的很多經典思想，對jQuery源碼的學習，也能進一步加深對JavaScript的理解。本次學習主要參照 jQuery 2.0.3.js 版本。

自執行匿名函數

jQuery 2.0.3.js 文檔總共有8829行，我們可以發現除了開頭的幾行註釋，所有關於jQuery的代碼都包括在一個匿名自執行函數中，也就是下面這個函數：

(function( window, undefined ) {
    //其他代碼
})( window );

爲什麼要這麼寫呢？我們先看一個簡單的例子：

(function(window,undefined){
        var a = 10;
        console.log(a); // 10
    })(window);
    console.log(a); //a is not defined

上述程序中第一個爲輸出爲10，第二個a會報錯，提示沒有定義。這是因爲函數內部變量和方法在函數外部不能訪問到，因此把jQuery的所有代碼都放在一個函數中，這樣的好處把內部的變量和方法函數變成局部的，而不與外部其他的變量和函數衝突。

那麼外部如果需要調用到jQuery內部的變量和方法該如何調用呢？常用的在函數外部想調用函數內部的變量和方法就是將函數內部的變量和方法掛載到window對象上，同樣是上面那個例子，我們將其改成如下：

(function(window,undefined){
        var a = 10;
        console.log(a); // 10
        window.a = a;
    })(window);

    console.log(a); // 10

這樣就能訪問到函數內部的變量a了。同樣，jQuery中就是使用的這個思想，在文檔61行定義了一個jQuery函數，如下：

我們平時使用時調用jQuery或者是$符號訪問的就是這個函數，這裏需要注意的上述函數返回的是一個對象。要訪問到這個函數，按照上面的方法，就是將該方法掛到window對象下，在文檔的第8826行就是執行這個操作：

這樣，我們在外部就能訪問到函數內部的變量和方法了。

函數參數

1、window參數

我們可以發現自執行函數傳入了一個window參數，傳入window參數的作用主要有以下兩點：

• 訪問變量都是從最近的開始查找，當查找不到時才一級一級往上面查找，將window當做參數傳進來可以更快的查找到。

• 把window參數傳進來更利於壓縮，在壓縮的時候，可以用更簡單的字母或單詞代替window參數。我們查看 jquery-2.0.3.min.js 發現參數window用e代替了，變成如下形式：

    (function(e, undefined){
        e //表示window
    })(window);

這樣在函數內部window都用e代替了，有利於壓縮。

2、undefined參數

Undefined是window下的一個屬性，但是因爲在有些瀏覽器下undefined的是可以被修改的。例如在IE8下面：

var undefined = 10;
alert(undefined); // 10

因此傳入undefined的作用就是爲了防止外部的對undefined進行修改，這樣jQuery內部如果訪問undefined的，首先訪問到的是傳入的undefined參數，而不會訪問外部的undefined，所以即使外部對undefined進行了修改，也沒有影響。