JavaScript中怎么實現變量提升與函數提升

本篇文章為大家展示了JavaScript中怎么實現變量提升與函數提升，內容簡明扼要并且容易理解，絕對能使你眼前一亮，通過這篇文章的詳細介紹希望你能有所收獲。

eg1：

var i;
console.log(i); // 2

eg2：

console.log(i); // undefined
var i = 2;

1、提升

變量和函數聲明從它們在代碼中出現的位置被提升到了最上面。

注意：

只有聲明本身會被提升，而賦值操作不會被提升。

變量會提升到其所在函數的最上面，而不是整個程序的最上面。

函數聲明會被提升，但函數表達式不會被提升：

func1(); // Uncaught TypeError: func1 is not a function
func2(); // Uncaught ReferenceError: func2 is not defined
var func1 = function func2() { ... };

JavaScript中的ReferenceError和TypeError：

①　ReferenceError：引用錯誤。JavaScript引擎查詢變量時，若在作用域里沒有找到該變量，JavaScript引擎就會拋出一個ReferenceError。

②　TypeError：類型錯誤。當在作用域中找到了某變量引用，然后讓該變量去做力所不能及的事情時，如引用它一個不存在的屬性，或將非函數的變量用作函數引用，JavaScript引擎就會拋出一個TypeError。

2、函數優先

函數聲明和變量聲明都會被提升，但是需要注意的是函數會先被提升，然后才是變量。

func(); // 1
var func;
function func() {
  console.log(1);
}
func = function() {
  console.log(2);
}

運行結果：輸出1而不是2

理由：var func;盡管出現在function func()之前，但它是重復的聲明，會被忽略，因為函數聲明會被提升到普通變量之前。上述代碼等價于：

function func() {
  console.log(1);
}
func(); // 1
func = function() {
  console.log(2);
}

盡管重復的聲明會被忽略掉，但出現在后面的函數聲明還是可以覆蓋前面的：

func(); // 3
function func() {
  console.log(1);
}
func = function() {
  console.log(2);
}
function func() {
  console.log(3);
}

一個普通塊內部的函數聲明通常會被提升到其所在作用域的頂部，提升過程不會被條件判斷所控制：

func(); // 2
var flag = true;
if (flag)
  function func() { console.log(1); }
else
  function func() { console.log(2); }

注意：盡量避免在塊內聲明函數，在JavaScript未來的版本中上述行為可能會發生改變。

上述內容就是JavaScript中怎么實現變量提升與函數提升，你們學到知識或技能了嗎？如果還想學到更多技能或者豐富自己的知識儲備，歡迎關注億速云行業資訊頻道。