JavaScriptホイスト
巻き上げは、宣言を一番上に移動するJavaScriptのデフォルトの動作です。
JavaScript宣言が引き上げられます
JavaScriptでは、変数は使用後に宣言できます。
言い換えると; 変数は、宣言される前に使用できます。
例1では、例2と同じ結果が得られます。
例1
x = 5; // Assign 5 to x
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x;
// Display x in the element
var x; // Declare x
例2
var x; // Declare x
x = 5; // Assign 5 to x
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x;
// Display x in the element
これを理解するには、「巻き上げ」という用語を理解する必要があります。
巻き上げは、すべての宣言を現在のスコープの先頭（現在のスクリプトまたは現在の関数の先頭）に移動するJavaScriptのデフォルトの動作です。
letおよびconstキーワード
letで定義された変数constはブロックの先頭に持ち上げられますが、初期化されません。
意味：コードのブロックは変数を認識していますが、宣言されるまで使用できません。
let宣言される前に変数
を使用すると、結果はになりReferenceErrorます。
変数は、ブロックの開始から宣言されるまで「一時的なデッドゾーン」にあります。
例
これにより、ReferenceError次のようになります。
carName = "Volvo";
let carName;
宣言される前に変数を使用するconstことは構文エラーであるため、コードは単純に実行されません。
例
このコードは実行されません。
carName = "Volvo";
const carName;
letとconstの詳細については、JS Let / Constをご覧ください。
JavaScriptの初期化は引き上げられません
JavaScriptは宣言をホイストするだけで、初期化はホイストしません。
例1では、例2と同じ結果は得られ ません。
例1
var x = 5; // Initialize x
var y = 7; // Initialize y
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x + " " + y; // Display x and y
例2
var x = 5; // Initialize x
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x + " " + y; // Display x and y
var y = 7; // Initialize y
最後の例でyが定義されていないことは意味がありますか？
これは、初期化（= 7）ではなく、宣言（var y）のみが一番上に持ち上げられるためです。
巻き上げのため、yは使用される前に宣言されていますが、初期化が巻き上げられていないため、yの値は未定義です。
例2は次のように書くのと同じです。
例
var x = 5; // Initialize x
var y; // Declare y
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x + " " + y; // Display x and y
y = 7; // Assign 7 to y
変数を一番上に宣言してください！
巻き上げは（多くの開発者にとって）JavaScriptの未知のまたは見落とされた振る舞いです。
開発者が巻き上げを理解していない場合、プログラムにバグ（エラー）が含まれている可能性があります。
バグを回避するために、常にすべてのスコープの先頭ですべての変数を宣言してください。
これはJavaScriptがコードを解釈する方法であるため、常に適切なルールです。
厳密モードのJavaScriptでは、変数が宣言されていない場合、変数を使用できません。次の章で「厳密に使用する」
を学習します。