29. ECMAScript 6 のコーディングスタイルのヒント #

この章では、ES6 コーディングスタイルに関連するいくつかのアイデアについて説明します。

• var、let、const の使い分け (詳細は 変数の章 で説明しています)
  • const を優先します。値が決して変わらないすべての変数に使用できます。
  • それ以外の場合は、値が変更される変数に let を使用します。
  • var は使用しないでください。
• 関数が 1 行に収まる場合は、常にアロー関数が最良の解決策です。

    readFilePromisified(filename)
    .then(text => console.log(text))
  

  複数行の関数の場合、従来の関数も適切に動作します (this がレキシカルではないという注意点がありますが)。

    readFilePromisified(filename)
    .then(function (text) {
        const obj = JSON.parse(text);
        console.log(JSON.stringify(obj, null, 4));
    });
  

  単一行の関数は使い捨てになる傾向があります。関数が使い捨てではない場合、従来の関数には名前を付けられるという利点があり、ドキュメント作成やデバッグに役立ちます。

• オブジェクトリテラル内のプロパティ: オブジェクトリテラルが複数の行にまたがる場合は、最後のエントリにコンマを追加します。このような末尾コンマは ES5 から合法です。これにより、エントリの追加、削除、並び替えが簡単になります。その結果、メソッドの定義はすべて }, で終わります。

    const obj = {
        foo() {
        },
        bar() {
        },
    };
  

• モジュール: デフォルトエクスポートと名前付きエクスポートを混在しないでください。モジュールは、1 つのことに特化するか、または複数の名付きのものをエクスポートする必要があります。
  • 例外: テスト用にいくつかの内部を公開する (名前付きエクスポートを介して) デフォルトエクスポートを持つモジュール。
  • 詳細は モジュールの章 で説明しています。
• 次のようにジェネレーター書式設定を行います。

    // Generator function declaration
    function* genFunc() { ··· }
  
    // Generator function expression
    const genFunc = function* () { ··· };
  
    // Generator method definition in an object literal
    const obj = {
        * generatorMethod() {
            ···
        }
    };
  
    // Generator method definition in a class definition
    class MyClass {
        * generatorMethod() {
            ···
        }
    }
  

  詳細は ジェネレーターの章 で説明しています。

• パラメータの処理に関する章には、関数シグネチャのスタイルのヒント があります。

    // Mark optional parameters via the parameter default value `undefined`
    function foo(optional = undefined) { ··· }
  
    // Mark required parameters via a function that throws an exception
    function foo(required = throwException()) { ··· }
  
    // Enforcing a maximum arity (variant 1 of 2)
    function f(x, y, ...empty) { // max arity: 2
        if (empty.length > 0) {
            throw new Error();
        }
    }
    // Enforcing a maximum arity (variant 2 of 2)
    function f(x, y) { // max arity: 2
        if (arguments.length > 2) {
            throw new Error();
        }
    }
  

• 呼び出し可能なエンティティの章 (従来の関数、アロー関数、クラスなど) には、推奨事項 (いつどれを使用するかなど) を示すセクションがあります。

さらに、「Speaking JavaScript」の ES5 コーディングスタイルのヒント は ES6 にも関連しています。