淺談JS聲明提前

聲明提前這個概念對於前端攻城獅來說是一個很了解的了，但是對於初入前端的新人來說，這又是一個不得不談的話題

下面我將介紹一下什么是聲明提前

console.log(a);               //undefined
var a;
a=10;
console.log(a)                //10;

如上面代碼所示，在我並未定義a時，試着輸出a，js並沒有報錯，而是用undefined顯示，

在第4行輸出a時結果是正確顯示的，第一行為什么不報錯呢？

原因是這樣的，在js中存在這樣一種機制，在程序正式執行之前，會將var聲明的變量和function聲明的函數預讀到當前作用域的頂部，

js中的作用域我會在后面的章節中詳細去寫，在這里大家只需要先將作用域理解成變量生效的位置即可，

但賦值會保留在原位置，這也就形成第一行輸出的結果，js真實的過程是將第二行提前到了第一行之前，當js執行到第一行時，

由於var a被提前了，但並未賦初始值，所以輸出了undefined，到這里大家應該理解了什么是聲明提前

聲明提前破壞了程序的執行順序，所以大家知道原理即可，切勿在實際開發過程中使用，不僅會降低代碼可讀性，還容易造成程序錯誤

function a(){
    console.log(10);  
}
a();                                       //20
function a(){
    console.log(20);      
}
a();                                       //20

如上圖所示，本意是想調用這個函數輸出10和20，但由於聲明提前，后一個a函數將第一個a函數覆蓋，10永遠無法輸出，

這在生產環境中是很容易產生的，兩個人一起工作，你聲明一個函數或變量，而另一個人也聲明了一個跟你相同的函數或變量，

導致出現的bug非常難以發現和修改，所以在ES6的規定中，建議用let關鍵字來代替var，采用匿名函數自調(一種解決js全局作用域弊病的方法)的方式

來解決聲明提前的問題

 

好啦，如有錯誤請多指正