菜鳥のjQueryソース学習ノート(一)

4665 ワード

jQuery全体は、自己呼び出しの匿名関数です.
 1 (function(global, factory) {

 2     if (typeof module === "object" && typeof module.exports === "object") {

 3         module.exports = global.document ?

 4             factory(global, true) :

 5             function(w) {

 6                 if (!w.document) {

 7                     throw new Error("jQuery requires a window with a document");

 8                 }

 9                 return factory(w);

10             };

11     } else {

12         factory(global);

13     }

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

15                            /* jQuery     */

16 }));

自己呼び出し関数はよく知られていますが、前のfunction(){}は関数定義であり、直後の()はすぐに実行されることを示しています.これにより、ネーミングスペースが構築され、変数はローカル変数であり、どんな名前を付けてもグローバル変数は上書きされません.これにより、全体のネーミングスペースが汚染されません.慣れていない学生がいたら、役割ドメインチェーンや閉パッケージの基礎知識を見てみればわかります.
このサブコール関数の関数体はしばらく管理しなくてもいいです.jQueryとCommonJS、Nodeを処理しているようです.jsなどの衝突と協調関係は、これは重点ではなく、この自己呼び出し関数のパラメータに重点を置いていると思います.
パラメータリスト全体には2つのパラメータがあり、最初のパラメータはGlobalオブジェクトに入力され、すべてのグローバル変数はGlobalオブジェクトのメンバーです.この変数を入力すると、Globalオブジェクトをこの呼び出し匿名関数のローカル変数に変更します.これにより、アクセスすると、呼び出し匿名関数の役割ドメインでそれを見つけることができ、役割ドメインチェーンをGlobalに退かなくても、より速くなります.
2つ目のパラメータは私たちのjQueryです.その中でjQueryのすべての内容を定義しています.私たちのポイントはここにあります.では、今から下を見てみましょう.
1 jQuery = function(selector, context) {

2             // The jQuery object is actually just the init constructor 'enhanced'

3             // Need init if jQuery is called (just allow error to be thrown if not included)

4             return new jQuery.fn.init(selector, context);

5         }

自己呼び出しの匿名関数では、jQuery変数が定義されています.これはメソッドで、実行後に新しいjQueryオブジェクトが返されますが、このオブジェクトは実際にはjQueryです.fn.init関数構築.jQuery本体コード全体の最後にwindowを譲ります.jQueryとwindow.$2つのグローバル変数はこのjQueryメソッドを参照します.
1 if (typeof noGlobal === strundefined) {

2         window.jQuery = window.$ = jQuery;

3     }

これで$(...)を使うとまたはjQuery(…)の時にjQueryオブジェクトを作成できるようになりました!
次の予告:
Javascriptでオブジェクトを構築する方法には、ファクトリモード、コンストラクション関数モード、プロトタイプモードなど、jQueryがコンストラクション関数とプロトタイプを結合する方法がたくさんあることを知っています.次回はjQueryの原型を見てみましょう.