深入理解js的變數提升和函式提升

李德東發表於2018-06-04
JS變數函式

一、變數提升

　　在ES6之前，JavaScript沒有塊級作用域(一對花括號{}即為一個塊級作用域)，只有全域性作用域和函式作用域。變數提升即將變數宣告提升到它所在作用域的最開始的部分。上個簡歷的例子如：

console.log(global); // undefined
var global = 'global';
console.log(global); // global
 
function fn () {
　　console.log(a); // undefined
　　var a = 'aaa';
　　console.log(a); // aaa
}
fn();
　之所以會是以上的列印結果，是由於js的變數提升，實際上上面的程式碼是按照以下來執行的：
var global; // 變數提升，全域性作用域範圍內，此時只是宣告，並沒有賦值
console.log(global); // undefined
global = 'global'; // 此時才賦值
console.log(global); // 列印出global
 
function fn () {
　　var a; // 變數提升，函式作用域範圍內
　　console.log(a);
　　a = 'aaa';
　　console.log(a);
}
fn();


二、函式提升

　　js中建立函式有兩種方式：函式宣告式和函式字面量式。只有函式宣告才存在函式提升！如:

console.log(f1); // function f1() {}   
console.log(f2); // undefined  
function f1() {}
var f2 = function() {}
　　只所以會有以上的列印結果，是由於js中的函式提升導致程式碼實際上是按照以下來執行的：
function f1() {} // 函式提升，整個程式碼塊提升到檔案的最開始<br>　　　　　console.log(f1);   
console.log(f2);   
var f2 = function() {}

 

相關文章