變量提升
JavaScript引擎工作的方式是,先解析代碼,獲取所有被聲明的變量,然后一行一行地運行。這造成的結果,就是所有的變亮的聲明語句都會被提升到代碼頭部,這就叫做變量提升(hoisting)。
舉幾個栗子:
console.log(a);
var a = 1;
上面代碼使用console.log(a)
的方法在控制臺顯示變量a的值,但是這是變量a的值并沒有聲明和賦值。學過C語言的同學會說這樣子是錯誤的,但是在JavaScript中并不是錯誤的。實際上運行的過程是這樣子的:
var a;
console.log(a);
a =1;
最后顯示的結果為undefined
,表示變量a
已經聲明,但是并沒有賦值。
變量提升只對var
聲明的變量有效,如果一個變量不是用var聲明的,那么這個變量就不會發生變量提升。
let b;
console.log(b);
上面語句會報錯!ReferenceError: b is not defined
說明變量b并沒有被聲明,這是因為b
不是用var
命令聲明的,所以JavaScript引擎不會將其提升。
var x = 5 //初始化x
elem = document.getElemById("demo")
elem.innerHTML = x + " " + y
var y = 7 //初始化y
在上述代碼中,y
輸出了undefined
, 這是因為變量聲明y
提升了,但是初始化y=7
并不會提升,所以y
變量是一個未知的變量。
var x = 5;
var y;
elem = document.getElementById("demo");
elem.innerHTML = x + " " + y ;
y = 7;
上面的代碼之前錯誤代碼的正確寫法。
因此,我們得養成一個良好的習慣,在頭部就聲明我們的變量從而避免不必要的錯誤。
未完待續。。。