var와 let의 차이

var와 let은 모두 JavaScript에서 변수를 선언하는 키워드이다.
그러나 둘 사이에는 스코프(scope)와 호이스팅(hoisting) 등에서 차이점이 있다.

1. 스코프(Scope):

• var: 함수(function)-scoped 변수
  var로 선언된 변수의 스코프가 해당 변수를 포함하는 가장 가까운 함수로 제한됨.

• let: 블록(block)-scoped 변수
  let으로 선언된 변수의 스코프가 해당 변수를 포함하는 가장 가까운 블록(중괄호 {})으로 제한됨.

2. 호이스팅(Hoisting):

• var: 선언된 변수가 함수 또는 전역 스코프의 맨 위로 끌어올려지는 호이스팅 발생.
  선언 전에 참조하면 undefined가 반환됨.

console.log(abc); // undefined
var abc = 5;
console.log(abc); // 5

• let: 호이스팅 발생하지만, 변수에 접근하기 전에 초기화 돼있어야함.
  변수 선언 전에 참조하려고 하면 "Temporal Dead Zone"에 들어가게 되어 ReferenceError 발생.

console.log(def); // ReferenceError: def is not defined
let def = 5;
console.log(def); // 5

3. 전역 객체에 바인딩(Global Object Binding):

• var: 선언된 변수가 전역 스코프에서 전역 객체(window 또는 global 객체)에 바인딩 됨.
• let: 전역 스코프에서 전역 객체에 바인딩되지 않음.

4. 재선언(Re-declaration) :

• var: 같은 스코프 내에서 동일한 이름의 변수를 여러 번 선언할 수 있음.
  다음에 선언된 값으로 업데이트되어 변수가 덮어씌워짐.
• let: 같은 스코프 내에서 동일한 이름의 변수를 다시 선언하려고 하면 SyntaxError가 발생.

결론

let은 변수 선언 시 스코프 관리와 잠재적 오류를 효과적으로 방지할 수 있어 현대 JavaScript에서 권장됨.
var은 이전 버전의 JavaScript 코드와의 호환성 등으로 인해 사용되지만, 가능하면 let을 사용하는 것이 좋으며, 상수인 경우에는 const를 사용하는 것이 좋음.