js 에서 var 과 let 의 차이

JavaScript에서 'var'과 'let'은 변수를 선언하는 데 사용되는 두 가지 키워드입니다. 그러나 이 둘은 몇 가지 중요한 차이점이 있습니다.

1. 유효 범위 (Scope):
   • 'var': 'var'로 선언된 변수는 함수 또는 전역 범위에서 유효합니다. 함수 범위를 가지므로 블록(예: if문, for문) 내에서 선언되더라도 함수의 어디에서든 접근할 수 있습니다. 단, 블록 내에서 선언된 'var' 변수는 호이스팅(Hoisting)에 의해 블록 이전에 선언된 것으로 처리됩니다.
   • 'let': 'let'으로 선언된 변수는 블록 범위를 가집니다. 함수 내부나 '{}' 중괄호로 둘러싸인 블록 내에서만 유효하며, 블록 내에서 선언된 'let' 변수는 호이스팅되지 않습니다.
2. 호이스팅 (Hoisting):
   • 'var': 'var'로 선언된 변수는 선언 단계가 호이스팅되며, 변수 선언 전에도 참조할 수 있습니다. 다만, 초기화(값 할당) 단계는 해당 변수가 속한 블록에서 실행되기 전까지 진행되지 않습니다. 즉, 선언은 호이스팅되지만, 값을 할당하기 전까지 변수에는 'undefined'가 할당됩니다.
   • 'let': 'let'으로 선언된 변수는 호이스팅이 발생하지만, 선언과 초기화가 분리되어 진행됩니다. 따라서 선언 전에 해당 변수를 참조하면 'ReferenceError'가 발생합니다.
3. 재선언 가능성:
   • 'var': 같은 이름의 'var' 변수를 여러 번 선언해도 오류가 발생하지 않고, 이전에 선언한 변수가 덮어씌워집니다.
   • 'let': 같은 이름의 'let' 변수를 동일한 범위에서 중복해서 선언하면 문법 오류(SyntaxError)가 발생합니다.
4. 전역 객체와 관련:
   • 'var': 'var'로 선언된 전역 변수는 전역 객체(window 객체)의 프로퍼티로서 접근할 수 있습니다.
   • 'let': 'let'으로 선언된 전역 변수는 전역 객체의 프로퍼티로서 접근할 수 없습니다. 이는 브라우저 환경에서는 'window' 객체가 전역 범위를 나타내지만, 'let'으로 선언된 변수는 'window' 객체의 프로퍼티가 아니기 때문입니다.

일반적으로 ES6 이후의 JavaScript에서는 'var'보다는 'let'을 우선적으로 사용하는 것이 권장됩니다. 'let'은 블록 범위로 인해 유연하고 안전한 코드를 작성할 수 있도록 도와주기 때문입니다. 'let'과 'const'(상수)는 블록 범위를 가지며, 'var'보다 더욱 예측 가능하고 실수를 줄이는 데 도움이 됩니다.