함께 읽으면 좋은 글(Hoisting)
함께 읽으면 좋은 글(Scope)
변수 선언시 const 키워드를 사용하면
의도치 않은 재할당을 방지할 수있다.
따라서 메모리를 아끼면서 안전하게 개발하기위해
변수 선언에는 기본적으로 const를 사용하고,
let은 재할당이 필요한 경우에 사용하는 것이 좋다.
1. var은 버리자!
ES6를 사용한다면 var 키워드는 사용하지 말아야한다.
var 키워드는 값을 재할당 할 때 마다
새로운 메모리 공간을 확보하여 값을 할당하기 때문에
기존에 var 키워드로 할당한 메모리 공간은
사용하지도 않는데 자리만 차지하는 쓰레기 공간이 되어버린다.
이는 가비지 콜렉터에 의해서 메모리에서 자동해제 되긴하지만
애초에 사용하지 않는 것이 좋다.
이외에도 호이스팅, 중복 선언을 허용하는 등 부작용을 일으키는 요소가 많다!
2. 스코프 개념에서의 var, let, const
var - 함수 레벨 스코프
var 키워드로 선언한 변수는 오로지 함수의 코드 블록만을 지역 스코프로 인정한다.
따라서 함수 외부에서 var 키워드로 선언한 변수는 코드 블록 내에서 선언해도 모두 전역 변수가 된다.
var x = 1;
if (true) {
// x는 전역변수다. 이미 선언된 전역 변수 x가 있으므로 x 변수는 중복 선언된다.
// 이는 의도치 않게 변수값이 변경되는 부작용을 발생시킨다.
var x = 10;
}
console.log(x); // 10for 문의 변수 선언문에서 var 키워드로 선언한 변수도 전역 변수가 된다.
var i = 10;
// for문에서 선언한 i는 전역 변수다. 이미 선언된 전역 변수 i가 있으므로 중복 선언된다.
for (var i = 0; i < 5; i++) {
console.log(i); // 0 1 2 3 4
}
// 의도치 않게 i 변수의 값이 변경되었다.
console.log(i); // 5함수 레벨 스코프는 전역 변수를 남발할 가능성을 높이기에
의도치 않게 전역 변수가 중복 선언되는 경우가 발생한다.
let - 블록 레벨 스코프
var 키워드로 선언한 변수는 오로지 함수의 코드 블록만을
지역 스코프로 인정하는 함수 레벨 스코프를 따른다.
하지만 let 키워드로 선언한 변수는 모든 코드블록(함수, if문, for문, while문, try/catch문 등)을
지역 스코프로 인정하는 블록 레벨 스코프를 따른다.
let foo = 1; // 전역 변수
{
let foo = 2; // 지역 변수
let bar = 3; // 지역 변수
}
console.log(foo); // 1
console.log(bar); // ReferenceError: bar is not defined위 문의 코드 블록 내에 선언된 foo 변수와 bar 변수는 지역 변수다.
전역에서 선언된 foo 변수와 코드 블록 내에서 선언된 foo 변수는 다른 변수이다.
또한 bar변수도 블록 레벨 스코프를 갖는 지역 변수다.
따라서 전역에서는 bar 변수를 참조할 수 없다.
함수도 코드 블록이므로 스코프를 만든다.
이때 함수 내의 코드 블록은 함수 레벨 스코프에 중첩된다.
const - 블록 레벨 스코프
const 키워드로 선언한 변수는 let 키워드로 선언한 변수와 마찬가지로 블록 레벨 스코프를 가지며,
변수 호이스팅이 발생하지 않는 것처럼 동작한다.
{
// 변수 호이스팅이 발생하지 않는 것처럼 동작한다.
console.log(foo); // ReferenceError: Cannot access 'foo' before initialization
const foo = 1;
console.log(foo); // 1
}
// 블록 레벨 스코프를 갖는다.
console.log(foo); // ReferenceError: foo is not defined참조 - 이웅모, 『모던 자바스크립트 Deep Dive 』, 위키북스(2020), p.208 ~ p.218.
