Hoisting 概念筆記
Published in
2 min readSep 20, 2020
最近學到JavaScript的Hoisting概念,在這邊記錄一下學到的內容。
function 和 var 的Hoisting特性
- 首先,在JavaScript中function的提升優先權是高於var的。
這個意思是function定義的內容會放在比var 宣告的地方還要更前面。
var name = 'Tom';
function callName(name)
{
console.log(name);
}// 雖然,上面的內容看起來name的宣告是在callName函式前面,但對編譯器來說,其實是
// callName函式的定義是放在name宣告的前面
2. 將程式碼區分成編譯時期 與 執行時期,來分清楚var 和 function是在什麼時候做宣告,又在什麼時候被賦值,又在什麼時候被呼叫
function func1()
{
console.log(num);
}
var num =1;function func2()
{
var num = 2;
console.log(num);
func1();
}
func2();//----------------以下拆解成編譯時期 和 執行時期----------------//
//-- 編譯時期---//
function func1()
{
console.log('num='+num);
}
function func2()
{
var num = 2;
console.log('num='+num);
func1();
}
var num;//-- 執行時期---//
num = 1;
func2(); // 以上的執行結果,會先呈現num=2 再呈現 num=1
// 因為,在呼叫func2(),會先呈現在func2()內的區域變數的num,所以是2,
// 當換呼叫func1()時,此時,num會吃到全域變數的num=1的數值。
以上紀錄一下var 和 function 在 JavaScript的Hoisting特性 與 編譯器在編譯時期與執行時期是怎麼操作它們的。