每日前端基礎(chǔ)——全局作用域中,用const和let聲明的變量存在哪里

在ES5中,頂層對象的屬性與全局變量是等價的,所以使用 varfunction 聲明的全局屬性都是屬于頂層對象的屬性,而在JS中頂層元素就是 window,所以可以通過 window 來獲取聲明的全局屬性:

頂層對象屬性

首先我們要知道 constlet 都是在ES6才出的關(guān)鍵字,在ES6之前是沒有的,而且在ES6中,新增了一個塊級作用域的概念,還有一點(diǎn)就是,使用 var 關(guān)鍵字定義的變量會提升到window;我們先舉幾個例子來說明一下什么是塊級作用域:

var a = "外層變量"

function test1() {
    console.log(a) // 外層變量
}

// var會變量提升,提升到函數(shù)的最上面,就相當(dāng)于現(xiàn)在函數(shù)中聲明了a
// 然后在if中初始化了a,需要注意的是,變量提升只提升聲明,不提升初始化
function test2() {
    console.log(a) // undefine
    if (false) {
        var a = "內(nèi)層變量"
    }
    console.log(a) // 輸出 undefine(若上面的if條件是true的話則輸出 內(nèi)層變量)
}

// let不會變量提升,所以函數(shù)內(nèi)的a只在if中有效果
function test3() {
    console.log(a) // 外層變量
    if (false) {
        let a = "內(nèi)層變量"
    }
    console.log(a) // 外層變量
}

兩個大括號之間的就稱之為一個塊,塊級作用域也就指的是在當(dāng)前大括號內(nèi)聲明的變量只在當(dāng)前大括號中有用,出了大括號就訪問不到了,我們來看一下使用 const/let 聲明的變量能不能用頂層對象訪問到:

非頂層對象屬性

我們可以看到,使用 const/let 聲明的全局變量,不屬于頂層對象的屬性,訪問不到,那么他們存在于哪里呢?怎么能獲取到呢?

const/let聲明的變量

我們可以看到,使用console.dir打印了Function中所有的屬性與方法,我們用 const/let 聲明的對象存在于這里面,這個Function是個什么東西呢?前面我們說到塊級作用域,函數(shù)內(nèi)部都是屬于塊級作用域,所以最后的結(jié)論就是 const/let 聲明的全局變量存在于塊級作用域中。同時也能看出,從ES6開始,全局變量將慢慢的與頂層對象的屬性脫離關(guān)系。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

友情鏈接更多精彩內(nèi)容