オブジェクトと関数が他の同じ名前のオブジェクトと関数によって上書きされないように、JavaScript で名前空間を作成するにはどうすればよいでしょうか? 私は次のものを使用しました:
if (Foo == null || typeof(Foo) != "object") { var Foo = new Object();}
これを行うよりエレガントで簡潔な方法はありますか?
ベストアンサー1
私が使うEnterprise jQueryサイトで見つかったアプローチ:
以下は、プライベートおよびパブリックのプロパティと関数を宣言する方法を示した例です。すべては自己実行型の匿名関数として実行されます。
(function( skillet, $, undefined ) {
//Private Property
var isHot = true;
//Public Property
skillet.ingredient = "Bacon Strips";
//Public Method
skillet.fry = function() {
var oliveOil;
addItem( "\t\n Butter \n\t" );
addItem( oliveOil );
console.log( "Frying " + skillet.ingredient );
};
//Private Method
function addItem( item ) {
if ( item !== undefined ) {
console.log( "Adding " + $.trim(item) );
}
}
}( window.skillet = window.skillet || {}, jQuery ));
したがって、パブリック メンバーの 1 つにアクセスする場合は、 または と入力しskillet.fry()
ますskillet.ingredients
。
本当に素晴らしいのは、まったく同じ構文を使用して名前空間を拡張できるようになったことです。
//Adding new Functionality to the skillet
(function( skillet, $, undefined ) {
//Private Property
var amountOfGrease = "1 Cup";
//Public Method
skillet.toString = function() {
console.log( skillet.quantity + " " +
skillet.ingredient + " & " +
amountOfGrease + " of Grease" );
console.log( isHot ? "Hot" : "Cold" );
};
}( window.skillet = window.skillet || {}, jQuery ));
3番目のundefined
議論
3 番目の
undefined
引数は、 value の変数のソースですundefined
。現在でも関連があるかどうかはわかりませんが、古いブラウザー / JavaScript 標準 (ecmascript 5、javascript < 1.8.5 ~ firefox 4) では、グローバル スコープの変数はundefined
書き込み可能であり、誰でもその値を書き換えることができます。3 番目の引数 (値が渡されない場合) は、名前空間 / 関数にスコープされる という名前の変数を作成しますundefined
。名前空間を作成したときに値が渡されなかったため、デフォルトで value になりますundefined
。