3월 기술면접대비 - var, let, const

 

 

 

JavaScript의 시작과 꽃(?)이 아닐까...?

열심히 외웠는데 항상 다시 초기화된다. 이제는 어느정도 개념이 머릿속에 박혀있지만 여전히 말로 풀어내는 게 되질 않아서 최대한 말로 하는 연습을 하기 시작했다.

 

외우라고 좀.. 아직도 못해 왜

 

var let const 차이점 간단 포인트 !

 

변수 선언, 초기화, 할당

var: 중복 선언, 재할당 모두 가능
ex) var a= 1; var a= 2; 가능
let:중복 선언 불가 재할당 가능
ex) let a= 1 ; a=2; 가능
const:중복 선언, 재할당 모두 불가능

 

스코프

var : 함수 레벨 스코프

let, const : 블록 레벨 스코프

 

 

var는 유연한 변수 선언이 가능하기 때문에 간단한 테스트에는 편리 할 수 있지만, 코드량이 많아 진다면 어디서 사용되고 있는지 파악하기도 힘들고 중복 선언과 재할당이 가능해서 값이 바뀔 우려가 있기 때문에 변수 선언 방식에서 큰 단점을 가집니다.

var변수가 함수 외부에서 선언될 때의 범위는 전역입니다. 즉, 함수 블록 외부에서 var를 사용하여 선언된 모든 변수를 전체 윈도우 상에서 사용할 수 있는 것입니다.
var가 함수 내에서 선언될 때는 함수 범위로 지정됩니다. 즉, 해당 함수 내에서만 사용하고 접근할 수 있습니다.



자바스크립트의 모든 선언에는 호이스팅이 일어납니다.

* 호이스팅이란?

변수 선언문이나 함수 선언문 등이 해당 스코프의 선두로 옮겨진 것처럼 동작하는 특성

( 조금 더 자세한 설명은 https://puringles.tistory.com/744 참고 )

하지만 var 키워드로 선언된 변수와는 달리 let 키워드로 선언된 변수를 선언문 이전에 참조하면 참조 에러(ReferenceError)가 발생합니다.

왜 let 키워드를 이용한 선언문은 호이스팅이 발생하지 않는 것처럼 동작할까?
이는 let 키워드로 선언된 변수는 스코프의 시작에서 변수의 선언까지 *일시적 사각지대(Temporal Dead Zone; TDZ)에 빠지기 때문입니다.

*TDZ란?

일시적으로 변수 값을 참조할 수 없는 구간

선언문 이전에 참조해서 에러를 발생시킨다고 호이스팅이 일어나지 않은 것은 아닙니다.
왜냐하면 정말 선언이 코드 실행 전에 메모리에 저장된 것은 맞음 !
그런데 왜 오류가 나는가 하면 var 키워드는 선언과 함께 undefined로 초기화되어 메모리에 저장되는데 let은 초기화되지 않은 상태로 선언만 메모리에 저장되기 때문입니다.( 초기화와 선언이 동시에 이루어지지 x 따로 분리되어 실행됨 )

(참고로 변수는 선언 단계> 초기화 단계> 할당 단계를 거쳐 생성된다 )
초기화 되지 않으면 변수를 참조할 수 없고 그래서 참조 에러를 일으키는 것입니다.
=> 결국 let과 const에도 호이스팅이 일어나기 때문에 에러를 일으키는 것입니다.

 

정리

const는 기본적으로 의도치 않은 재할당을 방지해 주기 때문에 const 를 기본으로 사용하여 불필요한 변수의 재사용을 방지하고, 재할당이 필요한 경우에 let 을 사용하는 것이 좋음 !

 

 

 

 

스코프란 유효한 참조 범위를 말하는데
함수 내부에서 선언된 변수는 함수 내부에서만 참조가 가능하며 이 경우 변수의 스코프는 함수 내부로 한정됩니다.
자바스크립트는 var로 선언한 변수의 스코프와 let, const로 선언한 변수의 스코프가 다릅니다.
 
 
var : 함수 레벨 스코프(function-level scope)
var는 함수 내부에 선언된 변수만 지역변수로 한정하며, 나머지는 모두 전역변수로 취급합니다.
 
let, cost : 블록 레벨 스코프(block-level scope)
let, const는 함수 내부는 물론, if문이나 for문 등의 코드 블럭{ ... } 에서 선언된 변수도 지역변수로 취급합니다.
당연히 함수 내부에서 선언된 변수도 외부에서 참조할 수 없습니다.
 
정리
var는 함수 내부에 선언된 변수만 지역 변수로 인정하는 함수 레벨 스코프
let, const는 블록 내부에서 선언된 변수까지도 지역변수로 인정하는 블록 레벨 스코프
* 참고로 블록은 if문이나 for문 등에서 중괄호{ } 로 둘러싸인 코드 영역을 말합니다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

var, let, const 차이점.팔만코딩경.notion.https://80000coding.oopy.io/e1721710-536f-43f2-823b-663389f5fbfa

개발일지.푸린푸린김푸린.(23.05).https://puringles.tistory.com/415