2017-10-14 11 views
0

私はモジュールパターンについて多くの理論的な議論を見出しましたが、新しい開発者として私はコンテキスト内で何かを見たいと思います。つまり、設計パターンは構造を助けるためのものなので、その構造を見たいと思います。Javascriptモジュールパターンのコンテキスト内の例

誰かが私にそのような事例を教えてもらえますか?

+0

JavaScriptで多くのモジュールのパターンがあります。あなたの状況に合ったパターン(またはパターンのアマルガム)を選ぶ必要があります。どんなフレームワークで作業していますか?(Node.js、requirejsなど) – Gladclef

+0

私はフレームワークを使用していません。私は趣味家で、WebAudio APIを使ってブラウザで音楽アプリを作成する作業をしています。本当に、私のコードは厄介になっているので、どのように大規模な構造体が機能するかの例を見ていて、それをどのように整理するかというアイデアが必要です。 –

+1

コードのアーキテクチャは、あなたのアプリケーションに非常に特有のものになります。あなただけがあなたのコードを(別々の懸念事項)(https://en.wikipedia.org/wiki/Separation_of_concerns)と[modularise](https://en.wikipedia.org/wiki/Modular_design)のコードにすることができます。 "モジュールパターン"は、その宣言のためにプライベートスコープを持つJSオブジェクトのようなモジュールを作成する方法の構文上の規則です。 – Bergi

答えて

1

requirejsを使用して、HTMLにrequirejsスクリプトをロードし、それを使用して残りのコードを実行します。

/example.html:

<html> 
    <head> 
     <script data-main="app" src="lib/require.js"></script> 
    </head> 
    <body> 
     <h1>Hello</h1> 

     <script type="text/javascript"> 
      var timeout, main = null; 
      var main = function() { 
       // check if requirejs has loaded 
       if ("require" !== "undefined") { 
        require(["lib/jquery"], function(jquery) { 
         var h1 = jquery("h1"); 
         h1.text(h1.text() + " world!"); 
        }); 
       } 
       // it hasn't loaded, better luck in 50 milliseconds! 
       setTimeout(main, 50); 
      }; 
      main(); 
     </script> 
    </body> 
</html> 

requirejsウェブサイト上のいくつかの(やや)より深い例があります。http://requirejs.org/docs/start.html#examples

関連する問題