jquery原始碼解讀1
阿新 • • 發佈:2019-01-05
(
function
( global, factory ) {
if
(
typeof
module ===
"object"
&&
typeof
module.exports ===
"object"
) {
// For CommonJS and CommonJS-like environments where a proper window is present,
// execute the factory and get jQuery
// For environments that do not inherently posses a window with a document
// (such as Node.js), expose a jQuery-making factory as module.exports
// This accentuates the need for the creation of a real window
// e.g. var jQuery = require("jquery")(window);
// See ticket #14549 for more info
module.exports = global.document ?
factory( global,
true
) :
function
( w ) {
if
( !w.document ) {
throw
new
Error(
"jQuery requires a window with a document"
);
}
return
factory( w );
};
}
else
{
factory( global );
}
// Pass this if window is not defined yet
}(
typeof
window !==
"undefined"
? window :
this
,
function
( window, noGlobal ) {
/* 剛剛說的容易看卡住的地方 */
//說白了這裡就是寫各種JQ功能函式的地方,大概有一萬多行
}));
其中形參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建立模組的方法建立起來)
{ module.exports = global.document ? //三目運算子,先判斷當前環境是否支援window.document屬性 //(注意我們上面提到過形參global的實參是window) factory( global, true ) : //支援的話就好辦啦,只要咱用常規的瀏覽器一般都是支援的,那就直接module.exports = factory( global, true ), //把JQ後面那一萬多行的功能函式擴充套件到node.js裡面。(注意我們上面提到過形參factory的實參是實現JQ各種功能的一個外部函式) function ( w ) { //如果當前環境不支援window.document屬性,那就寫個函式扔個Error說這環境不適用JQ,但依舊返回JQ的功能函式(但大部分估計是不能用的了) if ( !w.document ) { throw new Error( "jQuery requires a window with a document" ); } return factory( w ); }; } |
嗯,這樣就相容了node.js咯,那麼如果咱沒有用node.js這種CommonJS規範的框架,也就是說條件if ( typeof module === "object" && typeof module.exports === "object" )不成立。那就直接執行後面else裡的部分:
factory( global );
也就是直接引入JQ那一萬多行的功能函式即可。