본문 바로가기

IT/Coding Note

자바스크립트 변수 let, const vs var

자바스크립트 변수는 let, const, var가 있다. var는 old 버전이고 let과 const가 new 버전이다.

" var는 더 이상 사용하지 말고 let과 const를 자바스크립트 변수로 사용해야 한다. "
Javascript variable
var
var는 old 방식인데, 변수를 var 하나로만 사용해 간편할 수도 있다. 다만, var를 사용할 거면 let과 const는 사용하지 않는 게 좋다. 더불어 가능하면 var 대신 let과 const를 사용하는 게 코딩에 더 유용하니 활용하는 게 좋다.

var 주요 특징
1) 함수 스코프를 지닌다. 즉, 함수 안에서 변수 var로 선언하면 지역변수가 된다. 
   if, for문 안에서 선언한 var는 지역변수가 아니라 전역변수가 되니 주의가 필요하다.
2) var는 전역객체(window)의 프로퍼티가 된다.
    예시를 보면 쉽게 확인할 수 있다. 
Javascript variable
let

 

let은 old방식인 var와 유사하다. var에서 문자 그대로 의미인 변수 기능을 담당하는 게 let이고, 문자 그대로 의미인 상수 기능을 담당하는 게 const라고 이해해도 무방하다. 재할당이 필요한 경우에는 let을 사용하고 그 이외에는 const를 사용한다.

let 주요 특징
1) 블록 레벨 {  } 스코프이다. 함수 뿐만 아니라 if, for문에서도 지역변수가 된다.

2) 변수 let은 중복할 수 없다. 재선언을 할 수 없지만 재할당은 가능하다.
3) let은 var와 달리 전역객체의 프로퍼티가 아니다.
    예시를 통해 var와 비교하면 쉽게 확인할 수 있다.
Javascript variable
const
const는 기본적으로 변경 불가능한 값을 담는 상수 개념의 변수이기에, 재선언 및 재할당이 불가능하다.
let과 동일하게 블록스코프가 적용된다.

const 주요 특징
1) const는 선언과 할당을 반드시 한 번에 해야 한다. let은 선언과 할당을 분리해도 된다.
2) const는 재선언, 재할당이 불가능하다. let은 재선언은 불가능하고 재할당만 가능하다.
   (참고로, var는 재선언, 재할당이 모두 가능하다.)
3) const로 객체를 할당하면 객체 자체는 재할당할 수 없지만, 객체 안의 데이터(프로퍼티)는 재할당할 수 있다. 
 예시를 통해 확인하면 다음과 같다.

더보기

Coding Note. 1. 변수 선언은 기본적으로 const로 한다.

                    2. let은 재할당이 필요한 경우에만 한정해 사용한다.

                    3. var는 사용하지 않는다.

                    4. 객체를 할당할 때에도 const를 사용한다.

                    5. let과 const는 함수스코프가 아니라 블록스코프{ }가 적용된다. 

                    6. let과 const는 변수 호이스팅이 발생하지 않는 것처럼 동작한다.

                       즉, 런타임을 고려해서 변수를 작성해야 한다.

                    7. const는 선언과 할당을 동시에 해야 하고 재선언, 재할당이 불가능하지만,

                       let은 선언과 할당을 분리할 수 있고 재할당이 가능하지만 재선언은 불가능하다.

" 안에서는 밖에 선언된 변수를 사용할 수 있지만,
                   밖에서는 안에 선언된 변수를 사용할 수 없다 "

" 밖에서는 안이 보이지 않고 안에서만 밖을 볼 수 있다. "
-전역/지역 개념 비유 표현