深入理解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表達式為接受的每一個變量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 = <T extends new …

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

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

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

    訂單及購物車 先從庫存服務中將 srv 的服務代碼框架複製過來,查找替換對應的名稱(order_srv) 加密技術基礎 對稱加密(Symmetric Encryption) 原理: 使用同一個密鑰進行加密和解密 就像一把鑰匙,既能鎖門也能開門 加密速度快,適合大量數據傳輸 使用場景: 本地文件加密 數據庫內容加密 大量數據傳輸時的內容加密 內部系統間的快速通…

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