JS var, const, let의 차이

const, let, var

셋 모두 자바스크립트에서 변수선언시 사용하는 키워드

1️⃣ Scope 관점에서의 차이

• var : function scope 즉 함수 밖에서 선언된 변수는 무조건 전역변수가 된다.

  if문, for문에서 var로 선언한 변수를 밖에서 접근 가능함

• const, let : block scope {} 단위로 변수의 범위가 제한된다.

2️⃣ 변수선언문 이전 참조 가능성의 차이

• var : 변수선언문 이전에 변수를 참조하는 것이 가능하다.
• const, let : 불가능하다.

자세한 설명은 여기

3️⃣ 재선언에서의 차이

• var : 재선언 가능

  아래의 코드가 아무 문제 없이 작동한다
  같은 이름의 변수를 여러 번 재선언 하는 것이 가능하다.

  var a = 1;
  console.log(a); //1
  var a = 2
  console.log(b); //2

• const, let : 재선언 불가

  • const : 재할당 불가능

    const에 배열, 객체를 할당한 다음 그 안의 내용을 바꾸는 것은 가능하다

  • let : 재할당 가능

    값을 재선언하는 것은 안되지만 할당된 값을 바꾸는 것은 가능함

🤷🏻‍♀️ 왜 var 안쓰고 const, let 쓰라고 해요?

var가 가지는 문제점 세 가지

• 변수의 재선언이 가능해 코드 양이 많아질 경우 관리가 어렵다.
• function scope이기 때문에 함수 내의 변수를 제외한 모든 변수가 전역변수가 된다.
  기본적으로 변수의 스코프는 최대한 좁게 만드는 것을 권장하기 때문에, var보다는 let과 const를 쓰는 것이 바람직하다.
• 변수 선언 이전에 변수를 참조할 시에 에러가 아닌 undefined를 반환한다.

👀 그럼 대체 뭘 써야 할까요

일단 var은 버린다.

기본적으로 const를 사용하고, 재할당이 필요한 경우(예: for문)에 한정해 let을 사용한다. 이때 변수의 스코프는 최대한 좁게 만든다.

const 는 의도치않은 재할당을 방지할 수 있다는 장점을 가지기 때문이다.

References
let, var, const의 차이점과 호이스팅 (Hoisting)에 대해 설명해주세요.
var, let, const 차이점