JAVASCRIPT var, let
var이란?
▶ var은 JavaScript에서 변수를 선언할 때 사용되는 키워드 중 하나입니다.
var 키워드로 변수를 선언하면 해당 변수는 함수 스코프를 가지게 되는데, 이 때 var로 선언된 변수는 호이스팅(Hoisting)이 발생합니다. 호이스팅은 JavaScript에서 변수 및 함수 선언이 해당 스코프의 맨 위로 끌어올려지는 현상을 말하며 즉, 변수 선언이 코드의 어느 위치에서든지 해당 스코프의 맨 위로 끌어올려지므로 변수를 선언하기 전에도 참조할 수 있게 됩니다. 다만, 할당은 그 위치에 따라 결정됩니다. (호이스팅은 다음시간에 자세히 다뤄보도록 하겠습니다!)
1
2
3
4
5
6
7
function example() {
var x = 10;
console.log(x); // 10
}
example();
console.log(x); // 에러: x는 정의되지 않았습니다.
▶ 위의 예시는 x라는 함수 example 안에서 변수 선언을 했기 때문에 함수 외부에서는 접근할 수 없지만 함수 내부에서는 정상적으로 사용할 수 있습니다.
함수 스코프란?
▶ 그렇다면 위의 var에 대한 설명에서 언급한 ‘함수 스코프’란 무엇일까요?
함수 스코프를 가지게 된다는 것은 변수가 선언된 함수 내에서만 유효하다는 것을 의미합니다. 다시 말해, 변수를 선언한 함수의 중괄호 {} 안에서만 해당 변수에 접근할 수 있고, 함수 외부에서는 그 변수에 접근할 수 없다는 것을 말하죠.
1
2
3
4
5
6
7
function example() {
var x = 10;
console.log(x); // 10
}
example(); // 함수 내부에서는 x에 접근 가능
console.log(x); // 에러: x는 정의되지 않았습니다.
▶ 예를 들어, 위의 예시에서 var 키워드로 변수 x를 함수 내에서 선언하면 x 변수는 함수 example 내에서만 유효합니다.
그 말은, console.log(x)를 함수 외부에서 실행하면 오류가 발생한다는 의미도 되는데 이유는 x가 함수 example 내에서만 정의되었기 때문입니다.
let이란?
▶ let은 변수를 선언할 때 사용되는 키워드 중 하나로, 블록 스코프를 가지게 됩니다. 블록 스코프를 가진다는 건 변수가 선언된 블록({}) 내에서만 유효하며, 블록 외부에서는 접근할 수 없다는 의미입니다. 또한, let으로 선언된 변수는 호이스팅(Hoisting)이 발생하지만 초기화되기 전까지 “일시적 사각지대(Temporal Dead Zone)”에 머무릅니다.
1
2
3
4
5
6
7
function example() {
let x = 10;
console.log(x); // 10
}
example(); // 함수 내부에서는 x에 접근 가능
console.log(x); // 에러: x는 정의되지 않았습니다.
▶ 위의 예시는 x라는 함수 example 안에서 변수 선언을 했기 때문에 함수 외부에서는 접근할 수 없지만 함수 내부에서는 정상적으로 사용할 수 있습니다.
일시적 사각지대(Temporal Dead Zone)란?
▶ 그렇다면 위의 let에 대한 설명에서 언급한 ‘일시적 사각지대’란 무엇일까요?
일시적 사각지대(Temporal Dead Zone)는 let이나 const로 변수를 선언한 후, 해당 변수를 선언하기 전에 접근하려고 할 때 발생하는 현상으로 즉, 변수가 선언된 위치까지만 호이스팅되고 초기화되지 않은 상태에서 접근하려고 할 때 발생하는 것을 말합니다.
1
2
console.log(x); // 에러: Cannot access 'x' before initialization
let x = 10;
▶ 위의 예시처럼 만약 console.log(x)를 let으로 변수를 선언하기 전에 호출하면 “Cannot access ‘x’ before initialization”과 같은 에러가 발생하게 됩니다.
이는 변수 x가 호이스팅되었지만 초기화되지 않은 상태이기 때문에 해당 변수에 접근할 수 없다는 것을 의미하고, 따라서 초기화되기 전까지 변수에 접근하는 것은 허용되지 않습니다.
이렇게 오늘은 var와 let에 대해 알아봤는데요,
면접을 준비할 때 나올 수 있는 질문인만큼 미리미리 숙지해서 알아두면 좋겠죠?
그럼 다음엔 또 다른 면접 정보들을 가져와보도록 하겠습니다 😁!