最新的Web開發教程
 

JavaScript Hoisting


Hoisting是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
試一試»

要理解這一點,你要明白的術語"hoisting"

Hoisting是JavaScript的移動所有聲明在當前範圍(以當前腳本的頂部或當前函數)頂部的默認行為。


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是在最後一個例子未定義?

這是因為只有聲明(變量y)時,不初始化(= 7)被提升到上方。

由於hoisting ,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
試一試»

聲明變量在頂端!

Hoisting是(很多開發者)的JavaScript的一個未知的或忽略的行為。

如果開發人員不理解hoisting ,計劃可能包含的bug(錯誤)。

為了避免錯誤,總是在每一個範圍的開頭聲明所有變量。

由於這是JavaScript的如何解釋的代碼,它始終是一個很好的規則。

JavaScript的嚴格模式不允許,如果他們不聲明中使用的變量。
學習"use strict"下一章。