なぜ「使っていない変数」を放置してはいけないのか？―静的解析が守るコードの品格
現場でコードレビューをしていると、時折「動くからいいや」という思想で作られた、死んだ変数や役割を終えた引数が放置されているコードに出くわします。
「たかが使っていない変数ひとつ、ブラウザの実行速度に影響するわけじゃないし……」
そう思う気持ちも分かります。しかし、中級者からその先へ進むエンジニアにとって、それは「技術的負債の芽」です。今日は、TypeScriptのコンパイラオプションである `noUnusedLocals` と `noUnusedParameters` を通じて、なぜ私たちがこれらを排除すべきなのか、その本質を語りましょう。
—
1. なぜブラウザは「使わない変数」を許すのか？
まず技術的な事実を確認しましょう。JavaScriptエンジン（V8など）は、非常に優秀です。実行時に解析を行い、参照されていない変数は最適化の過程で破棄されたり、そもそもメモリに確保されなかったりします。つまり、ブラウザのパフォーマンスという観点では、これらは「ほぼ無害」です。
しかし、人間にとってのコストは計り知れません。
- 認知的負荷: 読み手は「この変数はどこかで使われているはずだ」と無意識に探索を始めます。
- 安全性の低下: リファクタリング時、「これは本当に消していいのか？」という迷いが生じます。
- 意図の曖昧化: コードは「何をするか」だけでなく「何をしないか」も記述するものです。使わない変数があるだけで、その関数の責任範囲がぼやけてしまいます。
これらをコンパイラに検知させることは、いわば「コードの健康診断」を自動化することなのです。
—
2. tsconfig.json での厳格な設定
まずは、プロジェクトの `tsconfig.json` に以下の設定を投入してください。これが、チーム全体のコード品質を底上げする最小にして最強のガードレールです。
{
“compilerOptions”: {
// 宣言されたが使用されていないローカル変数をエラーにする
“noUnusedLocals”: true,
// 使用されていない関数引数をエラーにする
“noUnusedParameters”: true,
// これを有効にすると、さらにコードの安全性が高まります
“strict”: true
}
}
これを入れた瞬間、プロジェクト内に赤波線が走るかもしれません。最初は耳障りに感じるかもしれませんが、それはあなたのコードが「整理整頓」を求めているサインです。
—
3. 実践：現場でよくある「ゴミ」と、その対処法
現場では、どうしても「あえて使わない」ケースも存在します。そんな時、どうスマートに回避するか。現場の知見を共有します。
ケースA：意図的に引数を無視したい場合
例えば、コールバック関数で特定の引数だけを受け取りたい場合などです。
// 悪い例：noUnusedParameters: true だとコンパイルエラーになる
const onClick = (event: React.MouseEvent, index: number) => {
console.log(event.currentTarget);
// index は使わないが、シグネチャ上必要
};
// 良い例：アンダースコア(_)を頭につけるのがコミュニティの慣習
// これにより「意図的に使っていない」ことを明示できる
const onClick = (event: React.MouseEvent, _index: number) => {
console.log(event.currentTarget);
};
ケースB：テストやデバッグで一時的に残したい場合
どうしても消せない変数があるときは、アンダースコアを付けるか、あるいはそもそも「コードを消す勇気」を持つことが大切です。もし将来必要なら、Gitの履歴から復元すればいいだけですから。
function processData(input: string) {
const unusedTemp = “これはゴミ変数”; // エラー！
// 解決策1：不要なら削除する
// 解決策2：どうしても必要なら、eslint-disable等で誤魔化す前に設計を疑う
return input.toUpperCase();
}
—
結論：静的解析は「未来の自分」への手紙
「使っていない変数や引数を指摘されるのが面倒」と感じる人は、まだコードと「対話」できていません。
TypeScriptがエラーを出すのは、あなたを責めているからではありません。「君がさっき書いたこの変数は、もう役目を終えたよ。今のうちに整理しておかないと、あとで苦労するのは君だよ」と、コンパイラが親切に教えてくれているのです。
優れたフロントエンドエンジニアは、コードを書く時間よりも、コードを読みやすく整える時間に重きを置きます。`noUnusedLocals` と `noUnusedParameters` を活用して、常にクリーンな状態を保つ。その小さな積み重ねが、半年後のあなたが改修を行う際に、どれほど大きな恩恵をもたらすか。
さあ、今日からあなたの `tsconfig.json` をアップデートして、不要なノイズを消し去りましょう。コードが軽くなれば、思考も軽くなりますよ。
コメント