ESLint の "no-implicit-coercion" ルール：詳細解説

ESLint の no-implicit-coercion ルールは、JavaScript における暗黙的な型変換を検出して警告またはエラーを報告するルールです。暗黙的な型変換とは、明示的に記述せずに、JavaScript エンジンによって自動的に型が変換されることです。このルールは、コードの可読性と意図の明確性を向上させるために役立ちます。

具体的な動作

このルールは、以下の種類の暗黙的な型変換を検出します。

論理値への型変換: !foo のような式は、Boolean(foo) と同じ意味ですが、このルールは後者の形式を推奨します。
数値への型変換: 文字列を数値に変換するために parseInt や parseFloat を使用する代わりに、明示的な型変換演算子 (Number(foo)) を使用するように促します。

オプション

このルールには、以下のオプションが用意されています。

"boolean": true (デフォルト): ブール値への暗黙的な型変換を警告します。
"string": true: 文字列への暗黙的な型変換を警告します。
"allow": ["!!" , "+"]: 特定の暗黙的な型変換を許可します。

例

以下のコードは、no-implicit-coercion ルールによって警告されます。

var isPositive = !number; // ブール値への暗黙的な型変換
var convertedNumber = parseInt(stringValue); // 数値への暗黙的な型変換
var result = +expression; // 数値への暗黙的な型変換

このルールを有効にすることで、上記のコードは以下のように書き換えることができます。

var isPositive = Boolean(number);
var convertedNumber = Number(stringValue);
var result = Number(expression);

利点

このルールを使用する利点は次のとおりです。

コードの可読性が向上します。 明示的な型変換を使用すると、コードの意図がより明確になります。
バグを防ぐことができます。 暗黙的な型変換は、予期しない動作を引き起こす可能性があります。
コード保守が容易になります。 明示的な型変換を使用すると、コードを理解しやすくなります。

注意点

このルールを使用する際の注意点としては、以下の点が挙げられます。

一部の古いコードでは、暗黙的な型変換に依存している場合があります。このようなコードを修正する必要がある場合があります。
このルールは、すべてのケースで適切とは限りません。例えば、パフォーマンスが重要な場合は、暗黙的な型変換を使用する方が効率的な場合があります。

論理値への型変換

var isPositive = !number;
var hasValue = !!object;

推奨例:

var isPositive = Boolean(number);
var hasValue = Boolean(object);

禁止例:

var convertedNumber = parseInt(stringValue);
var price = parseFloat(userInput);
var age = +userAge;

var convertedNumber = Number(stringValue);
var price = Number(userInput);
var age = Number(userAge);

var arrayLength = foo.length * 1; // 数値への型変換
var joinedString = "Hello " + name + "!"; // 文字列への型変換

var arrayLength = Number(foo.length);
var joinedString = String("Hello " + name + "!");

オプションの使用

このルールには、特定の暗黙的な型変換を許可するオプションがあります。例えば、以下のコードは allow": ["!!"] オプションを使用することで許可されます。

var isPositive = !!number;

オプションの詳細:

"boolean": true: ブール値への暗黙的な型変換を警告します。(デフォルト)

これらのオプションを組み合わせて、必要な型変換のみを許可することができます。

"no-implicit-coercion" の代替方法

TypeScript を使用している場合は、型注釈を活用することで、暗黙的な型変換を抑制することができます。型注釈を記述することで、変数や関数の型を明示的に定義することができます。これにより、JavaScript エンジンは型推論を行う必要がなくなり、暗黙的な型変換が発生する可能性が低くなります。

例：

function isPositive(number: number): boolean {
  return number > 0;
}

const result = isPositive(10); // 型注釈により、暗黙的な型変換が抑制される

厳格な型チェックルールを使用する

TypeScript には、@typescript-eslint/no-explicit-any や @typescript-eslint/strict-boolean-expressions などの厳格な型チェックルールが用意されています。これらのルールを使用することで、暗黙的な型変換をより厳格にチェックすることができます。

@typescript-eslint/no-explicit-any: any 型の使用を禁止することで、暗黙的な型変換を抑制することができます。
@typescript-eslint/strict-boolean-expressions: 論理式における暗黙的な型変換を禁止することで、意図しない動作を防ぐことができます。

// @typescript-eslint/no-explicit-any を有効にする
const value: any = 10;
const result = value && true; // エラー：`value` は `any` 型なので、論理式で使用することはできません

// @typescript-eslint/strict-boolean-expressions を有効にする
const isPositive = !!number; // エラー：論理式における暗黙的な型変換は許可されていません

手動で型変換を行う

どうしても暗黙的な型変換が必要な場合は、手動で型変換を行うことができます。型変換演算子 (Number(), Boolean(), String()) を使用することで、明示的に型変換を行うことができます。

const value = parseInt('10');
const isPositive = Boolean(value);
const message = String(isPositive ? 'positive' : 'negative');

ルールの設定を調整する

no-implicit-coercion ルールには、オプションを使用して、特定の暗黙的な型変換を許可することができます。例えば、論理値への暗黙的な型変換のみを許可する場合は、以下の設定を使用することができます。

{
  "rules": {
    "no-implicit-coercion": ["error", {"boolean": true}]
  }
}

"no-implicit-coercion" ルールは、暗黙的な型変換を抑制することで、コードの可読性と意図の明確性を向上させるのに役立ちます。

代替方法としては、

型注釈を活用する

などが考えられます。