JavaScriptで変数宣言の重複を防ぐ方法｜即時関数によるスコープ分離

JavaScriptでは、同じ名前の変数を何度も宣言してしまうと、意図せず既存の変数や関数を上書きしてしまうことがあります。特にグローバルスコープでの宣言は、他のライブラリやコードとの衝突（名前空間の汚染）を引き起こす原因になります。

解決策：関数式（即時実行関数）で変数を包む

変数宣言の重複を防ぐ最もシンプルな方法は、変数の宣言を関数式（即時実行関数：IIFE）で囲むことです。

(function(){
    var rank = 1;
}())

この方法の仕組みとメリット

上記のコードでは、変数 rank は関数の内部に閉じ込められるため、外部にある他の変数や関数と干渉することがありません。これにより、以下のようなメリットが得られます。

• グローバル変数への影響なし： 関数の外側にあるグローバル変数には一切影響を与えません。
• 名前の衝突を防止： 同じ名前の変数が既に存在していても、上書きされる心配がありません。

注意点

関数内で宣言された変数 rank は、関数の外からは参照できません。そのため、この変数を使った処理はすべて関数の中に記述する必要があります。

(function(){
    var rank = 1;
    console.log(rank); // OK：関数内なら参照できる
}())

console.log(rank); // エラー：関数外からはアクセス不可

このようにスコープを意図的に限定することは、大規模なプロジェクトや複数のスクリプトを読み込むページにおいて、安全で保守しやすいコードを書くための基本的なテクニックです。現代のJavaScriptでは let や const を使ったブロックスコープも利用できますが、レガシー環境やライブラリ開発では今でも有効な手法です。