JavaScript作用域(Scope) | Javascript

作用域(Scope)代表你宣告的變數可以在哪些區域作用, JavaScript 新手開發人員常常會因為變數作用域在錯誤的區域使用變數,而造成許多隱密的bug。

JavaScript中的作用域: 作用域定義了變量聲明和訪問的上下文。
有兩種主要類型的作用域: 全局作用域和局部(或函數)作用域。
全局作用域包含整個腳本,而局部作用域僅限於特定函數或代碼塊。 \

  • 函數作用域(function scope):
    • var
  • 塊級作用域(block scope):
    • let
    • const

全局作用域:

在任何函數或代碼塊外部聲明的變量具有全局作用域。
它們可以在腳本的任何地方訪問。 \

// 全局作用域
let globalVar = '我是全局的';

function exampleFunction() {
  console.log(globalVar); // 在函數內部可訪問
}

exampleFunction();
console.log(globalVar); // 在函數外部可訪問

局部作用域:

在函數或代碼塊內部聲明的變量具有局部作用域,只能在該特定上下文中訪問。

function exampleFunction() {
  // 局部作用域
  let localVar = '我是局部的';
  console.log(localVar); // 在函數內部可訪問
}

exampleFunction();
console.log(localVar); // 錯誤: localVar未定義

區塊作用域(ES6及以後):

在ECMAScript 6(ES6)中引入的區塊作用域允許變量被限制在花括號中,例如if語句或循環。

if (true) {
  // 區塊作用域
  let blockVar = '我在區塊中';
  console.log(blockVar); // 在區塊內部可訪問
}

console.log(blockVar); // 錯誤: blockVar未定義