var, let, const?

const, let, var은 javascript에서 변수/상수를 저장하는 방식이다.

변수: 값을 저장할 목적으로 사용하며 이후에 변경될 수 있는 값

상수: 값을 저장할 목적으로 사용하며 이후에 변경할 수 없는 값

ECMAScript6의 등장 이전엔 var로 변수를 선언했다. 그러나 var로 선언한 변수는 중복해서 선언할 수 있고 마지막에 할당된 값을 저장한다.

간단한 코드로 예시를 들어보자.

var num = 10;

if (num == 10) {
	var num = 20;
	console.log("num in if : ", num); // num in if : 20
}

console.log(num); // 20

이러한 경우 if문 밖에서도 변수에 접근이 가능해져 코드를 분석하는데 어려움이 생긴다.

당연히 프로젝트의 규모가 커질수록 개발자는 더욱 헷갈리게 된다. 이를 보완하기 위해 나온 것이 let과 const이다.

위의 예시를 let으로 변경해보자.

let num = 10;

if (num == 10) {
	let num = 20;
	console.log("num in if : ", num); // num in if : 20
}

console.log(num); // 10

if문 안에서 선언된 num에 if문 밖에서는 접근할 수 없다. 이때 scope를 벗어난다고 하는데 scope는 변수의 접근을 결정하는 변수의 범위를 뜻한다.

let

let은 변수 생성 키워드로 변수의 재선언이 불가하나 재할당은 가능하다.
변수명을 헷갈려서 재선언하는 것을 방지하면서도 값을 재할당하고 싶을 때 사용한다.

const

const는 상수 생성 키워드로 변수의 재선언, 재할당 모두 불가능하다.

프로그램을 더 읽기 쉽고 빠르고 안정적으로 만들기 위해 사용된다. 프로그램에서 해당 변수의 값을 다시 바꾸지 않을 예정일 때 사용한다.

const와 let의 사용이 헷갈린다면 일단 const로 선언한 뒤, 이후에 값을 재할당하고 싶을 때 let으로 교체하는 것을 추천한다.

호이스팅이란?
변수 선언은 코드가 실행되기 전에 처리되기 때문에 코드 중 어느 위치에 작성해도 코드 최상위에 선언한 것과 동일하다. 이렇게 변수 선언이 함수 또는 전역 코드 최상위로 이동하는 것을 호이스팅이라고 한다.

다만 호이스팅은 실제로 코드가 최상위로 이동되는 것은 아니고 자바스크립트 parser가 내부적으로 끌어올려 처리하는 것이다.

참조

MDN