--- id: javascript-scope title: "JavaScript Scope" category: "Frontend" status: "draft" verification_status: "conceptual" canonical_id: "" aliases: ["variable scope", "global scope", "function scope", "block scope", "local variables"] duplicate_of: "" source_trust_level: "B" confidence_score: 0.88 created_at: 2026-06-23 updated_at: 2026-06-23 review_reason: "" merge_history: [] tags: ["javascript", "js", "web", "frontend", "w3schools", "scope", "variables", "let", "const", "var"] raw_sources: ["https://www.w3schools.com/js/js_scope.asp"] applied_in: [] github_commit: "" --- # [[JavaScript Scope]] ## 🎯 ν•œ 쀄 톡찰 (One-line insight) Scope determines the accessibility (visibility) of variables β€” JavaScript has three kinds: global, function, and block. [S1] ## 🧠 핡심 κ°œλ… (Core concepts) - **Scope = accessibility** β€” scope determines where variables are visible and reachable in your code. [S1] - **Three scopes** β€” JavaScript has global scope, function scope, and (since ES6) block scope. [S1] - **`let` and `const` are block scoped** β€” variables declared with `let` and `const` inside a block `{ }` cannot be accessed outside it; `var` is *not* block scoped. [S1] - **Function scope applies to all three keywords** β€” `var`, `let`, and `const` are all function-scoped when declared inside a function and cannot be accessed from outside. [S1] - **Automatic globals are a trap** β€” assigning a value to an undeclared variable makes it a global automatically, which is discouraged; strict mode prevents it. [S1] - **Lifetime** β€” local (function) variables live only while the function runs; global variables live until the page/browser closes. [S1] ## 🧩 μΆ”μΆœλœ νŒ¨ν„΄ (Extracted patterns) - **Declare in the narrowest scope** β€” keep variables local to the function or block that uses them. [S1] - **Prefer block scope for safety** β€” use `let`/`const` inside blocks to confine variables and avoid leaks. [S1] - **Avoid undeclared assignment** β€” always declare before assigning to avoid creating accidental globals. [S1] ## πŸ“– μ„ΈλΆ€ λ‚΄μš© (Details) **What is scope?** Scope determines the accessibility (visibility) of variables. JavaScript has 3 types of scope: Block scope, Function scope, and Global scope. [S1] **Global Scope** Variables declared *outside* any function or block have global scope and can be accessed everywhere, whether declared with `var`, `let`, or `const`: [S1] ```javascript let carName = "Volvo"; // code here can use carName function myFunction() { // code here can also use carName } ``` **Function Scope (Local Scope)** Variables declared inside a function are local to that function and cannot be accessed from outside. Each function creates a new scope, and all three declaration keywords behave the same way here: [S1] ```javascript function myFunction1() { var carName = "Volvo"; // Function Scope } function myFunction2() { let carName = "Volvo"; // Function Scope } function myFunction3() { const carName = "Volvo"; // Function Scope } ``` **Block Scope** Before ES6 (2015), JavaScript had only global scope and function scope. ES6 introduced `let` and `const`, which provide block scope. Variables declared inside a `{ }` block with `let` or `const` cannot be accessed from outside the block: [S1] ```javascript { let x = 2; } // x can NOT be used here ``` Variables declared with `var` do *not* have block scope and *can* be accessed outside the block: [S1] ```javascript { var x = 2; } // x CAN be used here ``` **Automatically Global** If you assign a value to a variable that has not been declared, it automatically becomes a global variable. This is discouraged. [S1] **Strict Mode** In "strict mode", undeclared variables are not automatically global. [S1] **The Lifetime of JavaScript Variables** The lifetime of a JavaScript variable starts when it is declared. Function (local) variables are deleted when the function completes. Global variables are deleted when you close the page (or browser window). [S1] ## πŸ› οΈ 적용 사둀 (Applied in summary) The page's own snippets illustrate the rule directly: the same `carName` variable visible globally vs. confined inside `myFunction1/2/3`, and the contrast between `let x` (block scoped) and `var x` (leaks out of the block). No external project/commit applications found in the source. ## πŸ’» μ½”λ“œ νŒ¨ν„΄ (Code patterns) Block scope with `let`/`const` (language: JavaScript): ```javascript { let x = 2; } // x can NOT be used here ``` `var` ignores block scope: ```javascript { var x = 2; } // x CAN be used here ``` ## βš–οΈ 비ꡐ 및 선택 κΈ°μ€€ (Comparison & decision criteria) - **`var` vs. `let`/`const` for block scope** β€” only `let` and `const` are confined to the block; `var` escapes to the enclosing function/global scope. Choose `let`/`const` to limit visibility. [S1] - **Global vs. local** β€” declare globally only when the value must be shared everywhere; otherwise keep variables local for shorter lifetime and fewer collisions. [S1] ## βš–οΈ λͺ¨μˆœ 및 μ—…λ°μ΄νŠΈ (Contradictions & updates) No contradictions found in the source. ## βœ… 검증 μƒνƒœ 및 신뒰도 - **μƒνƒœ:** draft - **검증 단계:** conceptual (μ‹€μ œ 적용 사둀 발견 μ‹œ applied/validated둜 승격 κ°€λŠ₯) - **좜처 신뒰도:** B (W3Schools β€” widely used educational reference, not a primary standards body) - **μ‹ λ’° 점수:** 0.88 - **쀑볡 검사 κ²°κ³Ό:** μ‹ κ·œ 생성 (New discovery) ## πŸ”— 지식 κ·Έλž˜ν”„ (Knowledge Graph) - **μƒμœ„/루트:** [[JavaScript Tutorial]] - **κ΄€λ ¨ κ°œλ…:** [[JavaScript var let const]], [[JavaScript Code Blocks]], [[JavaScript Hoisting]], [[JavaScript Strict Mode]] - **μ°Έμ‘° λ§₯락:** Underpins decisions about where to declare variables and which keyword to use. ## πŸ“š 좜처 (Sources) - [S1] W3Schools β€” JavaScript Scope β€” https://www.w3schools.com/js/js_scope.asp ## πŸ“ λ³€κ²½ 이λ ₯ (Change history) - 2026-06-23: Initial draft synthesized from the W3Schools "JavaScript Scope" page (Astra wiki-curation, P-Reinforce v3.1 format).