변수는 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 실별하기 위해 붙인 이름을 말합니다.
간단히 말하자면 변수는 프로그래밍 언어에서 값을 저장하고 참조하는 메커니즘으로 값의 위치를 가리키는 상징적인 이름입니다.
ES6 이전에는 변수를 선언할 때 var라는 키워드를 사용해 선언을 하였지만 var의 문제점이 있어서 ES6에 let과 const 키워드가 나왔습니다.
var의 문제점? 그건 바로 호이스팅이 일어나는 것과 전역객체의 프로퍼티로 들어간다는 것입니다. 일단 var 같은 경우 함수 레벨 스코프를 따르기 때문에 전역에 선언하면 애플리케이션이 종료가 될 때 까지 살아있게 됩니다.
살아있는게 뭐가 문제 일까? 일단 메모리의 누수 발생합니다. 쓸대없는 메모리 공간을 차지 하기 때문입니다.
그리고 var를 사용하면 변수 호이스팅이 일어납니다.
호이스팅이 무엇일까? 일단 실행컨텍스트를 배우면 호이스팅이 일어나는지 알 수 있다.
일단 코드의 실행 순서를 이해해 보자
런타임 이전에 식별자들이 선언부터 한다. 함수 선언과 var로 선언한 식별자들이 런타임 이전에 일어난다. var 같은 경우 선언과 동시에 초기화가 이루어 진다.
var a = 1;
/*
var a; <- undefind
a = 1;
*/만약 변수의 할당 전에 참조를 한다면 다른 언어 같으면 에러를 발생 시키지만
우리의 자바스크립트는 그렇지 않다!!
console.log(a); // error? no no -> undefined
var a = 1;에러가 안난다고 좋은건가? 그건 아니다 일단 이 호이스팅을 모르면 개발자의 의도 되로 코딩이 안되고 에러가 발생하지 않아서 어디서 에러가 발생하였는지 모르기 때문에 상당히 안 좋다.
그래서 ES6에 나온게 let과 const 키워드이다.
이 두 키워드는 선언과 초기화가 따로 진행되고 초기화 이전에 일시적 사각지대
TMZ가 발생해서 선언 전에 참조가 불가능 하고 에러가 발생한다.
let과 const는 호이스팅이 일어나지 않는다? 이건 아니다 호이스팅이 일어나지 않은 것 처럼 보이는 것이다.
let a = 20;
{
console.log(a); // 20? no! Reference Error 발생
let a = 30;
}
나중에 스코프에서 배우기 때문에 a가 상위 스코프에서 찾게 되는 생각이 들겠지만 사실 { 이거와 let a 사이의 일시적 사각지대에 들어가게 되어서 에러가 발생한다.
즉 무조건은 아니지만 let과 const를 이용하는 것이 나는 좋다고 생각이든다.
