☰

JavaScript のコード編成に関する一般的に受け入れられているベストプラクティス [closed] 質問する

tag-icon • tag-icon javascript jquery design-patterns architecture formatting
JavaScript のコード編成に関する一般的に受け入れられているベストプラクティス [closed] 質問する

jQuery のような JavaScript フレームワークによってクライアント側の Web アプリケーションがより充実し、より機能的になるにつれ、私は 1 つの問題に気づき始めました...

一体どうやってこれを整理しているのですか?

  • すべてのハンドラーを 1 か所に配置し、すべてのイベントの関数を記述しますか?
  • すべての機能をラップする関数/クラスを作成しますか?
  • 必死に書いて、うまくいくことをただ願うだけですか?
  • 諦めて新しいキャリアを始めますか?

jQuery について言及しましたが、これは実際には一般的な JavaScript コード全般に当てはまります。行が積み重なるにつれて、スクリプト ファイルの管理や探しているものの検索が難しくなると感じています。おそらく、私が見つけた最大の問題は、同じことを実行する方法が多すぎて、現在一般的に受け入れられているベスト プラクティスがどれなのかがわかりにくいことです。

.jsファイルをアプリケーションの他の部分と同じようにきれいに保つための最善の方法について、一般的な推奨事項はありますか? それとも、これは IDE の問題だけでしょうか? もっと良いオプションはありますか?

編集

この質問は、ファイルの構成ではなく、コードの構成に関するものでした。ファイルを結合したり、コンテンツを分割したりする非常に良い例がいくつかあります。

私の質問は、実際のコードを整理するための現在一般的に受け入れられているベストプラクティスは何ですか？ページ要素を操作し、互いに競合しない再利用可能なコードを作成するためのあなたの方法、または推奨される方法は何ですか？

名前空間をリストアップしている人がいますが、これは良いアイデアです。ページ上の要素をより具体的に処理し、コードを整理して整頓しておくための他の方法にはどのようなものがありますか?

ベストアンサー1

JavaScriptに名前空間が組み込まれていればもっと良いのですが、ダスティン・ディアスが説明しているような整理法はこことても助かります。

var DED = (function() {

    var private_var;

    function private_method()
    {
        // do stuff here
    }

    return {
        method_1 : function()
            {
                // do stuff here
            },
        method_2 : function()
            {
                // do stuff here
            }
    };
})();

私は、異なる「名前空間」や、時には個々のクラスを別々のファイルに置きます。通常は 1 つのファイルから始めて、クラスまたは名前空間が大きくなるにつれて、独自のファイルに分離します。ツールを使用してすべてのファイルを結合して実稼働環境で使用するのも優れたアイデアです。

おすすめ記事