JavaScriptモジュール化開発検討

2696 ワード

私たちは以前はJavaScriptコードをどのように開発しましたか?
過去には複雑度が高くないため、JavaScriptはウェブページで補助的なプログラムとして位置づけられています.また、多くのサイトは一回限りのアプリケーションであり、規模が小さく、メンテナンス性よりも開発速度が重要である.ほとんどの場合、プロのフロントエンドの開発者はいません.バックグラウンドの人がマニュアルを調べて作業を開始します.
多くの場合、JavaScriptコードは同じファイルに入れられています.すべてのコードは結合されていて、多重化できません.すべての変数はグローバル変数で、互いに上書きされます.良くすると、いくつかの関数が作成され、いくつかの共通コードを組織し、多重化しやすいですが、これらの関数は基本的には大域的です.JQueryを導入した後に更に明らかで、多くの人はすべてのイベントを結び付けることに慣れて、事件の処理などのコードはいっしょに1つのdocument ready関数の中に置きます.
以上のような状況は自分で経験したものです.まとめてみると、コードは多重化できません.保守性が悪いです.同時にコードはテストできません.
モジュールとは
ウィキペディアの定義:
ソフトウェアモジュール(Module)は一貫しており、互いに密接な関係があるソフトウェア組織です.それぞれプログラムとデータ構造の二つの部分が含まれています.近代的なソフトウェアの開発はよくモジュールを利用して合成の単位を作ります.近代的なソフトウェアの開発はよくモジュールを利用して合成の単位を作ります.モジュールは別々に作成されることができる単位です.これは彼らにさまざまなモジュールの共同作業、編纂及び研究を可能にします.
モジュール開発のメリット
  • は必要に応じて
  • をロードすることができます.
  • 多人協力開発
  • は、多重化を容易にする
  • .
  • 拡張可能性が高い
  • 便利テスト
  • JavaScriptのモジュール化開発
    実は今JavaScriptモジュール化は人気のあるものです.主な特徴は「モジュール化開発、必要に応じてロードする」ということです.この中で、CommunJSはAMDの仕様を定義しています.ブラウザ側のモジュール定義を規範化します.RequireJSとSeaJSはAMDの優れたフレームを実現しました.
    中大型プロジェクトにはモジュール開発と必要に応じてロードする必要があります.その中の一つのフレームを選択して使うことができます.中小型プロジェクトにはこのモジュール開発の枠組みを使う必要がないと思いますが、やはりモジュール開発のメリットを取り入れます.しかし、必要に応じてこの機能をロードする必要はありません.ここでは主に中小型プロジェクトです.小型プロジェクトはどのようにモジュール化開発方式を使って、伝統的な開発方式の様々な問題を避けるべきですか?
    JavaScriptにおけるモジュールの定義方法
    JavaScriptのモジュールは主にクローズドで実装されています.グローバル変数の問題をうまく解決できます.すべての関連変数をプライベート変数としてモジュールに入れます.以下はモジュールの簡単な例です.
    
            var book = function() {
              var name = 'Master JavaScript';
              var price = 100;
              
              return {
                getName: function() {
                  return name;
                },
                getPrice: function() {
                  return price;
                }
              };
            }();
          
    以下はJavaScriptモジュール化開発における基本的な要求です.
    各モジュールは一つの独立した機能しか完成していません.
    これはモジュール化開発の基本的な要求であり、モジュール化開発は実際には分治法として機能全体をいくつかの小機能に分けています.もちろんモジュールごとに一つのことをするまでも分割できます.
    各モジュールには明確なAPIインターフェースがあります.
    実はこのAPIインターフェースはモジュールの具体的な機能コードの前に定義してもいいです.コードを書く前に、このモジュールが何をするべきかを明確に知っていることを要求します.これと先にユニットのテストコードを書いて、実現コードを書くのは道理です.また、必要なインターフェースだけを暴露する必要があります.他の変数と関数などはすべて隠しています.外部はアクセスできません.
    ユニットテスト
    JavaScriptは開発中にユニットテストを書く人があまりいません.JavaScriptは常にUIと付き合っていますので、テストが難しいです.一方、コード結合のため、固定インターフェースがないので、テストができません.モジュールがあれば、簡単にテストできます.JavaScriptユニットのテストフレームを参考にして紹介してください.
    締め括りをつける
    本論文では中小型JavaScriptプロジェクトのモジュール化開発方法を議論しています.したがって、AMDの仕様は採用されていません.JavaScriptの標準的なモジュールモードを使ってコードを組織しています.また、必要に応じてロード機能も使用していません.中小プロジェクトに対してはコード量があまり大きくないので、性能は大きな問題ではありません.大型プロジェクトであれば、AMD仕様を採用しています.読み込む必要がありますか?それとも必要なコードを読み込むことができます.
    参考記事:
  • JavaScriptモジュール化開発と必要に応じて
  • をロードする.
  • 抱拥モジュール化JavaScript
  • AMD