質問
最初の記事で、ブロガーが次のような質問をしました。理解できましたら、1 つまたは 2 つ教えてください。
var str = "test" ;
for(var a in str){
console.log(a ":" str[ a ])
}
出力結果
これは String オブジェクトなので、for を使用すると上記の状況が発生します。
自己呼び出し匿名関数 (function(){})(window)
(function(window, unknown){
// jquery code
})(window);
コード分析:
最初の括弧: 匿名関数を作成します。
2 番目の括弧: すぐに実行します。
ウィンドウ変数を渡す理由:
ウィンドウ変数をグローバル変数からローカル変数に変更します。アクセスを高速化するためにスコープ チェーンを最上位スコープに戻す必要はありません。窓へ。
パラメータ リストに未定義を追加する理由:
自己呼び出し匿名関数のスコープ内で、未定義が本当に未定義であることを確認します。
この設計の利点:
プライベート名前空間を作成します。関数本体内の変数とメソッドはグローバル空間に影響を与えません。他のプログラムの変数と競合しません。
関数拡張 extend()
一般的な設計習慣に従って、ドット (.) 構文を通じて直接実装するか、プロトタイプ オブジェクトに属性を追加することによって実装できます。構造。 。 ——jQuery フレームワークは、extend() 関数による関数拡張を実装します。
同様の方法を実行してみましょう。 ——指定されたパラメータ オブジェクトに含まれるすべてのプロパティを cQuery または cQuery.prototype オブジェクトにコピーします。
(function(){
var
_cQuery = window.cQuery,
cQuery = function(){
return new cQuery.fn.init();
cQuery.fn = cQuery.prototype = {
init : function () {
これを返します;
}
};
cQuery.fn.init.prototype = cQuery.fn; cQuery.fn .extend = function( obj ) {
for (var prop in obj) {
this[ prop ] = obj[ prop ];
return this; 🎜>
cQuery.fn.extend({
test : function() {
console.log('Test!');
}
}); = window.cQuery = cQuery;
})();
C().test(); の利点:
ユーザーが迅速に拡張できるように jQuery フレームワークの機能は、jQuery フレームワークのプロトタイプ構造を破壊しません。
2. 便利な管理。
注:
プロトタイプによって拡張されたオブジェクトの場合、インスタンス化関数 (cQuery().test() など) を通じて呼び出す必要がありますが、cQuery.test() は使用できません。
オブジェクト URL パラメータ化された param()
コードをコピー
コードは次のとおりです:
(function (){ var
return this;
}
};
cQuery.param = function(obj); 🎜> var prefix, s = [];
for ( prefix in obj ) {
s[ s.length ] = encodeURIComponent( prefix ) "=" encodeURIComponent( obj[ prefix ]); 🎜> return s.join( "&" );
}
cQuery.fn.init.prototype = cQuery.fn;
window.C = window.cQuery = cQuery;
})();
var param({"名前":"川山家", "年齢":30}); >
結果の出力
オブジェクト URL のパラメータ化: 構造化とメンテナンスの容易化に役立ちます。 URLの後にパラメータリストを追加すると、目まいがしませんか?
まとめ
とりあえずここに書いておきます 何か補足があれば幸いです。 ——もっとコミュニケーションをとって、お互い学び合いましょう。