docs(10_Wiki): W3Schools 위키화 — HTML/CSS/JavaScript(core)
W3Schools 튜토리얼을 P-Reinforce v3.1 포맷으로 위키화(영어 본문, 한/영 섹션 헤더). - Topic_HTML: 59문서 (튜토리얼+예제, 레퍼런스/메타 제외) - Topic_CSS: 190문서 (메인 + Advanced/Flexbox/Grid/RWD 전체) - Topic_JavaScript: 120문서 (코어 언어; Temporal/DOM상세/BOM/WebAPI/AJAX/jQuery/Graphics 등은 후속) 각 폴더 00_INDEX.md(MOC) 포함. 코드 verbatim, 미확인분은 "Not found in source" 표기. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,114 @@
|
||||
---
|
||||
id: javascript-var-let-const
|
||||
title: "JavaScript var let const"
|
||||
category: "Frontend"
|
||||
status: "draft"
|
||||
verification_status: "conceptual"
|
||||
canonical_id: ""
|
||||
aliases: ["var let const", "variable declarations", "block scope", "redeclaration", "const reassignment"]
|
||||
duplicate_of: ""
|
||||
source_trust_level: "B"
|
||||
confidence_score: 0.86
|
||||
created_at: 2026-06-23
|
||||
updated_at: 2026-06-23
|
||||
review_reason: ""
|
||||
merge_history: []
|
||||
tags: ["javascript", "js", "web", "frontend", "w3schools", "var", "let", "const", "scope", "variables"]
|
||||
raw_sources: ["https://www.w3schools.com/js/js_varletconst.asp"]
|
||||
applied_in: []
|
||||
github_commit: ""
|
||||
---
|
||||
|
||||
# [[JavaScript var let const]]
|
||||
|
||||
## 🎯 한 줄 통찰 (One-line insight)
|
||||
`var`, `let`, and `const` differ in scope, redeclaration, and reassignment — modern best practice is `const` by default, `let` when you must reassign, and avoid `var`. [S1]
|
||||
|
||||
## 🧠 핵심 개념 (Core concepts)
|
||||
- **Three declaration keywords** — `var`, `let`, and `const` declare variables but with different scoping and mutation rules. [S1]
|
||||
- **Scope** — `var` has function or global scope; `let` and `const` are confined to the nearest pair of curly braces `{ }` (block scope). [S1]
|
||||
- **Reassignment** — `var` and `let` can be updated (reassigned); `const` cannot be updated with a new value. [S1]
|
||||
- **Redeclaration** — `var` can be redeclared; `let` and `const` cannot be redeclared in the same scope. [S1]
|
||||
- **const is "const reference," not "const value"** — you cannot reassign a `const` variable to a completely new value, but you can still change the properties of an object or array assigned to it. [S1]
|
||||
- **Hoisting** — `var` is hoisted and initialized to `undefined`; `let` and `const` are also hoisted but *not* initialized, creating a temporal dead zone where access throws a `ReferenceError`. [S1]
|
||||
|
||||
## 🧩 추출된 패턴 (Extracted patterns)
|
||||
- **`const` by default** — use `const` unless you know you must reassign. [S1]
|
||||
- **`let` only when reassigning** — switch to `let` only when the variable's value must change after initialization. [S1]
|
||||
- **Avoid `var`** — its function-scope and redeclaration rules cause bugs; modern code avoids it. [S1]
|
||||
- **Mutate, don't reassign, a `const` object/array** — change properties/elements in place rather than rebinding the variable. [S1]
|
||||
|
||||
## 📖 세부 내용 (Details)
|
||||
**The three keywords**
|
||||
JavaScript declares variables with `var`, `let`, or `const`. They differ in scope, in whether they can be redeclared, and in whether they can be reassigned. [S1]
|
||||
|
||||
**Comparison of scope, reassignment, and redeclaration** [S1]
|
||||
|
||||
| Keyword | Scope | Reassignment | Redeclaration |
|
||||
|---------|-------|--------------|---------------|
|
||||
| `var` | Function or global scope | Can be updated | Can be redeclared |
|
||||
| `let` | Block scope `{ }` | Can be updated | Cannot be redeclared |
|
||||
| `const` | Block scope `{ }` | Cannot be updated | Cannot be redeclared |
|
||||
|
||||
**Block scope (`let`)**
|
||||
Both `let` and `const` are confined strictly to the nearest pair of curly braces `{ }`. A variable declared with `let` inside a block is not accessible outside it: [S1]
|
||||
```javascript
|
||||
{
|
||||
let x = 10;
|
||||
// x is accessible here
|
||||
}
|
||||
// x is NOT accessible here
|
||||
```
|
||||
|
||||
**`var` can be redeclared**
|
||||
A variable declared with `var` can be redeclared in the same scope without error. (`let` cannot be redeclared in the same scope.) [S1]
|
||||
|
||||
**`const` cannot be reassigned, but objects/arrays can be mutated**
|
||||
You cannot reassign a `const` variable with a completely new value, but you can still change the properties of an object — or the elements of an array — declared with `const`. [S1]
|
||||
|
||||
> Note (W3Schools): On this page these behaviors are demonstrated through "Try it Yourself" examples (linked to `tryit.asp`) and the comparison table above. The exact full source of the individual "Try it Yourself" boxes is not rendered inline on the page — *Not found in source* (verbatim per-example code beyond the snippets shown here). [S1]
|
||||
|
||||
**Hoisting**
|
||||
Variables declared with `var` are hoisted to the top of their scope and initialized as `undefined`, so they can be referenced before their declaration line. `let` and `const` are also hoisted but *not* initialized, creating a Temporal Dead Zone where accessing them before declaration causes a `ReferenceError`. [S1]
|
||||
|
||||
**Recommendation**
|
||||
Use `const` by default, and only use `let` when you have to reassign the variable after initialization. Avoid using `var`. Modern JavaScript standards recommend avoiding `var` to minimize bugs related to its scoping and redeclaration rules. [S1]
|
||||
|
||||
## 🛠️ 적용 사례 (Applied in summary)
|
||||
The page applies these rules to everyday declarations: choosing `const` for values that never rebind, `let` for counters/accumulators that change, and avoiding `var` entirely. No external project/commit applications found in the source.
|
||||
|
||||
## 💻 코드 패턴 (Code patterns)
|
||||
Block scope of `let` (language: JavaScript):
|
||||
```javascript
|
||||
{
|
||||
let x = 10;
|
||||
}
|
||||
// x is NOT accessible here
|
||||
```
|
||||
|
||||
## ⚖️ 비교 및 선택 기준 (Comparison & decision criteria)
|
||||
- **Scope:** `var` → function/global; `let`/`const` → block `{ }`. Prefer block scope to limit visibility. [S1]
|
||||
- **Reassignment:** `var`/`let` can be updated; `const` cannot. Use `let` only when reassignment is required. [S1]
|
||||
- **Redeclaration:** `var` can be redeclared; `let`/`const` cannot — making accidental redeclaration an early error. [S1]
|
||||
- **Overall default:** `const` first, `let` when you must reassign, avoid `var`. [S1]
|
||||
|
||||
## ⚖️ 모순 및 업데이트 (Contradictions & updates)
|
||||
No contradictions found in the source. The page notes that `let` and `const` (block scope) are ES6 (2015) features, superseding the older `var`-only model.
|
||||
|
||||
## ✅ 검증 상태 및 신뢰도
|
||||
- **상태:** draft
|
||||
- **검증 단계:** conceptual (실제 적용 사례 발견 시 applied/validated로 승격 가능)
|
||||
- **출처 신뢰도:** B (W3Schools — widely used educational reference, not a primary standards body)
|
||||
- **신뢰 점수:** 0.86
|
||||
- **중복 검사 결과:** 신규 생성 (New discovery)
|
||||
|
||||
## 🔗 지식 그래프 (Knowledge Graph)
|
||||
- **상위/루트:** [[JavaScript Tutorial]]
|
||||
- **관련 개념:** [[JavaScript Scope]], [[JavaScript Hoisting]], [[JavaScript Code Blocks]], [[JavaScript Const]]
|
||||
- **참조 맥락:** The reference for choosing a declaration keyword in any JavaScript code.
|
||||
|
||||
## 📚 출처 (Sources)
|
||||
- [S1] W3Schools — JavaScript var let const — https://www.w3schools.com/js/js_varletconst.asp
|
||||
|
||||
## 📝 변경 이력 (Change history)
|
||||
- 2026-06-23: Initial draft synthesized from the W3Schools "JavaScript var let const" page (Astra wiki-curation, P-Reinforce v3.1 format).
|
||||
Reference in New Issue
Block a user