しばらく混乱した後、私はついに手がかりを得ました。大まかです:
コードコピーは次のとおりです。
セルフコールの匿名関数を作成し、パラメーターウィンドウを設計し、ウィンドウオブジェクトに渡します。
このプロセスの目的は、
コードコピーは次のとおりです。
他のコードによって汚染されていない独自のコードを作成すると同時に、他のコードを汚染することはできません。
jQueryカプセル化
したがって、jQueryの以前のバージョンを見つけましたが、バージョン番号のカプセル化コードは1.7.1です。
コードコピーは次のとおりです。
(関数(ウィンドウ、未定義){
var jquery =(function(){console.log( 'hello');});
window.jquery = window。$ = jquery;
if(typeof define === "function" && define.amd && define.amd.jquery){
define( "jquery"、[]、function(){return jquery;});
}
})(window);
その中で
コードコピーは次のとおりです。
console.log( 'hello');
最初に述べたように機能するかどうかを確認するために使用されるため、ウィンドウでjqueryに電話することができます
コードコピーは次のとおりです。
ウィンドウ。$
または
コードコピーは次のとおりです。
window.jquery
そのため、同様のパッケージを作成できます
コードコピーは次のとおりです。
(関数(ウィンドウ、未定義){
var ph = function(){
}
})(ウィンドウ)
上記と比較して、欠落しているステップは2つしかありません
1. jQueryのシンボルとグローバルコールを定義します
2。非同期サポート
そこで、以前のjQueryカプセル化を見つけましたが、これは方法に関してほぼ同じでしたが、除いて。 。
コードコピーは次のとおりです。
if(typeof windof.jquery == "未定義"){
var jquery = function(){};
if(typeof $!= "未定義")
jQuery ._ $ = $;
var $ = jquery;
};
それはとても魔法のようで、前のステップjQueryを書き直すことができません。だから私は最新のjQueryカプセル化がどのように見えるかを見なければなりませんでした。そこで私は2.1.1を開き、多くの機能を追加することを除いて、私のアイデアは基本的に変わらないことがわかりました。
コードコピーは次のとおりです。
(機能(グローバル、工場){
if(typeof module === "object" && typeof module.exports === "object"){
module.exports = global.document?
工場(グローバル、真):
関数(w){
if(!w.document){
新しいエラーをスローします( "jqueryにはドキュメント付きのウィンドウが必要です");
}
return Factory(w);
};
} それ以外 {
工場(グローバル);
}
}(typeof windof!== "undefined"?window:this、function(window、noglobal){
var jquery = function(){
console.log( 'jquery');
};
if(typeof define === "function" && define.amd){
定義( "jQuery"、[]、function(){
jqueryを返します。
});
};
ストゥンディーインド=未定義のtype;
if(typeof noglobal ===束縛){
window.jquery = window。$ = jquery;
};
jqueryを返します。
}));
ブラウザを使用する場合
コードコピーは次のとおりです。
typeof module = "未定義"
したがって、上記の状況は、node.jsなどを使用する場合に判断されます。これは、jQueryが肥大化していることも示しています。
バックボーンパッケージ
バックボーンを開いてチェックしてください
コードコピーは次のとおりです。
(function(root、Factory){
if(typeof define === 'function' && define.amd){
定義(['underscore'、 'jquery'、 'exports']、function(_、$、exports){
root.backbone = factory(root、exports、_、$);
});
} else if(typeof exports!== 'undefined'){
var _ = require( 'Underscore');
工場(ルート、エクスポート、_);
} それ以外 {
root.backbone = factory(root、{}、root._、(root.jquery || root.zepto || root.ender || root。$));
}
}(this、function(root、backbone、_、$){
backbone。$ = $;
バックボーンを返す;
}));
非同期サポートに加えて、jQueryとアンダースコアへの依存も反映しています。
コードコピーは次のとおりです。
定義(['underscore'、 'jquery'、 'exports']、function(_、$、exports){
root.backbone = factory(root、exports、_、$);
});
これは、バックボーンがrequirejsによってネイティブにサポートされていることを示しています。
アンダースコアパッケージ
それで、私は再びアンダースコアを見て、このライブラリが別のシンボルを占有していることがわかりました
コードコピーは次のとおりです。
(関数() {
var root = this;
var _ = function(obj){
if(obj instanceof _)objを返します。
if(!(このinstanceof _))new _(obj)を返します。
this._wrapped = obj;
};
if(typeof exports!== 'undefined'){
if(typeof module!== 'undefined' && module.exports){
exports = module.exports = _;
}
exports._ = _;
} それ以外 {
root._ = _;
}
if(typeof define === 'function' && define.amd){
定義( 'Underscore'、[]、function(){
戻る _;
});
}
} .call(this));
全体として、それらはほぼ匿名の関数ですが、call()メソッドが最終的に使用されることを除きます。