2015-11-23 18 views
22

JavaScriptのスニペットを3年間使っていましたが、今はReactアプリケーションを構築しています。私が理解していない基本的なことがあります。 ReactはDispatcherとStoresを使用してFluxパターンを作成しますが、私が得られないことは、このDispatcherはすべてのアプリケーションで表示されることです。アクションはディスパッチャを使用してアクションをディスパッチし、ストアはディスパッチャに通知して通知します毎回新しいディスパッチャではありません)。ですから、どのようにしてこの「グローバル」スコープを呼び出すことができますか?どのようにES6のクラス(モジュール)を使用してこれを達成することができますか?JavaScriptとES6の "global"変数

この質問は、私が実際のJavaScriptをプログラミングする経験が不足しているために不明確な場合があります。私はコミュニティのコメントのヒープでそれを手配できることを願っています。

答えて

42

どこにいても、いつでも変数をwindow.MyClass = whatever()に割り当てて、アプリケーション内の他のファイルからこれらの値にアクセスできます。しかし、アプリケーションでグローバルにデータを共有することは必ずしも最良の方法ではありません。 nodejs(またはES6のAMD)のモジュールローダーは、あなたがエクスポートしてキャッシュするものをとります。

MyModule.js::私たちは別の場所からこのファイルを必要とするたびに、今、私たちは常にMyClassの同じインスタンスを与えられている

class MyClass { 
    constructor() { 
    this.someData = 55; 
    } 
} 

export default (new MyClass); 

あなたのようなファイルを持って言うことができます。これが意味:私たちはすべてのアプリケーション全体でクラスの周りに一つの共通のインスタンスを渡す。これは、シングルトンパターンと呼ばれる

import MyClass from './MyModule' 
console.log(MyClass.someData); 

、:

file1.js:

import MyClass from './MyModule' 
MyClass.someData = 100; 

file2.js 。このようにして、異なるファイルからMyClassの同じインスタンスにアクセスすることができます(グローバルスコープを汚染することなく)。global.MyClassへの代入は避けますが、同じ機能を実現します。

+0

パーフェクトは、私も多くのコンテキストの '' '輸出デフォルトMyClassName''' – vicaba

+1

@vicaba、パターンIとして私のクラスをエクスポートしてください上記の表現はシングルトンパターンと呼ばれています^あなたのプロジェクトであなたのクラスの一般的なインスタンスを渡す場所 – Macmee

+0

私は知っていますが、JavaScriptで同じものが呼び出されたかどうかわかりませんでした。 – vicaba

6

あなたが探しているのは、シングルトンを作成することです。 〜からhttp://amanvirk.me/singleton-classes-in-es6/

let instance = null; 
 
export default class Cache{ 
 
    constructor() { 
 
    if (!instance) { instance = this; } 
 
    this.time = new Date() 
 

 
    return instance; 
 
    } 
 
}

私はこれをテストし、それが動作します。 this.time = new Date()をthis.singletonFunction = function(){}に置き換えるだけです。あなたはそれを使用したい場合は、インポート、その後

let aSingleton = (new importName()).singletonFunction;