web-dev-qa-db-ja.com

JavaScriptの「ウィンドウ」オブジェクトに変数を保存することは、そのオブジェクトを使用する適切な方法ですか?

(たぶん)JavaScriptで変数を「保存」/「保存」することで、問題を解決しました( ダイアログウィンドウからフォームが正常に送信された後にフロントエンドコンテンツを更新する方法?windowオブジェクト。ただし、私はJavaScriptの初心者であるため、JavaScript windowオブジェクトに変数を保存/保存することが「共通」/「適切な」方法であるかどうかに疑問がありますそのオブジェクトを使用します。それは...ですか?

たとえば、次のコードを使用して

$('.trigger').click(function() {
  window.trigger_link = this;
});

お勧めですか?

38
Backo

JavaScriptでは、グローバル変数は実際にはwindowオブジェクトのプロパティです。 1つを使用することは、もう1つを使用することと同等(および交換可能)です。

グローバル変数の使用は確かに「一般的」なので、問題はそれが「適切」かどうかです。 一般的に、グローバル変数は推奨されません 。それらはどの関数からもアクセスでき、複数の関数が同じ変数を読み書きしようとするリスクがあるためです。 (これは、JavaScriptだけでなく、あらゆる環境のあらゆるプログラミング言語に当てはまります。)


アプリケーションに固有の名前空間 を作成して、この問題を解決します。最も簡単なアプローチは、変数をそのオブジェクトのプロパティとして使用して、一意の名前でグローバルオブジェクトを作成することです。

_window.MyLib = {}; // global Object container; don't use var
MyLib.value = 1;
MyLib.increment = function() { MyLib.value++; }
MyLib.show = function() { alert(MyLib.value); }

MyLib.value=6;
MyLib.increment();
MyLib.show(); // alerts 7
_

別のアプローチは、 .data() を使用して、関連するDOM要素に変数をアタッチすることです。これはすべての場合に実用的ではありませんが、グローバル名前空間に残さずにグローバルにaccessedできる変数を取得するための良い方法です。

70
Blazemonger

ここで実際に言及されていないものは、おそらくを使用しない理由windowグローバルスコープキャリアとしては、凍結できる(書き込み不可)場合がある(およびI '生産ベースの経験から話しています。

良いパターンは、実際にはアプリケーションのすべての一般的なものに使用されるグローバル変数を作成するだけです

var Application = {};
Application.state = { name: 'Application' }
.
.

Javascriptで私にとって最良のパターンとして見つけたのは、 Redux を使用してグローバルな状態にすることです。

6
J.D.

アプリケーションで一意の名前空間を作成する別のパターン。

function myApp()
{
    var value = 5;
    function addToValue(x)
    {
         value += x;
    }
}()

関数/値に後でアクセスできるようにしたい場合は、次のようなオブジェクトに保存できます:

function myApp()
{
    this.value = 5;
    this.addToValue = function(x)
    {
         this.value += x;
    }
}
var myInstance = new myApp();
1
Samy Bencherif