English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

JavaScript 基礎チュートリアル

JavaScript オブジェクト

JavaScript 関数

JS HTML DOM

JS ブラウザBOM

AJAX 基礎チュートリアル

JavaScript 参考マニュアル

JavaScript 抬上げ(Hoisting)

JavaScriptでは、どこに定義されていても、すべての変数と関数宣言はその現在の作用域の先頭に移動または昇格されます。これはJavaScriptのインタプリタのデフォルトの動作であり、hoisting(昇格)

関数昇格(Hoisting)

関数宣言で定義された関数は自動的に昇格します。

これは、それらを定義する前に呼び出すことができることを意味します。

// 宣言の前に関数を呼び出す
greet();
function greet() {
  document.getElementById("output").innerHTML = "Hello World";
}
テストをしてみて‹/›

ご覧の通り、定義の前に、すでに呼び出していましたgreet()関数ですが、コードはまだ有効です。これは、関数宣言がバックグラウンドで自動的に先頭に昇格されるためです。

昇格は、JavaScriptが宣言を先頭に移動させるデフォルトの動作です。

JavaScriptは宣言のみを昇格させます

JavaScriptは宣言のみを昇格させ、初期化は行いません。変数を使用後に宣言し初期化を行った場合、その値は不定です。

document.write(num);  // undefined 
var num;
num = 50;
テストをしてみて‹/›

変数を使用後にその変数を宣言し、事前に初期化を行った場合、その値が返されます:

num = 50;
document.write(num);  // 50
var num;
テストをしてみて‹/›

を使用してletまたはconst宣言されていない変数と定数。

ホイストンされないJavaScriptの初期化

JavaScriptは宣言のみをホイストンし、初期化はホイストンしません。

以下の二つの例は異なる結果を生成します:

例1:
var x = 1;   // xを初期化
var y = 2;   // yを初期化
document.write(x + " " + y); // 1 2
テストをしてみて‹/›
例2:
var x = 1;   // xを初期化
document.write(x + " " + y); // 1 undefined
var y = 2;   // yを初期化
テストをしてみて‹/›

例2中、宣言(var y)のみをホイストンし、初期化(=) 2)は先頭にホイストンされます。

ホイストンのために、yを使用する前にyが宣言されていますが、初期化がホイストンされないため、yの値は未定義です。

上の例は以下のように暗黙的に解釈されます:

var x; // xを宣言
var y; // yを宣言
// ホイストン終了.
x = 1; // xを初期化
document.write(x + " " + y);  // 1 undefined
y = 2; // yを初期化
テストをしてみて‹/›

常に先頭で変数を宣言してください

ホイストン(Hoisting)は、JavaScriptの未知または無視される動作です。

ホイストン(Hoisting)を理解していない場合、プログラムにエラーが含まれている可能性があります。

エラーを避けるために、常に各スコープの先頭ですべての変数を宣言してください。

注意:変数が宣言されていない場合、厳格モードのJavaScriptでは変数を使用することは許可されません。

「use strict」の詳細は次の章で説明します。