吊裝

什麼是吊裝?

提升是一種將所有變數和函式宣告移動到其範圍頂部的機制。但是,變數賦值仍然發生在最初的位置。

例如,請考慮以下程式碼:

console.log(foo);  // → undefined
var foo = 42;
console.log(foo);  // → 42

以上程式碼與:

var foo;             // → Hoisted variable declaration
console.log(foo);    // → undefined
foo = 42;            // → variable assignment remains in the same place
console.log(foo);    // → 42

請注意,由於提升上述 undefined 與執行所產生的 not defined 不同:

console.log(foo);    // → foo is not defined 

類似的原則適用於功能。當函式分配給變數(即函式表示式 )時,變數宣告將被提升,而賦值保留在同一位置。以下兩個程式碼段是等效的。

console.log(foo(2, 3));     // → foo is not a function

var foo = function(a, b) {
    return a * b;
}
var foo;
console.log(foo(2, 3));     // → foo is not a function
foo = function(a, b) {
    return a * b;
}

宣告函式語句時 ,會出現不同的情況。與函式語句不同,函式宣告被提升到其作用域的頂部。請考慮以下程式碼:

console.log(foo(2, 3));  // → 6
function foo(a, b) {
    return a * b;
}

由於提升,上面的程式碼與下一個程式碼段相同:

function foo(a, b) {
    return a * b;
}

console.log(foo(2, 3));  // → 6

以下是一些什麼是什麼,什麼不是吊裝的例子:

// Valid code:
foo();

function foo() {}

// Invalid code:
bar();                     // → TypeError: bar is not a function
var bar = function () {};

// Valid code:
foo();
function foo() {
    bar();
}
function bar() {}

// Invalid code:
foo();
function foo() {
    bar();                // → TypeError: bar is not a function
}
var bar = function () {};

// (E) valid:
function foo() {
    bar();
}
var bar = function(){};
foo();

吊裝的侷限性

初始化變數不能是 Hoisted 或簡單的 JavaScript Hoists 宣告不能初始化。

例如:以下指令碼將提供不同的輸出。

var x = 2; 
var y = 4; 
alert(x + y);

這將給你 6 的輸出。但是……

var x = 2; 
alert(x + y);
var y = 4; 

這將為你提供 NaN 的輸出。由於我們正在初始化 y 的值,因此不會發生 JavaScript Hoisting,因此 y 值將是未定義的。JavaScript 將認為 y 尚未宣告。

所以第二個例子與下面的例子相同。

var x = 2; 
var y;
alert(x + y);
y = 4; 

這將為你提供 NaN 的輸出。

StackOverflow 文件