변수와 호이스팅 — var, let, const가 실제로 동작하는 방식

function example() {
  if (true) {
    var x = 10;
  }
  console.log(x); // 10 — if 블록 밖에서도 접근 가능
}

example();

console.log(a); // undefined — 에러가 아님
var a = 5;
console.log(a); // 5

// 실행 컨텍스트 생성 단계
var a = undefined; // 선언 + 초기화

// 실행 단계
console.log(a);    // undefined
a = 5;             // 할당
console.log(a);    // 5

var x = 1;
var x = 2; // 에러 없음
console.log(x); // 2

function example() {
  if (true) {
    let y = 20;
  }
  console.log(y); // ReferenceError — 블록 밖에서 접근 불가
}

{
  // TDZ 시작 — 스코프 진입 시점
  console.log(b); // ReferenceError
  let b = 10;     // TDZ 끝 — 여기서 초기화
  console.log(b); // 10
}

// 시간적으로 뒤에 있지만 실행 순서상 TDZ를 벗어남
function check() {
  console.log(value); // 정상 동작 — 함수 호출 시점에는 TDZ를 지남
}

let value = 42;
check(); // 42

let x = 1;
let x = 2; // SyntaxError: Identifier 'x' has already been declared

const PI = 3.14159;
PI = 3.14; // TypeError: Assignment to constant variable

const user = { name: 'Alice', age: 25 };

// 프로퍼티 변경 — 가능
user.name = 'Bob';
console.log(user.name); // 'Bob'

// 재할당 — 불가능
user = { name: 'Charlie' }; // TypeError

const arr = [1, 2, 3];

// 배열 요소 변경 — 가능
arr.push(4);
console.log(arr); // [1, 2, 3, 4]

// 재할당 — 불가능
arr = [5, 6]; // TypeError

const frozen = Object.freeze({ name: 'Alice', age: 25 });
frozen.name = 'Bob'; // 무시됨 (strict mode에서는 TypeError)
console.log(frozen.name); // 'Alice'

const config = Object.freeze({
  db: { host: 'localhost', port: 3306 }
});

config.db.port = 5432; // 변경됨!
console.log(config.db.port); // 5432

// 함수 선언문 — 선언 전에 호출 가능
greet(); // 'hello'
function greet() {
  console.log('hello');
}

// 함수 표현식 — var이므로 undefined
sayHi(); // TypeError: sayHi is not a function
var sayHi = function () {
  console.log('hi');
};

// let으로 함수 표현식 — TDZ 적용
run(); // ReferenceError
let run = () => console.log('running');

// var 사용 — 의도와 다른 결과
for (var i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 100);
}
// 출력: 3, 3, 3

// let 사용 — 의도대로 동작
for (let i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 100);
}
// 출력: 0, 1, 2

// var + IIFE로 해결하는 고전적 방법
for (var i = 0; i < 3; i++) {
  (function (j) {
    setTimeout(() => console.log(j), 100);
  })(i);
}
// 출력: 0, 1, 2

var globalVar = 'hello';
let globalLet = 'world';

console.log(window.globalVar); // 'hello'
console.log(window.globalLet); // undefined

// 기본: const를 사용
const API_URL = 'https://api.example.com';
const config = { timeout: 3000 };

// 재할당이 필요한 경우만: let
let count = 0;
count += 1;

// var: 사용하지 않는다
// 레거시 코드 유지보수 시에만 만남

const x = 'global';
{
  console.log(x); // ReferenceError — 블록 내 let x가 호이스팅됨
  let x = 'local';
}