グローバル変数が良くないと聞きましたが、どのような代替案を使えばよいですか?
質問
私は、あちこちで グローバル変数が悪い であり、代替手段を使用する必要があります。具体的には、Javascript では、どのような解決策を選択すればよいのでしょうか。
私はある関数について考えています。それは、2つの引数 (
function globalVariables(Variable,Value)
) が与えられたとき、Variable がローカルな配列に存在するかどうかを調べ、もし存在すればその値を
Value
に設定し、それ以外の場合は
Variable
と
Value
が付加される。もし関数が引数なしで呼ばれた場合 (
function globalVariables()
) が呼び出されると、配列を返します。おそらく、もしこの関数が一つの引数で呼ばれた場合 (
function globalVariables(Variable)
) の値を返します。
Variable
の値を返します。
どうでしょうか?グローバル変数を使用した場合の代替案や反論をお聞かせください。
あなたならどう使う?
globalVariables();
function append(){
globalVariables("variable1","value1"); //globalVariables() would append variable1 to it's local array.
};
function retrieve(){
var localVariable1 = globalVariables("variable1"); //globalVariables() would return "value1".
};
function retrieveAll(){
var localVariable1 = globalVariables(); //globalVariables() would return the globalVariable()'s entire, local [persistently stored between calls] array.
};
function set(){
globalVariables("variable1","value2"); //globalVariables() would set variable1 to "value2".
};
これは シングルトンパターン ということでしょうか?
この特定のシナリオでは、ある関数がある時点で変数を設定し、ずっと後に別の関数、たとえばユーザーがフォームを送信したときに、その変数を取得する必要があるかもしれません。したがって、最初の関数は、最初の関数から決して呼び出されないので、後の関数に引数として変数を渡すことができません。
ありがとうございます、すべてのあなたの助けに感謝します
どのように解決するのですか?
javascriptでグローバル変数が推奨されない主な理由は、javascriptではすべてのコードが単一のグローバルな名前空間を共有し、またjavascriptには暗黙のグローバル変数、つまりローカルスコープで明示的に宣言されていない変数が自動的にグローバルな名前空間に追加されるからです。グローバル変数に頼りすぎると、同じページにあるさまざまなスクリプトの間で衝突が起こる可能性があります(たとえば Douglas Crockford の記事 ).
グローバル変数を減らす方法のひとつに YUIモジュールパターン . 基本的な考え方は、モジュール外でアクセスする必要のある関数を含むオブジェクトを返す関数ですべてのコードをラップし、戻り値を単一のグローバル変数に代入することです。
var FOO = (function() {
var my_var = 10; //shared variable available only inside your module
function bar() { // this function not available outside your module
alert(my_var); // this function can access my_var
}
return {
a_func: function() {
alert(my_var); // this function can access my_var
},
b_func: function() {
alert(my_var); // this function can also access my_var
}
};
})();
で、モジュール内の関数を他の場所で使用する場合は
FOO.a_func()
. この方法では、グローバルな名前空間の衝突を解決するために、単に
FOO
.
関連
-
[解決済み】ある要素が可視DOMに存在するかどうかを確認するにはどうすればいいですか?
-
[解決済み] varキーワードの目的と、どのような場合に使用する(または省略する)べきですか?
-
[解決済み】JavaScriptのクロージャと無名関数の比較
-
[解決済み] チェックボックスが選択されているかどうかを確認するjQuery
-
[解決済み] 文字列がすべて同じ部分文字列で構成されているかどうかを調べるにはどうすればよいですか?
-
[解決済み] モバイルWeb HTML5フレームワークの選び方【終了しました
-
[解決済み] bootstrap のポップオーバーがすべての要素の上に表示されない
-
[解決済み] JSXとLoadshを使用して、ある要素をn回繰り返す方法
-
[解決済み] 無効になっている入力フィールドの値を送信する
-
[解決済み] モデルフェッチ時に1をtrueに、0をfalseに変換する方法
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] JavaScript の配列からランダムな値を取得する
-
[解決済み] JavaScript で範囲を作成する - 奇妙な構文
-
[解決済み] URL/アドレスバーからJavascriptの関数を呼び出す
-
[解決済み] アサインの左側にJavascriptのオブジェクトブラケット表記({ ナビゲーション } =)があります。
-
[解決済み] CORS OriginヘッダーとCSRFトークンによるCSRF保護
-
[解決済み] JSXとLoadshを使用して、ある要素をn回繰り返す方法
-
[解決済み] javascriptで文字列から関数を作成する方法はありますか?
-
[解決済み] JSHintの'+'前の改行不良の説明
-
[解決済み] HTML要素にスクロールバーがあるかどうかをチェックする
-
本番のエンタープライズ環境で見たことのある最もevilなコードは何ですか?[クローズド]