JavaScript作用域編寫提升的方法是什么

本篇內容主要講解“JavaScript作用域編寫提升的方法是什么”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學習“JavaScript作用域編寫提升的方法是什么”吧!

提升什么？

把變量與函數的聲明移到編寫所處作用域的最上面，叫作提升。

如下代碼：

console.log(name); // undefined
var name = 'Rewa Fang';
console.log(name); // Rewa Fang

第一次打印name時，輸出undefined而不是拋出異常ReferenceError。 正是因為變量name聲明被提升了。 但只提升聲明，賦值不會提升；所以輸出undefined。 第二次打印時，name已經被賦值為Rewa Fang。

提升后的代碼：

var name；
console.log(name); // undefined
name = 'Rewa Fang';
console.log(name); // Rewa Fang

代碼改成下面這種寫法也是可正常執行的：

name = 'Rewa Fang';
console.log(name); // Rewa Fang 
var name；

var name; 會被提升到最上面。

這是因為編譯器在編譯階段會找到代碼中所有的聲明，并綁定在對應的作用域中。而賦值和其它邏輯代碼會留在原地；等待執行。 比如： var a = 1; 會被編譯器看作兩個部分聲明var a;和賦值a = 1; ，那么聲明會提升到作用域最上面，賦值則在原地等執行。

包含函數聲明也會提升。

函數聲明提升

sayHi(); // Hello!
function sayHi(){
    console.log('Hello!');
}

函數sayHi()可以正常執行；因為函數聲明的部分被提升了。提升為：

function sayHi(){
    console.log('Hello!');
}
sayHi(); // Hello!

函數內部的變量和函數也會提升至函數最上面：

var name = 'Lebron James';
sayHi(); // Hello! Rewa Fang
function sayHi(){
    name = 'Rewa Fang';
    console.log('Hello! '+name);
    var name;
}

函數內的name會提升至函數創建的作用域最上面，所以函數內部不會引用到外部name。 內部的name遮蔽了外部變量name。

提升后：

function sayHi(){
    var name;
    name = 'Rewa Fang';
    console.log('Hello! '+name);
}
var name;
name = 'Lebron James';
sayHi(); // Hello! Rewa Fang

提升后有一個變化，就是函數聲明會優先于變量提升。

比如：

console.log(sayHi);
var sayHi = 'Lebron James';
function sayHi(){
    console.log('Hello! ');
}

結果會輸出：? sayHi(){console.log('Hello! ');} node環境下輸出：[Function: sayHi]

why ？

為什么需要提升？

有以下原因：

• 優化性能； 編譯器在代碼運行前進行編譯會預先處理變量和函數的聲明，統一管理作用域。保持代碼由上而下的順序變量在引用之前聲明。 不過代碼的順序是可以人為控制的，像Java不需要提升開發者可以有效地管理好變量的聲明。 所以這可能并不是最重要的提升原因，也可能是個歷史遺留問題。

• 函數間的相互調用； 如下代碼，如果函數b沒有提升； 函數a中調用就會拋出異常；提升就可以讓函數式編程變得更靈活。

   function a (){
      var a = 1;
       return b(a);
   }
   function b(num){
      return num * 2;
   }

PS: ES6中 let const 不會被提升

到此，相信大家對“JavaScript作用域編寫提升的方法是什么”有了更深的了解，不妨來實際操作一番吧！這里是億速云網站，更多相關內容可以進入相關頻道進行查詢，關注我們，繼續學習！