ES6學習筆記01 -- 暫時性死區 ( temporal dead zone )

參考文檔:  let 和 const 命令 - ECMAScript6入門 html

       暫時性死區(temporal dead zone)git

       理解ES6中的TDZ(暫時性死區)

       ES6 中 let 暫時性死區詳解es6

注:文中代碼僅做示意,複製運行時須要適當調整segmentfault

   ES6 規定,若是代碼區塊中存在 let  const 命令聲明的變量,這個區塊對這些變量從一開始就造成了封閉做用域,直到聲明語句完成,這些變量才能被訪問(獲取或設置),不然會報錯ReferenceError。這在語法上稱爲「暫時性死區」(英temporal dead zone,簡 TDZ),即代碼塊開始到變量聲明語句完成之間的區域。
  經過 var 聲明的變量擁有變量提高、沒有暫時性死區,做用於函數做用域:
    • 當進入變量的做用域(包圍它的函數),當即爲它建立(綁定)存儲空間,當即被初始化並被賦值爲 undefined   
    • 當執行到變量的聲明語句時,若是變量定義了值則會被賦值
    (function fn() {  //函數做用域開始
        console.log(temp)  //undefined
        //聲明
        var temp 
        console.log(temp)  //undefined
        //賦值
        temp = 123
        console.log(temp)  //123
    })()
    //在函數做用域外訪問
    console.log(temp)  //ReferenceError: temp is not defined

 

  經過 let 聲明的變量沒有變量提高、擁有暫時性死區,做用於塊級做用域:函數

    • 當進入變量的做用域(包圍它的語法塊),當即爲它建立(綁定)存儲空間,不會當即初始化,也不會被賦值
    • 訪問(獲取或設置)該變量會拋出異常 ReferenceError
    • 當執行到變量的聲明語句時,若是變量定義了值則會被賦值,若是變量沒有定義值,則被賦值爲undefined
        {  //函數做用域開始,TDZ開始
            console.log(temp)  //ReferenceError: temp is not defined
            //聲明
            let temp  
            console.log(temp)  //ReferenceError: Cannot access 'temp' before initialization
            //賦值
            temp = 345  //TDZ結束
            console.log(temp)  //345
            //塊級做用域結束
        }
        //在塊級做用域外訪問
        console.log(temp)  //ReferenceError: temp is not defined

 

  經過 const 聲明的常量,須要在定義的時候就賦值,而且以後不能改變,暫時性死區與 let 相似。post

        {   //做用域開始,TDZ開始
            console.log(temp)  //ReferenceError: temp is not defined
            //聲明並賦值
            const temp = 789  //TDZ結束
            console.log(temp)  //789 
            //給常量賦值
            temp = 987  //TypeError: Assignment to constant variable
            //做用域結束
        }   
        //在做用域外訪問
        console.log(temp)  //ReferenceError: temp is not defined

 

   一句話總結:在塊級做用域中, let  const 聲明的變量、常量在聲明語句執行完成以前不能訪問(包括聲明語句自己)
  另外,容易由於 暫時性死區 而出錯的細節代碼在此不展開舉例,參考文檔中有詳情舉例。
 
  附:第一次寫學習筆記,寫隨筆花費的時間比學習相關內容的時間還要長,感受有點本末倒置,不過之後回頭看應該會以爲有所值得吧!
相關文章
相關標籤/搜索