var, let, const는 어떤 것이며 무엇이 다르고 왜 나왔을까?

Javascript의 가장 기본적인 개념인 var, let, const에 대해 쓰려고 여러 번 시도했는데 개념들이 서로 다 연결되어 있어서 개념 하나하나 다 설명하려고 하니 엄두가 안 나서 못 하고 있다가 적은 부분부터 이해하고 설명하기 시작해야 시작을 할 수 있을 것 같아서 제가 알고 있는 것과 알고 싶은 것들만 모아서 썼으니 더 자세한 정보를 원하신다면 가장 하단의 블로그와 생활코딩의 강의를 참고해주신다면 많은 도움이 되실 것 같습니다!

 

# 알고 가시면 좋은 것

1. Javascript가 변수를 어디서 어떤 순서로 찾는지?!

1. Local
2. Script
3. Global

 

2. 재선언과 재할당은 어떻게 다른 것일까?!

1. 재선언
   - 말그대로 선언을 다시 하는 것
   

   var a = 3;
   var a = 4;
   console.log(a); # 값은 4

2. 재할당
   - 이미 선언된 변수에 값만 다시 할당하는 것
   

   var a = 1;
   a = 2;
   console.log(a); # a의 값은 2​

 

# var를 잘 쓰고 있었는데 어떤 불편함이 있었길래 let과 const가 나왔을까?!

1. var는 함수 레벨 스코프여서 함수 밖에서 쓰일 때는 전역 변수로 인식된다.

• 전역 변수는 Global Scope에 변수가 저장되는데 Global Scope에는 built-in 된 변수들을 건드릴 수 있고 저장되어 있는 값들이 많아서 찾기도 쉽지 않다.

2. 재선언이 가능해서 원하지 않던 값이 나올 수 있다.

• 프로그램의 완성도를 높이려면 계획했던 대로 진행되어야 한다. 그런데 변하면 안 되는 변수였는데 재선언이 가능해서 값이 변하게 된다면 계획했던 것과 다른 결과가 나올 가능성이 크다. 그러므로 이런 실수를 줄이고자 재선언이 불가능한 const를 도입했다고 생각한다.

3. 변수 선언 이전에 호출할 경우 undefined를 리턴한다.

• 번수를 선언하지 않았는데 호출한다는 것은 중간 과정에서 무언가 빠져있다는 것을 의미하는데 undefiend를 리턴한다면 어느 부분에서 실수가 있었는지 알기 어렵다. 그러므로 이런 경우에 에러메세지를 리턴하고 이를 알고 수정하면서 프로그램의 완성도를 높일 수 있다. 

 

결국 var를 사용할 경우 생길 수 있는 에러들을 줄이고자 만든 것이 let과 const라고 생각하면 되겠습니다.

그리고 우리도 let과 const를 만든 의도를 생각하면서 스코프를 좁게 만들면 보다 완성도를 높일 수 있다고 생각합니다.

 

*block 레벨 - 함수, if, for, while, try/catch 문 등)

	var	let	const
global scope	yes	no	no
script scope	no	yes	yes
function local scope	yes	yes	yes
block scope	no	yes	yes
재선언	yes	no	no
재할당	yes	yes	no

 

호이스팅에 대한 개념도 함께 알아야 하지만 아직 이해가 부족하여 이에 대해서는 다음에 다시 쓰고자 합니다.

 

 

<참고 자료>

https://www.howdy-mj.me/javascript/var-let-const/

var, let, const의 차이 ⏤ 변수 선언 및 할당, 호이스팅, 스코프

https://www.youtube.com/watch?v=61iolhWgQt0&t=563s