😣 var를 지양하자
자바스크립트를 공부하기 전에 var을 쓰는 책, 영상은 읽지도 말고 보지도 말라는 이야기를 많이 들었다.
그 이유가 뭘까??
JavaScript는 var/let/const 세 가지로 변수 선언이 가능하다.
var??
반복 선언, 재할당, 함수 스코프
let??
재할당, 블록스코프
const??
재할당x => 선언 + 할당 동시, 블록 스코프
🙄 왜?? var를 지양하라고 하는걸까?? 알아보자!!
👉 반복 선언 + 함수 스코프
위 예시를 봤을 때 var의 특징을 모르는 사람들은 14번째 콘솔에서는 "지역" 17번째 콘솔에서는 "전역"이라는 출력 값을 예상 할 것이다.
하지만 두 출력 값 모두 "지역"을 출력하고 그 이유는 바로 var는 함수 스코프이기 때문이다. if문은 함수가 아닌 블록이므로 함수 스코프의 특성을 갖는 var는 영향을 받지 않게 된다.
let의 예시를 보자. let은 블록 스코프이고 if문에서 블록을 가지기 때문에 29번째 콘솔에서는 "지역" 31번째 콘솔에서는 "전역"을 출력한다.
이러한 함수 스코프의 특징을 갖는 var의 특징 때문에 var 사용을 지양해야 한다.
🕵 한 가지 더 신비로운(?) 예시
선언도 아직 하지 않았는데 name의 출력이 error가 아닌 undefined로 나온다.
그 이유는 var 변수 선언시에 hoisting이 발생하기 때문이다.
Hoisting이란??
함수 안에 있는 선언들을 모두 끌어올려서 해당 함수 유효 범위의 최상단에 선언하는 것
🤦 var 변수 선언, 함수 선언에서 발생 🤦
실제로는 위와 같은 상황이라고 생각하면 이해가 쉽다.
🙆 결론
예시로 보여준 코드들은 너무 간단하기 때문에 이게 뭐 어때?? 그냥 이해하고 쓰면 되는데
나는 var 그냥 쓸래~~ 라고 생각할 수 있지만, 코드가 만 줄, 십만 줄, 또 팀원들과 협업을 하고 있는 상황이라고 생각한다면 벌써부터 머리가 아프지 않은가??
var를 지양하고 let과 const를 쓰도록 하자!!
하지만 let말고 const를 쓰는걸 권장하는데 여기에 대한 이유도 스스로 잘 정리한 다음 글로 옮겨보도록 하겠다!!
Clean한 코드를 위해서 열심히 알아가보자!
👨🏫 추가로 알게 된 점
let, const는 호이스팅이 발생하지 않는다???
🙅 NO!!
let, const 또한 발생하지 않는 것처럼 보일 뿐 호이스팅이 일어난다!
다만 var 키워드의 경우 선언과 초기화가 동시에 일어나는 반면
let, const는 선언이 일어난 후 해당 코드가 실행되기 전까지는 초기화가 되지 않아 일시적 사각지대에 빠져 호이스팅이 일어나지 않는 것처럼 보이는 것 뿐!!
👩🏫 결론은 const 쓰자!!
