深入理解ES6 001【學習筆記】

區塊級作用域綁定

之前的變數宣告var無論在哪裡宣告的都被認為是作用域頂部宣告的,由於函式是一等公民,所以順序一般是function 函式名稱()var 變數

區塊級宣告

區塊級宣告用於宣告在指定區塊的作用域之外無法存取的變數。區塊級作用域存在於:

  • 函式內部
  • 區塊中(字元和{}之間的區域)

暫時性死區

JavaScript 引擎在掃描程式碼發現變數宣告時,要麼將它們提升至作用域頂部,要麼放到 TDZ 中。存取 TDZ 的變數會觸發執行時錯誤。只有執行過變數宣告後,變數才會從 TDZ 中移出,然後存取可正常存取。

if(condition){
  console.log(typeof value) // 引用錯誤
  let value = "blue";
}
// 以下的 value 並不在 TDZ 中
console.log(typeof value); // "undefined"
if(condition){
  let value="blue"
}

迴圈中的區塊作用域綁定

使用let 變數只存在於 for 迴圈中,一旦迴圈結束,無法存取這個變數

for(let i=0;i<10;i++){
  process(items[i]);
}
// i 在這裡不可存取,拋出一個錯誤
console.log(i);

迴圈中的函式

var宣告讓開發者在迴圈中建立函式變得異常困難,因為變數到了迴圈之外仍能存取。

var funs = [];
for(var i=0;i<10;i++){
  funs.push(function(){
    console.log(i)
  })
}
funcs.forEach(function(func){
  func(); // 輸出 10 次數字 10
})

為瞭解決這個問題,開發者們在迴圈中使用立即呼叫函式表達式(IIFE),以強制生成計數變數的副本。IIFE 表達式為接受的每一個變數 i 都建立一個副本並儲存為變數 value。這個變數的值就是相應迭代建立的函式所使用的值,因此呼叫每個函式

var funs = [];
for(var i=0;i<10;i++){
  funs.push((function(value){
    return function(){
      console.log(i)
    }
  })(i))
}
funcs.forEach(function(func){
  func(); // 輸出 0,1,2...
})

迴圈中的 let 宣告

let宣告模仿上述所做的一切來簡化迴圈過程,每次迭代迴圈都建立一個新變數,並以之前迭代中同名變數的值將其初始化。也適合於for-in for-of for-each

var funs = [];
for(let i=0;i<10;i++){
  funs.push(function(){
    console.log(i)
  })
}
funcs.forEach(function(func){
  func(); // 輸出 0,1,2...
})

let 宣告在迴圈內的行為是標準中專門定義的,它不一定與 let 的不提升特性相關,理解這一點至關重要。事實上,早期 let 實作中不包含這一行為。是後來加入的。

迴圈中使用 const

for(const i=0;i<10;i++)會報錯,因為i++時試圖改變常數 i 的值。而在for-infor-of中因為沒有去試圖改變原 i 值的操作。而是新建立了一個變數。所以執行會跟使用let宣告一樣

全域作用域綁定

letconstvar的另一個區別是它們在全域作用域中的行為。當 var 被用於全域作用域時,它會建立一個新的全域變數作為全域物件的屬性。這意味著 var 很有可能會無意中覆寫一個已經存在的全域變數。而使用letconst不能覆寫全域變數,而只能遮蔽它。so

let RegExp = 'Hello world'
console.log(window.RegExp === RegExp)

主題測試文章,只做測試使用。發佈者:Walker,轉轉請注明出處:https://walker-learn.xyz/archives/4308

(0)
Walker的頭像Walker
上一篇 2025年3月8日 10:59
下一篇 2025年3月27日 15:01

相關推薦

  • Go工程師體系課 protobuf_guide【學習筆記】

    Protocol Buffers 入門指南 1. 簡介 Protocol Buffers(簡稱 protobuf)是 Google 開發的一種語言無關、平台無關、可擴充的結構化資料序列化機制。與 JSON、XML 等序列化方式相比,protobuf 更小、更快、更簡單。 專案首頁:https://github.com/protocolbuffers/prot…

    個人 2025年11月25日
    1.2K00
  • 深入理解ES6 002【學習筆記】

    字串與正規表達式 字串與正規表達式 JavaScript 字串一直都是基於 16 位元字元編碼(UTF-16)建構而成。每 16 位元的序列是一個編碼單元(code unit),代表一個字元。length、charAt() 等字串屬性與方法都是基於這個編碼單元建構的。Unicode 的目標是為世界上每一個字元提供全球唯一的識別碼。如果我們將字元長度限制在 16 位元,碼位數量將不…

    個人 2025年3月8日
    1.8K00
  • TS珠峰 003【學習筆記】

    裝飾器 // 裝飾器 // 只能在類別中使用(類別本身,類別成員使用) // 裝飾器,類別的裝飾器,屬性裝飾器,存取器裝飾器 參數裝飾器 // 1. 類別裝飾器 給類別進行擴充,也可以回傳一個子類別 // 必須先在tsconfig.json中啟用experimentalDecorators const classDecorator1 =

    個人 2025年3月27日
    1.4K00
  • 無畏前行,拳釋力量 🥊💪

    拚搏,是一種態度。生活就像一場比賽,沒有捷徑可走,只有不斷訓練、突破、超越,才能站上屬於自己的舞台。這不僅是一種對抗,更是一種自我的覺醒——敢於迎戰,敢於挑戰,敢於成為更強的自己。 運動中的拚搏精神 無論是拳擊、跑步,還是力量訓練,每一次出拳、每一次揮汗、每一次咬牙堅持,都是對身體與心靈的磨練。拚搏不是單純的對抗,而是一種態度——面對挑戰,不退縮;面對失敗,…

    個人 2025年2月26日
    1.3K00
  • Go工程師體系課 008【學習筆記】

    訂單及購物車 先從庫存服務中將 srv 的服務程式碼框架複製過來,搜尋取代對應的名稱(order_srv) 加密技術基礎 對稱式加密(Symmetric Encryption) 原理: 使用同一個金鑰進行加密和解密 就像一把鑰匙,既能鎖門也能開門 加密速度快,適合大量資料傳輸 使用情境: 本機檔案加密 資料庫內容加密 大量資料傳輸時的內容加密 內部系統間的快速通…

    個人 2025年11月25日
    19600
簡體中文 繁體中文 English
歡迎🌹 Coding never stops, keep learning! 💡💻 光臨🌹