class-literal-property-style

クラスのリテラルを、一貫したスタイルで公開することを強制します。

🎨

拡張 "plugin:@typescript-eslint/スタイル" で ESLint設定 でこのルールを有効にします。

💡

このルールによって報告される一部の問題は、エディターの 提案.

によって手動で修正できます。いくつかのTypeScriptアプリケーションでは、再代入を防ぐために、`readonly`修飾子を使用してフィールドにリテラル値をクラスに保存します。しかし、JavaScriptユーザーが使用できるTypeScriptライブラリを作成する際には、`readonly`修飾子はコンパイル時にのみ適用されるため、通常はこれらのリテラルを`getter`を使用して公開する方が安全です。

このルールは、上記の2つのスタイルのいずれかで、クラスによって公開されるリテラルが一貫して行われることを保証することを目的としています。デフォルトでは、このルールは`fields`スタイルを優先します。これは、JSが関数クロージャの設定とティアダウンを行う必要がないことを意味します。

.eslintrc.cjs

module.exports = {
  "rules": {
    "@typescript-eslint/class-literal-property-style": "error"
  }
};

Playgroundでこのルールを試してみてください ↗

オプション

このルールは、次のオプションを受け入れます。

type Options = ['fields' | 'getters'];

const defaultOptions: Options = ['fields'];

注記

このルールは、定数のリテラル値（文字列、テンプレート文字列、数値、bigint、ブール値、正規表現、null）のみをチェックします。オブジェクトや配列はチェックしません。これは、readonlyフィールドとgetterがこれらのケースで異なる動作をするためです。また、関数もチェックしません。これは、自動バインドメソッドとしてアロー関数値を持つreadonlyフィールドを使用することが一般的なパターンであるためです。これは、これらの型は変更可能であり、それらの使用に関するより複雑な意味合いを伴うためです。

"fields"

このスタイルは、リテラル値を返すgetterメソッドをチェックし、代わりに`readonly`修飾子を使用してフィールドで定義することを要求します。

fieldsスタイルのコード例

❌ 正しくない

class Mx {
  public static get myField1() {
    return 1;
  }

  private get ['myField2']() {
    return 'hello world';
  }
}

Playgroundで開く

✅ 正しい

class Mx {
  public readonly myField1 = 1;

  // not a literal
  public readonly myField2 = [1, 2, 3];

  private readonly ['myField3'] = 'hello world';

  public get myField4() {
    return `hello from ${window.location.href}`;
  }
}

Playgroundで開く

"getters"

このスタイルは、リテラル値が割り当てられている`readonly`フィールドをチェックし、代わりにgetterとして定義することを要求します。このスタイルは、`readonly`にできるフィールドを識別し、したがってgetterにする必要があるため、@typescript-eslint/prefer-readonlyルールとよく合います。

gettersスタイルのコード例

❌ 正しくない

class Mx {
  readonly myField1 = 1;
  readonly myField2 = `hello world`;
  private readonly myField3 = 'hello world';
}

Playgroundで開く

✅ 正しい

class Mx {
  // no readonly modifier
  public myField1 = 'hello';

  // not a literal
  public readonly myField2 = [1, 2, 3];

  public static get myField3() {
    return 1;
  }

  private get ['myField4']() {
    return 'hello world';
  }
}

Playgroundで開く

使用しない場合

強い好みがない場合、またはクラスによってリテラル値がどのように公開されるかについて特定のスタイルを強制しない場合。

リソース

• ルールソース
• テストソース