理解 JavaScript 中的作用域

Javascript 中的作用域和閉包概念是掌握該語言所需的基礎模組。僅舉幾例，他們是構造函數、工廠函數和 IIFE 背後的無名英雄。

本文旨在使用實際範例解釋 JavaScript 中的作用域。在後續文章中，我們將討論 JavaScript 閉包。

作用域和詞法作用域

作用域只是決定變數在 JavaScript 程式中的可用位置。基本上，範圍有兩種：

1. 全球範圍
2. 本地範圍

全球範圍

在全域範圍內，變數在任何地方都可用，並且可以在程式中的任何地方使用。從技術上講，當變數未在任何函數或 { 大括號 } 中宣告時，就稱它們位於全域範圍內。

本地範圍

另一方面，對於局部作用域，變數僅在特定上下文中可用，並且只能在該上下文中使用。從技術上講，當在函數或 { 大括號 } 中宣告變數時，它們被稱為局部作用域。

let x = 3; // x (global scoped)

function addXY () {
    let y = 5; // y (locally scoped)
    return  x + y; // returns 8 since x is available anywhere in this program
}

範圍更廣

ECMAScript 是標準化規範，定義了 JavaScript 等腳本語言的核心功能，確保跨平台的一致性和互通性。正如國際單位制 (SI) 為米和公斤等測量提供標準化框架以確保全球一致性一樣，ECMAScript 為 JavaScript 等腳本語言制定了標準，確保它們在不同平台和環境中統一運作。

這個 JavaScript 標準化規範已經經歷了多個版本的演變，每個版本中都添加了新功能和改進。這些版本中包括 ES6 (ECMAScript 2015)，它提供了引入 let/const 的重大更新。

在 ES6 之前，JavaScript 中使用 var 關鍵字定義變數。使用 var，變數可以被重新定義和更新。但是，var 變數僅在函數內具有局部作用域。 ES6 透過 let/const 引入了本地作用域的擴展，以包含 { 大括號 } 內的片段。簡而言之，var 變數在函數內具有局部作用域，但在其他任何地方都具有全域作用域。

let 和 const 引入了區塊作用域，這使得變數只能在定義它的最接近的 { 大括號 } 集合內可用。這些大括號可以是 for 迴圈、if-else 條件或任何其他類似 JavaScript 構造的大括號。這樣的大括號也稱為程式碼區塊。

範例：

function addXYZ() {
    var x = 3;
    let y = 4;
    const z = 5;
    return x + y + z; // 12
}

// These log undefined because var, let, and const variables are locally scoped within functions.
console.log(x);
console.log(y);
console.log(z);

let age = 10; // global variable

if (age < 18) {
    let letCandy = 2; // block-scoped variable
    console.log(`You are entitled to ${letCandy} candies`);
} else {
    var varCandy = 4; // function-scoped variable
    console.log(`You are entitled to ${varCandy} candies`);
}

console.log(age); // Logs 10, as age is globally scoped
console.log(letCandy); // Throws ReferenceError, as letCandy is block-scoped
console.log(varCandy); // Logs 4, as varCandy is globally scoped outside of functions

在後續文章中，我們將討論詞法範圍和閉包。感謝您的閱讀。

以上是理解 JavaScript 中的作用域的詳細內容。更多資訊請關注PHP中文網其他相關文章！