호이스팅이란? (var와 let의 차이)

1. 호이스팅이란?

: javascript 에서 코드 실행 전 함수 선언이 스코프의 최상단으로 끌어 올려지는 현상.
- 코드가 실행이 되기 전에 자바스크립트 엔진이 선언 해둔 변수를 모두 조사함
- 선언된 변수와 함수를 모두 기억해 둠

※ 스코프 : 변수에 접근할 수 있는 범위

 

2. var를 통한 선언의 문제점.
    2-1. 호이스팅 시 변수의 선언과 초기화 (undefined)를 동시에 함.

[실행]
console.log(a)
var a = 1
console.log(a)

[결과]
undefined
1

    [원인]

    : 호이스팅 시 변수의 선언과 초기화를 한 후, 추후 a라는 값이 나오면 값을 할당 함.

    [해결]

    : let 은 위와 같은 문제를 해결해준다. let도 호이스팅의 개념은 존재하지만 TDZ의 개념이 존재.

    ※ TDZ(TEMPORAL Death Zone) : a 선언문이 나오기 전까지는 a에 접근을 차단함.

 

    2-2. 전역변수와 지역변수의 개념이 확실하지 않음.
    : var로 변수 선언을 했을 시, 함수 안에서는 지역 변수가 먹히지만 for문 등 함수 외에는 모두 전역변수로 올려버리는 문제가 발생한다.        [해결]
     : let으로 선언했을 땐, 함수 외의 for문 if문 등에서도 지역 변수와 전역 변수를 구분한다.

    2-3. 변수의 이름을 중복 설정 가능하다.

[실행]
var a = 1
console.log(a)

var a = 2
console.log(a)

[결과]
1
2

    [해결]

    : let 으로 선언 후 실행 했을 땐, 이미 선언이 되어있다는 에러 문구가 나온다.