ラベル変数はもう古い？ESLintの「no-label-var」ルールでモダンなコードへ

ESLint のルール "no-label-var" は、var キーワードを使ってラベル変数を宣言することを禁止します。これは、ラベル変数はほとんどの場合不要であり、コードの可読性を低下させる可能性があるためです。

問題点

var キーワードを使ってラベル変数を宣言すると、以下の問題が発生します。

• コードの可読性が低下する: ラベル変数はほとんどの場合、ループや条件分岐の中でローカル変数として宣言する方が適切です。
• 誤解を招く: var キーワードは変数宣言だけでなく、ラベルの定義にも使用されます。そのため、var キーワードを使ってラベル変数を宣言すると、コードを読んだ人が誤解を招く可能性があります。

解決策

no-label-var ルールを有効にすることで、var キーワードを使ってラベル変数を宣言することを防ぐことができます。ラベル変数を宣言する必要がある場合は、let または const キーワードを使用することを推奨します。

例

// 問題のあるコード
var label = 'loop';

for (var i = 0; i < 10; i++) {
  if (i === 5) {
    break label;
  }
}

// 修正コード
let label = 'loop';

for (let i = 0; i < 10; i++) {
  if (i === 5) {
    break label;
  }
}

上記の例では、var キーワードを使ってラベル変数 label を宣言しています。これは no-label-var ルールによってエラーとなります。修正コードでは、let キーワードを使ってラベル変数を宣言しています。

設定

no-label-var ルールはデフォルトで有効になっています。無効にする場合は、ESLint の設定ファイルで以下の設定を追加します。

{
  "rules": {
    "no-label-var": "off"
  }
}

ESLint のルール "no-label-var" に関するサンプルコード

// ラベル変数がローカル変数と名前が重複している
var count = 0;

for (var i = 0; i < 10; i++) {
  if (i === 5) {
    break count; // 誤ってローカル変数の `count` を参照してしまう可能性があります
  }
}

// ラベル変数が不要
var label = 'outer';

outer: for (var i = 0; i < 10; i++) {
  for (var j = 0; j < 10; j++) {
    if (i === 5 && j === 5) {
      break label; // ラベル変数は不要です
    }
  }
}

修正コード

// ラベル変数をローカル変数と名前が重複しないようにする
var count = 0;

for (var i = 0; i < 10; i++) {
  if (i === 5) {
    break; // ラベル変数は不要なので省略
  }
}

// ラベル変数を `let` または `const` キーワードで宣言する
let label = 'outer';

outer: for (let i = 0; i < 10; i++) {
  for (let j = 0; j < 10; j++) {
    if (i === 5 && j === 5) {
      break label; // ラベル変数は必要ですが、`let` キーワードで宣言
    }
  }
}

ラベル変数を宣言するその他の方法

let または const キーワードを使ってラベル変数を宣言すると、var キーワードを使うよりもコードの可読性が高くなります。

// `let` キーワードを使用する
let label = 'loop';

for (let i = 0; i < 10; i++) {
  if (i === 5) {
    break label;
  }
}

// `const` キーワードを使用する
const label = 'loop';

for (let i = 0; i < 10; i++) {
  if (i === 5) {
    break label;
  }
}

ラベル名を直接使用する

ラベル変数を宣言せずに、ラベル名を直接使用することができます。ただし、この方法を使うとコードの可読性が低下する可能性があります。

// ラベル変数を宣言せずにラベル名を直接使用する
for (let i = 0; i < 10; i++) {
  if (i === 5) {
    break; // ラベル名は "loop"
  }
}

ラベル関数を使用する

ラベル関数は、ラベルを名前付きの関数として定義することができます。ラベル関数を使用すると、コードの可読性と保守性を向上させることができます。

// ラベル関数を定義する
function loop() {
  for (let i = 0; i < 10; i++) {
    if (i === 5) {
      return; // ラベル関数から抜ける
    }
  }
}

// ラベル関数を呼び出す
loop();

どの方法を使用するかは、コードの状況によって異なります。 一般的には、let または const キーワードを使ってラベル変数を宣言するのが最も良い方法です。