자바스크립트 블록문(Block Statement) 완벽 이해하기 – 문법부터 스코프까지

블록문(block statement)은 중괄호 { }로 묶여 있는 0개 이상의 문(statement)을 하나의 그룹으로 처리하는 구문입니다. 자바스크립트 외의 다른 프로그래밍 언어에서는 이를 흔히 복합문(compound statement)이라고 부릅니다.

블록문 기본 문법

블록문의 기본적인 작성 형식은 다음과 같습니다.

{
    // 실행할 문장 목록
}

var 키워드와 블록 스코프

블록문을 사용할 때 가장 중요하게 기억해야 할 점은, 블록문 자체는 새로운 스코프를 생성하지 않는다는 사실입니다. 따라서 var 키워드로 선언한 변수는 블록 내부에 작성되었더라도 블록 스코프가 아니라 함수 스코프(function scope)를 갖게 됩니다.

var a = 20;
{
    var b = 40;
}
console.log(b); // 40 출력

위 예제에서 변수 b는 블록 안에서 선언되었지만, var는 블록 스코프를 만들지 않기 때문에 블록 바깥에서도 자유롭게 접근할 수 있습니다.

같은 이름의 변수를 블록 안에서 다시 선언하면?

var a = 20;
{
    var a = 40;
}
// 40이 출력됩니다
document.write(a);

두 a는 모두 같은 함수 스코프에 속한 동일한 변수입니다. 따라서 블록 안에서 40으로 재할당한 값이 그대로 유지되어, 출력 결과는 20이 아닌 40이 됩니다.

let과 const: 진짜 블록 스코프

ES6(ECMAScript 2015)에서 도입된 let과 const는 실제로 블록 스코프를 가집니다. 블록 안에서 선언된 변수는 블록이 끝나면 더 이상 접근할 수 없습니다.

{
    let x = 10;
}
// console.log(x); // ReferenceError: x is not defined

정리하면, 블록문은 여러 문을 하나로 묶는 역할만 할 뿐이며, 변수의 유효 범위는 어떤 키워드(var, let, const)로 선언했는지에 따라 결정됩니다. 현대 자바스크립트에서는 예측 가능한 코드를 위해 블록 스코프를 지원하는 let과 const 사용이 권장됩니다.