jQuery原始碼學習筆記

2021-08-14 13:55:36 字數 1041 閱讀 6382

整個jquery是乙個自呼叫的匿名函式:

1 (function

(global, factory)

9return

factory(w);

10};

11 } else

14 }(typeof window !== "undefined" ? window : this, function

(window, noglobal) ));

自呼叫函式大家都不陌生,前面的function(){}是函式定義,然後緊接著的()表示立即執行,這樣構建了乙個命名空間,其中的變數都是區域性變數,不管起什麼名字,都不會覆蓋全域性變數。這樣就不會汙染全域性的命名空間。如果有不熟悉的同學,可以去看看作用域鏈和閉包的基礎知識就明白啦。

這個子呼叫函式的函式體我們暫時可以不用管,貌似是處理jquery與commonjs、node.js等的衝突和協調關係,這個我覺得不是重點,重點是這個自呼叫函式的引數。

整個引數列表有兩個引數,第乙個引數是傳入global物件,所有的全域性變數都是global物件的成員。傳入這個變數,我們就將global物件變成了這個自呼叫匿名函式的區域性變數了,這樣當我們訪問它時,在自呼叫匿名函式的作用域中就能找到它,而不用將作用域鏈會退到global,這樣就更快啦。

第二個引數就是我們的jquery啦,其中定義了jquery的所有的內容,咱們的重點就在這裡,那麼現在開始,我們往下看。

1 jquery = function

(selector, context)

在自呼叫的匿名函式裡面,定義了乙個jquery變數,它是乙個方法,執行後返回乙個新jquery物件,不過這個物件實際上是由jquery.fn.init函式構建。在整個jquery主體**的最後會讓window.jquery和window.$兩個全域性變數引用這個jquery方法:

1

if (typeof noglobal ===strundefined)

這樣當我們使用$(...)或者jquery(...)的時候就能建立jquery物件啦!

**:

jquery原始碼學習筆記二 jQuery工廠

筆記一裡記錄,jquery的總體結構如下 function global,factory typeof window undefined window this,function window,noglobal 那麼這個生成jquery的工廠是咋樣的?醬紫的 function window,nogl...

jquery原始碼學習筆記 01

jquery原始碼分析 文章的順序並不是按照特定的邏輯來編排的,只是自己看原始碼的時候碰到自己希望記錄的地方,就隨便寫點。merge 將第二個類陣列新增到第乙個類陣列的末尾 返回新的物件 我寫的陣列 但是jquery物件是乙個類陣列的物件 merge function first,second fi...

JQuery原始碼學習筆記(一)

最近打算學習各種前端框架的寫法,吸取經驗充實自己,第乙個選中的就是jquery。jquery作為最流行的前端框架,早有無數前輩高人寫了各種各樣的原始碼解讀和剖析,不過他人的東西終究是他人的東西,只有自己去閱讀體會到的東西才能確實變成經驗,又說好記性不如爛筆頭,因此我把自己的學習體會寫在這裡,方便以後...