2nd/10_Wiki/Topics/Domain_Programming/Topic_JavaScript/JavaScript_Hoisting.md

id, title, category, status, verification_status, canonical_id, aliases, duplicate_of, source_trust_level, confidence_score, created_at, updated_at, review_reason, merge_history, tags, raw_sources, applied_in, github_commit

id	title	category	status	verification_status	canonical_id	aliases	duplicate_of	source_trust_level	confidence_score	created_at	updated_at	review_reason	merge_history	tags	raw_sources	applied_in	github_commit
javascript-hoisting	JavaScript Hoisting	Frontend	draft	conceptual		hoisting variable hoisting temporal dead zone declaration hoisting var hoisting		B	0.87	2026-06-23	2026-06-23			javascript js web frontend w3schools hoisting var let const scope	https://www.w3schools.com/js/js_hoisting.asp

JavaScript Hoisting

🎯 한 줄 통찰 (One-line insight)

Hoisting is JavaScript's default behavior of moving all declarations (not initializations) to the top of the current scope — so a var can be used before it is declared, but let/const cannot. [S1]

🧠 핵심 개념 (Core concepts)

• Hoisting moves declarations up — JavaScript moves all declarations to the top of the current scope (the top of the current script or the current function). [S1]
• var is hoisted and usable early — a var variable can be referenced before its declaration line without error. [S1]
• let and const are hoisted but not initialized — using them before declaration throws a ReferenceError because of the "temporal dead zone"; using const before declaration is a syntax error. [S1]
• Only declarations hoist, not initializations — the assignment (= value) stays where it is written, so an early-referenced variable reads as undefined. [S1]
• Best practice — always declare all variables at the beginning of every scope; strict mode does not allow undeclared variables. [S1]

🧩 추출된 패턴 (Extracted patterns)

• Declare at the top of scope — to avoid hoisting-related bugs, put all declarations first. [S1]
• Never rely on let/const before declaration — they live in the temporal dead zone until their declaration line runs. [S1]
• Remember: declaration ≠ initialization — an early read returns undefined, not the assigned value. [S1]

📖 세부 내용 (Details)

What is Hoisting? Hoisting is JavaScript's default behavior of moving all declarations to the top of the current scope (to the top of the current script or the current function). [S1]

var Declarations are Hoisted A variable can be used before it has been declared. The following example gives the same result as declaring x first: [S1]

x = 5; // Assign 5 to x

elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x;                     // Display x in the element

var x; // Declare x

This is equivalent to: [S1]

var x; // Declare x
x = 5; // Assign 5 to x

elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x;                     // Display x in the element

let and const Hoisting Variables defined with let and const are hoisted to the top of the block, but they are not initialized. Using a let variable before it is declared results in a ReferenceError: [S1]

carName = "Volvo";
let carName;

Using a const variable before it is declared is a syntax error, so the code will not run: [S1]

carName = "Volvo";
const carName;

JavaScript Initializations are Not Hoisted JavaScript hoists declarations, not initializations. Because only the declaration of y is hoisted (and not its assignment), y is undefined when it is first used: [S1]

var x = 5; // Initialize x

elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x + " " + y;           // Display x and y

var y = 7; // Initialize y

Declare Your Variables At the Top To avoid bugs, always declare all variables at the beginning of every scope. Since this is how JavaScript interprets the code, it is a good rule. JavaScript in strict mode does not allow variables to be used if they are not declared. [S1]

🛠️ 적용 사례 (Applied in summary)

The page's examples are the applied cases: showing var x usable before its declaration line, the let/const ReferenceError/syntax-error cases, and the y value reading as undefined because its initialization did not hoist. No external project/commit applications found in the source.

💻 코드 패턴 (Code patterns)

var is hoisted (usable before declaration) (language: JavaScript):

x = 5;
var x; // Declaration hoisted to top of scope

let before declaration throws:

carName = "Volvo";
let carName; // ReferenceError

Initialization is not hoisted (reads undefined):

elem.innerHTML = x + " " + y; // y is undefined here
var y = 7;

⚖️ 모순 및 업데이트 (Contradictions & updates)

No contradictions found in the source.

✅ 검증 상태 및 신뢰도

• 상태: draft
• 검증 단계: conceptual (실제 적용 사례 발견 시 applied/validated로 승격 가능)
• 출처 신뢰도: B (W3Schools — widely used educational reference, not a primary standards body)
• 신뢰 점수: 0.87
• 중복 검사 결과: 신규 생성 (New discovery)

🔗 지식 그래프 (Knowledge Graph)

• 상위/루트: JavaScript Tutorial
• 관련 개념: JavaScript var let const, JavaScript Scope, JavaScript Strict Mode, JavaScript Code Blocks
• 참조 맥락: Explains why variable order matters and motivates declaring variables at the top of each scope.

📚 출처 (Sources)

• [S1] W3Schools — JavaScript Hoisting — https://www.w3schools.com/js/js_hoisting.asp

📝 변경 이력 (Change history)

• 2026-06-23: Initial draft synthesized from the W3Schools "JavaScript Hoisting" page (Astra wiki-curation, P-Reinforce v3.1 format).