TIL - Var, Let, Const의 차이점

박지민·2022년 6월 27일
0

TIL

목록 보기
23/25
post-thumbnail

1. var는 함수 레벨 스코프이고 let, const는 블록 레벨 스코프이다.

1-1 함수 레벨 스코프와 블록 레벨 스코프
함수 레벨 스코프(Function-level Scope)
함수 내에서 선언된 변수는 함수 내에서만 유효하며 함수 외부에서는 참조할 수 없다. 즉, 함수 내부에서 선언한 변수는 지역 변수이며 함수 외부에서 선언한 변수는 모두 전역 변수이다.

블록 레벨 스코프(Block-level Scope)
모든 코드 블록(함수,if문,for문,while문,try/catch문 등)내에서 선언된 변수는 코드 블록 내에서만 유효하며 코드 블록 외부에서는 참조할 수 없다. 즉, 코드 블록 내부에서 선언한 변수는 지역 변수이다.

2. var로 선언한 변수는 선언 전에 사용해도 에러가 나지 않지만 let, const는 에러가 발생한다.

2-1 호이스팅이 안되서가 아니라 var, let, const, function, class 등등의 선언 키워드들은 모두 호이스팅이 되지만 var의 경우 호이스팅되면서 초기 값이 없으면 자동으로 undefined를 초기값으로 하여 메모리를 할당한다. 그래서 var의 경우 선언 전에 해당 변수를 사용하려고 해도 메모리에 해당 변수가 존재하기 때문에 에러가 발생하지 않는 것이며 이는 메모리 누수 발생의 원인이 되므로 var 사용은 지양해야 한다.
let, const의 경우 호이스팅이 되면서 초기 값이 없다면 var처럼 자동으로 초기값을 할당하지 않는다. 값이 할당되기 전까지 메모리를 할당하지 않기 때문에 값이 할당되기 전에 사용하려고 하면 메모리에 해당 변수가 존재하지 않아서 에러를 발생시킨다.

2-2 TDZ(Temproal Dead Zome : 일시적 사각지대)란, 변수가 스코프의 시작 지점부터 초기화가 되는 지점까지의 변수를 참조할 수 없는 구간을 말한다.

3. var는 이미 선언되어있는 이름과 같은 이름으로 변수를 또 선언해도 에러가 나지 않지만 let, const는 이미 존재하는 변수와 같은 이름의 변수를 또 선언하면 에러 발생한다.

4. var, let은 변수 선언시 초기 값을 주지 않아도 되지만 const는 반드시 초기값을 할당해야한다.

5. var, let은 값을 다시 할당할 수 있지만 const는 한번 할당한 값은 변경할 수 없다.

  단, 객체 안에 프로퍼티가 변경되는 것까지 막지는 못한다. 만약 객체의 프로퍼티도 변경되지 않게 객체를 선언하고 싶다면 Object.freeze() 메소드를 사용 할 수 있다. 하지만 Object.freeze()는 얕은 동결이기 때문에 객체 안에 있는 또다른 객체의 프로퍼티 변경까지 동결하지는 못한다. 깊은 동결을 구현하고 싶다면 따로 함수를 만들어야 한다.

profile
프론트엔드 개발자

0개의 댓글