2011-01-22 34 views
66

私は今、Require.JSで作業を始めました。使用すべき適切なケースとそれを使用する正しい方法については少し不明ですそのような場合に。いつ、どのようにRequire.JSを使用するのかを理解する

ここに私が現在Require.JSで設定したことがあります。私は2つの機能、functionA()functionB()を持っています。これらの機能の両方に、追加機能が必要です(functionC())。

私は、functionA()またはfunctionB()が呼び出されるときに、必要なときだけfunctionC()をロードします。

functionC.js

functionC(){ 
    //do stuff 
} 

functionA.js

functionA(){ 
    define(['functionC'],function(){ 
    //functionC() is loaded because it is listed as a dependency, so we can proceed 
    //do some functionA() stuff 
    }); 
} 

functionB.js

functionB(){ 
    define(['functionC'],function(){ 
    //functionC() is loaded because it is listed as a dependency, so we can proceed 
    //do some functionB() stuff 
    }); 
} 
:だから私は、次のファイルを持っています

これは正しく設定されていますか?そして、私が同じページでfunctionA()とfunctionB()の両方を呼び出すと、functionC.jsファイルを読み込むので余分な作業が行われますか?もしそうなら、それは問題ですか?もしそうなら、それを設定してfunctionC.jsがまだロードされているかどうかをチェックし、まだロードされていない場合はロードするしか方法はありますか?最後に、これはRequire.JSの適切な使用ですか?

答えて

44

define()は、モジュールの定義にのみ使用してください。コードの一部が動的にロードされるべきである上記の例については、require()を使用することがより適切である:

functionA.js

functionA(){ 
    require(['functionC'],function(functionC){ 
    //use funcC in here to call functionC 
    }); 
} 

いくつかの注意事項:

    require([])
  • は、非同期でありますしたがって、functionAの呼び出し元がその関数からの戻り値を期待している場合は、エラーが発生する可能性があります。 functionAが、functionAが処理されたときに呼び出されるコールバックを受け入れることが最善です。
  • 上記のコードは、functionAへのすべてのコールに対してrequire()を呼び出します。しかし、最初のコールの後には、functionC.jsをロードするペナルティはありません。一度だけロードされます。最初にrequire()が呼び出されると、functionC.jsがロードされますが、残りの時間はRequireJSが既にロードされていることが分かりますから、を再度要求せずにfunction(functionC){}関数を呼び出します。
+1

感謝を - それは多くのことができます。 define()とrequire()は明確化が必要なものでした。他の2つの箇条書きポイントは本当に役立ちます。最初の箇条書きのポイントは、私がまだよく理解する必要があるもの、つまりRequireJSの非同期性を正しく処理する方法です。 – maxedison

21

あなたはここにRequireJSとJavaScriptのモジュールについての詳細を見つけることができます:あなたの応答のためのJavaScript modularity with RequireJS (from spaghetti code to ravioli code)

+4

トップリンク - 数多くのチュートリアルを読んだことが、これまで最高でした。はっきりと簡潔です。+1 –

+11

リンクは理論的には質問に答えるかもしれませんが、答えの本質的な部分をここに含め、参照用のリンクを提供することが望ましいでしょう(http://meta.stackexchange.com/q/8259)。 – JJJ

関連する問題