JQuery原始碼解析（一）

寫在前面：本

第一眼看jq的源**或許會感到混亂和沒頭緒，特別是會卡在36行的**那裡遲遲找不到「function( window, noglobal ) (typeof window !== "undefined" ? window : this, function( window, noglobal )

return factory( w );

};} else

// pass this if window is not defined yet

}(typeof window !== "undefined" ? window : this, function( window, noglobal ) ));

我們把上面這個主架構函式再簡化成這樣：

(function( global, factory ) (引數1,引數2));    //引數1就是那個「typeof window !== "undefined" ? window : this」，引數2就是那個「function( window, noglobal )」

這種函式形式我們稱之為匿名函式，也就是沒有函式名的函式。介紹匿名函式之前我們先來看看函式的定義方式有哪些：

第一種，也是常規的一種：

function abc(x)

第二種：這種方法使用了function建構函式，把引數列表和函式體都作為字串，很不方便，不建議使用：

var abc = new function('x', 'alert (2 * x);');

第三種：等號右側先定義好函式，再賦給等號左側的變數。

var abc = function(x)

這裡你需要知道的一點是，等號右邊的函式，就是匿名函式了。我們可以用乙個變數指向它，並稱此變數為該函式的「函式字面量」（注意不是函式名字，匿名函式的不會偶函式名的），像var aa=function(x) ，則「aa」就是該函式的函式字面量。我們可以通過 aa(實參) 來執行該函式。

匿名函式還有另一種定義形式：

(function(x))(3);
/* 也可以寫做
(function(x)(3));
*/

這種形式的函式沒有函式名，卻有呼叫引數的專屬括號（像上面的是「(3)」，表示把3作為引數來強制呼叫賦值給x，最終alert出6）。

需要知道的是，像

(function(引數)(呼叫引數));    //「引數」和「呼叫引數」都是可有可無、數量可變的

這種形式的匿名函式，都是會立即執行的，無須寫什麼呼叫函式的**就會自動執行。你大可以寫個頁面檔案，加上

然後執行該頁面，立刻會彈出「3」的視窗。

了解了匿名函式，那麼我們回看jq原始碼：

可見jq原始碼就是乙個匿名函式

1 (function
( global, factory ) (a,b))

其中形參global的實參a是乙個三目運算子typeof window !== "undefined" ? window : this用於判斷當前執行環境是否支援window型別，是的話返回window，否則返回this

形參factory的實參b則是乙個函式，裡面包含了一萬多行的jq功能函式function( window, noglobal )

既然這個外部匿名函式的引數的值我們都清楚了，那麼來看下這個匿名函式又是啥作用的？（光看jq自帶的英文注釋我們可以大致知道它是為了相容node.js、sea-js等符合commonjs規範或類commonjs規範的js框架）

首先我們看這行判斷語句：if ( typeof module === "object" && typeof module.exports === "object" )

玩過node.js的朋友自然會知道module.export和export是node.js中用來建立模組的方法，那麼就好理解了，若此條件成立，則要執行下面語句來相容node.js（說白了就是利用形參factory做中間人，來把jq的各個功能模組用node.js建立模組的方法建立起來）

return factory( w );};}

嗯，這樣就相容了node.js咯，那麼如果咱沒有用node.js這種commonjs規範的框架，也就是說條件if ( typeof module === "object" && typeof module.exports === "object" )不成立。那就直接執行後面else裡的部分：

factory( global );

也就是直接引入jq那一萬多行的功能函式即可。

話說也寫了不少字，第一部分先到這裡吧 :)