JavaScript 宣言の巻き上げ

JavaScript では、関数と変数の宣言はすべて関数の最上部に巻き上げられます。

JavaScript では、変数は使用後に宣言することができます。つまり、変数は先に使用してから宣言することができます。

以下の2つの例は同じ結果になります。

例 1

x = 5; // 変数 x に 5 を設定
elem = document.getElementById("demo"); // 要素を検索
 elem.innerHTML = x;                     // 要素に x を表示

var x; // x を宣言

試してみる »

例 2

var x; // x を宣言
 x = 5; // 変数 x に 5 を設定

elem = document.getElementById("demo"); // 要素を検索
elem.innerHTML = x;                     // 要素に x を表示

試してみる »

上記の例を理解するには、「hoisting（宣言の巻き上げ）」を理解する必要があります。

宣言の巻き上げ：関数宣言と変数宣言は常にインタープリタによってメソッド本体の最上部に静かに「巻き上げ」られます。

JavaScript の初期化は巻き上げられない

JavaScript の初期化は巻き上げられません。JavaScript では宣言された変数の部分だけが巻き上げられ、初期化の部分は巻き上げられません。

以下の2つの例は結果が異なります。

例 1

var x = 5; // x を初期化
var y = 7; // y を初期化

elem = document.getElementById("demo"); // 要素を検索
 elem.innerHTML = x + " " + y;           // x と y を表示

試してみる »

例 2

var x = 5; // x を初期化
elem = document.getElementById("demo"); // 要素を検索
 elem.innerHTML = x + " " + y;           // x と y を表示
var y = 7; // y を初期化

試してみる »

例 2 の y は出力されましたundefined、これは変数宣言（var y）が巻き上げられたが、初期化（y = 7）は巻き上げられないため、y 変数は未定義の変数になっているからです。

例 2 は以下のコードに似ています:

var x = 5; // 初始化 x
var y;     // 声明 y

elem = document.getElementById("demo"); // 查找元素
elem.innerHTML = x + " " + y;           // 显示 x 和 y

y = 7;    // 设置 y 为 7

変数は先頭で宣言しましょう

ほとんどのプログラマーは JavaScript の宣言の巻き上げを知りません。

プログラマーが宣言の巻き上げを十分に理解していないと、書いたプログラムに問題が発生しやすくなります。

これらの問題を避けるために、通常は各スコープの開始前に変数を宣言します。これは通常の JavaScript の解析手順でもあり、理解しやすくなります。

Note JavaScript の厳格モード（strict mode）では、宣言されていない変数の使用は許可されていません。
次の章で学びます:「厳格モード（strict mode）」 。
その他の拡張