使用const/let聲明的全局變數不見了？

• 2020 年 3 月 5 日
• 筆記

在ES5中，頂層對象的屬性與全局變數是等價的，所以使用 var 或 function 聲明的全局屬性都是屬於頂層對象的屬性，而在JS中頂層元素就是 window，所以可以通過 window 來獲取聲明的全局屬性：

頂層對象屬性

首先我們要知道 const 和 let 都是在ES6才出的關鍵字，在ES6之前是沒有的，而且在ES6中，新增了一個塊級作用域的概念，還有一點就是，使用 var 關鍵字定義的變數會提升到window；我們先舉幾個例子來說明一下什麼是塊級作用域：

var a = "外層變數"    function test1() {      console.log(a) // 外層變數  }    // var會變數提升，提升到函數的最上面，就相當於現在函數中聲明了a  // 然後在if中初始化了a，需要注意的是，變數提升只提升聲明，不提升初始化  function test2() {      console.log(a) // undefine      if (false) {          var a = "內層變數"      }      console.log(a) // 輸出 undefine（若上面的if條件是true的話則輸出 內層變數）  }    // let不會變數提升，所以函數內的a只在if中有效果  function test3() {      console.log(a) // 外層變數      if (false) {          let a = "內層變數"      }      console.log(a) // 外層變數  }  

兩個大括弧之間的就稱之為一個塊，塊級作用域也就指的是在當前大括弧內聲明的變數只在當前大括弧中有用，出了大括弧就訪問不到了，我們來看一下使用 const/let 聲明的變數能不能用頂層對象訪問到：

非頂層對象屬性

我們可以看到，使用 const/let 聲明的全局變數，不屬於頂層對象的屬性，訪問不到，那麼他們存在於哪裡呢？怎麼能獲取到呢？

const/let聲明的變數

我們可以看到，使用console.dir列印了Function中所有的屬性與方法，我們用 const/let 聲明的對象存在於這裡面，這個Function是個什麼東西呢？前面我們說到塊級作用域，函數內部都是屬於塊級作用域，所以最後的結論就是 用 const/let 聲明的全局變數存在於塊級作用域中。同時也能看出，從ES6開始，全局變數將慢慢的與頂層對象的屬性脫離關係。