정의 및 사용 방법
const 선언문(statement)은 글로벌 스코프 또는 블록({}) 스코프를 가지는 변수를 선언합니다.
반드시 초기화해야 하며, 같은 스코프에서는 재선언할 수 없으며, 할당 연산자(=)를 사용한 재할당도 불가능합니다.
- 반드시 초기화해야 함
- 변수 선언 시 반드시 초기화(변수 선언 시 값을 할당하는 것)해야 합니다.
- 재선언 불가
- 같은 스코프 내에서 동일한 식별자로 변수를 다시 선언할 수 없습니다.
- 재할당 불가
- 스코프와 상관없이 접근 가능한 스코프 내에서 동일한 식별자로 할당 연산자(
=)를 사용한 변수의 값을 변경할 수 없습니다. - 하지만, 변수의 값이 객체나 배열처럼 참조를 저장하는 데이터의 경우에는 속성이나 값을 추가, 업데이트 또는 제거할 수 있습니다.
- 호이스팅(Hoisting) 발생
- 선언이 스코프의 최 상단 코드 위치로 끌어올려진 것처럼 동작합니다.
- 단, 변수가 선언된 위치보다 먼저 참조되면 에러를 발생시킵니다.
구문
const name1 = value1;
const name1 = value1, name2 = value2;
const name1 = value1, name2 = value2, /* …, */ nameN = valueN;
nameN- 선언할 변수의 이름입니다. 이 이름은 자바스크립트에서 유효한 식별자이여야 합니다.
valueN- 변수에 할당할 초깃값입니다. 이 값을 지정하지 않으면 에러가 발생합니다.
const의 주요 특징
const로 선언된 변수의 특징에 대해 자세히 살펴보겠습니다.
반드시 초기화해야 함
const로 선언된 변수는 반드시 초기화(변수 선언 시 값을 할당하는 것)해야 합니다. 초깃값을 할당하지 않으면 에러가 발생합니다.
const age = 30;
const age; // Uncaught SyntaxError: Missing initializer in const declaration
const로 선언된 변수에 반드시 초기화해야 한다는 것은 나중에 동일한 식별자로 변수를 다시 선언할 수 없다는 점을 고려할 때 의미가 있습니다.
글로벌 스코프 또는 블록 스코프를 가지는 변수를 선언
- 블록 밖에서
const로 선언된 변수는 코드 전체에서 유효한 글로벌(전역) 스코프를 가집니다. - 블록 내에서
const로 선언된 변수는 해당 블록과 하위 블록 내에서 유효한 블록 스코프를 가집니다.
const로 선언한 변수는 블록 밖에서 선언되었으면 글로벌에서 사용 가능(유효)하고, 블록 내에서 선언되었으면 해당 블록 내에서만 사용 가능(유효)합니다.
여기에서 블록의 의미에 대해 정확히 알고 있어야 const로 선언된 변수의 스코프에 대해 정확히 파악할 수 있습니다.
블록({})의 의미
자바스크립트에서 블록은 중괄호 {}로 둘러싸인 코드 영역을 의미합니다.
다음은 블록의 일반적인 형태들입니다.
if () { // if 블록
// ...
} else { // else 블록
// ...
}
function exampleFn() { // 함수 블록
// ...
}
{ // 임의의 독립적인 블록 (일반적으로 잘 사용되지는 않음)
let temp = 10; // temp는 이 블록 내에서만 유효
}
for () { // for 블록
// ...
}
하지만, 중괄호가 없어도 문법적으로 중괄호가 있어야 하지만 생략된(if 또는 for 문 뒤의 단일 문장) 코드 영역 역시 개념적으로 블록에 해당지만, 실제 블록이 아니기 때문에 const로 변수를 선언할 수 없습니다.
if (true) const a = 10; // Uncaught SyntaxError: Lexical declaration cannot appear in a single-statement context
const로 선언한 변수의 글로벌 스코프 또는 블록 스코프
/* 글로벌(전역) 스코프 */
const globalVar = "글로벌 변수"; // 이 파일(또는 스크립트)의 최상위 블록 전체에서 유효함
function exampleFunction() {
/* 함수 블록 스코프 */
const functionVar = "함수 블록 변수"; // 함수 전체 블록에서 유효함
if (true) {
const innerBlockVar = "if 블록 변수";
console.log(functionVar); // 출력: "함수 블록 변수"
console.log(innerBlockVar); // 출력: "if 블록 변수"
}
// if 블록 스코프 외부이므로 참조 불가
// console.log(innerBlockVar); // ReferenceError (innerBlockVar is not defined)
}
if (true) {
const ifBlockVar = "if 블록 변수";
console.log(ifBlockVar); // 출력: "if 블록 변수"
}
exampleFunction();
console.log(globalVar); // 출력: "글로벌 변수"
// console.log(functionVar); // ReferenceError (functionVar is not defined)
// console.log(ifBlockVar); // ReferenceError (ifBlockVar is not defined)
재선언 불가
const로 선언된 변수는 같은 스코프 내에서 재선언(Redeclaration)이 불가합니다.
같은 스코프 내에서 이미 const로 선언된 변수를 동일한 식별자(변수 이름)로 변수를 다시 선언하면 오류가 발생합니다.
// 같은 스코프 내에서 const 동일한 식별자(변수 이름)로 변수를 다시 선언하면 오류가 발생
const exampleConst = 10;
const exampleConst = 100; // Uncaught SyntaxError: Identifier 'exampleConst' has already been declared
// 서로 다른 스코프 내에서 const 동일한 식별자(변수 이름)로 변수를 다시 선언은 가능
const exampleConst = 10;
console.log(exampleConst); // 출력: 10
if (true) {
const exampleConst = 100;
console.log(exampleConst); // 출력: 100
}
console.log(exampleConst); // 출력: 10
재할당 불가
const로 선언된 변수의 재할당은 변수를 선언한 스코프와 상관없이 접근 가능한 스코프 내에서 동일한 식별자로 할당 연산자(=)를 사용한 변수의 값을 변경할 수 없습니다.
const exampleConst = 10;
/* 동일한 식별자로 할당 연산자(=)를 사용한 변수의 값을 변경할 수 없습니다. */
exampleConst = 100; // Uncaught TypeError: Assignment to constant variable.
하지만, 변수의 값이 객체나 배열처럼 참조를 저장하는 데이터의 경우에는 속성이나 값을 추가, 업데이트 또는 제거할 수 있습니다.
아래의 예제들을 통해 살펴보세요.
객체에 대한 예제
다음은 const로 할당된 일반 객체(Plain object)의 속성·값 추가, 업데이트, 제거에 대한 예제입니다.
// 일반 객체 선언
const person = {
name: 'Alice',
age: 30
};
// 1. 속성 추가
person.city = 'Seoul'; // 새로운 속성 추가
console.log(person); // 출력: { name: 'Alice', age: 30, city: 'Seoul' }
// 2. 속성 업데이트
person.age = 31; // 기존 속성 값 업데이트
console.log(person); // 출력: { name: 'Alice', age: 31, city: 'Seoul' }
// 3. 속성 제거
delete person.city; // 속성 제거
console.log(person); // 출력: { name: 'Alice', age: 31 }
다음은 const로 할당된 Set 객체의 값 추가, 업데이트, 제거에 대한 예제입니다.
// Set 선언
const numberSet = new Set([1, 2, 3]);
// 1. 값 추가
numberSet.add(4); // Set에 새로운 값 추가
console.log(numberSet); // Set { 1, 2, 3, 4 }
// 2. 값 제거
numberSet.delete(2); // Set에서 값 제거
console.log(numberSet); // 출력: Set { 1, 3, 4 }
// 3. 값 존재 여부 확인
console.log(numberSet.has(3)); // 출력: true
console.log(numberSet.has(2)); // 출력: false
다음은 const로 할당된 Map 객체의 속성(키·값) 추가, 업데이트, 제거에 대한 예제입니다.
// Map 객체 선언
const userMap = new Map();
userMap.set('name', 'Alice');
userMap.set('age', 30);
// 1. 키·값 쌍 추가
userMap.set('city', 'Seoul');
console.log(userMap); // 출력: Map { 'name' => 'Alice', 'age' => 30, 'city' => 'Seoul' }
// 2. 키·값 쌍 업데이트
userMap.set('age', 31); // 기존 'age' 키의 값 업데이트
console.log(userMap); // 출력: Map { 'name' => 'Alice', 'age' => 31, 'city' => 'Seoul' }
// 3. 키·값 쌍 제거
userMap.delete('city');
console.log(userMap); // 출력: Map { 'name' => 'Alice', 'age' => 31 }
배열에 대한 예제
다음은 const로 할당된 배열의 요소 추가, 업데이트, 제거에 대한 예제입니다.
// 배열 선언
const numbers = [1, 2, 3];
// 1. 요소 추가
numbers.push(4); // 배열 끝에 요소 추가
console.log(numbers); // 출력: [1, 2, 3, 4]
// 2. 요소 업데이트
numbers[0] = 10; // 첫 번째 요소 값 업데이트
console.log(numbers); // 출력: [10, 2, 3, 4]
// 3. 요소 제거
numbers.pop(); // 배열 끝에서 요소 제거
console.log(numbers); // 출력: [10, 2, 3]
모듈(Module) 환경에서 const
ES6 이후 import나 export 문을 사용하는 모듈 환경(.js 파일을 모듈로 불러오는 경우)에서는 const의 동작 방식에도 중요한 변화가 있습니다.
모듈은 파일을 단위로 독립적인 스코프를 가지기 때문에, 모듈 최상위 스코프에서 const로 선언해도 더 이상 글로벌(전역) 객체[window(브라우저) 또는 global(Node.js)]에 등록되지 않습니다. 모듈 환경에서는 블록 밖에서 선언해도, 전역 객체에는 추가되지 않고 모듈 내부에서만 유효합니다.
- 모듈 내부에서 블록 밖에 선언한
const변수는 모듈 전체에서 접근 가능(유효)하지만, 모듈 외부에서는 접근할 수 없습니다. - 모듈 내부에서 블록 내에 선언된
const변수는 블록 스코프를 유지합니다.
// 모듈 내부에서 const 선언
const globalVar = "모듈 내부 글로벌 변수";
function exampleFunction() {
const functionVar = "함수 내 변수";
console.log(functionVar); // 출력: "함수 내 변수"
}
console.log(globalVar); // 출력: "모듈 내부 글로벌 변수"
// 모듈 외부에서 globalVar 접근 시
// 브라우저: window.globalVar → undefined
// Node.js: global.globalVar → undefined
TDZ(Temporal Dead Zone, 일시적 사각지대)
자바스크립트 인터프리터가 코드를 실행하기 전에 선언한 변수는 실제로 작성된 위치와 상관없이 스코프의 최 상단 코드 위치로 끌어올려진 것처럼 동작합니다. 이러한 동작을 호이스팅(Hoisting, 끌어 올리기)이라고 합니다.
다만, 실제 변수가 선언된 위치보다 먼저 참조되면 자바스크립트 엔진은 호이스팅 된 변수가 존재한다는 것을 체크할 수 있습니다. 이 때문에 변수가 선언되기 전에 접근해도 오류가 나지 않기 때문에 변수의 선언 순서가 엄격하게 적용되어야 하는 const에서는 에러를 발생시킵니다.
이렇게 선언된 변수의 스코프 시작점부터 실제 변수가 선언된 위치를 TDZ(Temporal Dead Zone, 일시적 사각지대)라고 합니다. TDZ는 let이나 const로 선언된 변수에만 적용됩니다.
// TDZ 영역 시작
// ↓
console.log(myVar); // ReferenceError: Cannot access 'myVar' before initialization
// ↑
// TDZ 영역 종료
const myVar = 10;
호환성
| 문 |
데스크탑 Chrome
|
데스크탑데스크탑 Edge
|
데스크탑 Firefox
|
Safari
|
Node.js
|
|---|---|---|---|---|---|
const
|
21 | 12 | 36 | 5.1 | 6 |
명세서
| 명세서 사양 | |
|---|---|
const
|
ECMAScript® 2026 Language Specification #sec-variable-statement |