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

李德東發表於2018-06-04

一、變數提升

  在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() {}

 

相關文章