JavaScript 中“提升”的原因

這篇文章將為大家詳細講解有關JavaScript 中“提升”的原因，小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。

在執行JavaScript代碼之前，js引擎首先會對其進行解析和編譯。在編譯階段，變量和函數聲明被放入內存，這被稱為提升(hoisting)。

需要注意的是，聲明只是被提升，而不是被初始化，這意味著如果一個變量在使用后被聲明并初始化，則不會初始化它的值。

function

使用 function 聲明時，可以在定義之前調用這個函數，它會按預期正常工作。例如：

hello(); // 輸出 'Hello world!'  function hello() {   console.log('Hello world!'); }  hello(); // 輸出 'Hello world!'

在上面的例子中， function 聲明被提升到其作用域的頂部，并且由于函數聲明的性質，在聲明之前就可用。不過這是函數提升行為的唯一案例。

var

另一方面，var 聲明的行為有所不同，在其初始化之前進行訪問會返回 undefined。例如：

console.log(x); // 輸出 'undefined' f(); // 拋出異常：'Uncaught TypeError: f is not a function'  var x = 1; var f = () => 'Hi!';  console.log(x); // 輸出 '1' f(); // 返回 'Hi!'

正如你在這個例子中所看到的，var 聲明被提升到它作用域的頂部，但是變量的值只有在初始化代碼被執行時才會初始化，所以在初始化這行代碼之前是  undefined。

const 和 let

const 和 let 聲明被提升，但它們沒有被初始化為 undefined。而是會給你一個錯誤，這也是 class 聲明的行為方式。例如：

console.log(y); // 拋出異常： 'Uncaught ReferenceError: Cannot access "y" before initialization' g();  // 拋出異常： 'Uncaught ReferenceError: Cannot access "g" before initialization'  let y = 2; const g = () => 'Hey!';  console.log(y); // 輸出 '2' f(); // 返回 'Hey!'

一般情況下，在初始化之前訪問用 var 聲明的變量會默默地失敗，對 const 或 let做同樣的事情會導致一個清晰的、易于調試的錯誤。

總結

• 在使用變量、函數、對象和類之前，務必要先定義它們。ESLint 可能可以幫你解決這個問題。

• 在項目中要盡可能的使用 const 和 let，而不是 var 。這樣可以減少很多麻煩。

• 如果可能的話，只使用箭頭函數或 function 聲明。一致性有助于減少混亂。

關于“JavaScript 中“提升”的原因”這篇文章就分享到這里了，希望以上內容可以對大家有一定的幫助，使各位可以學到更多知識，如果覺得文章不錯，請把它分享出去讓更多的人看到。