1. var 변수 선언

선언 o, 할당 o

var number = 1
console.log(number)
// 1

number 변수를 선언하고 1을 할당. number를 호출하면 해당 값을 불러올 수 있다.

선언 o, 할당 x

var number
console.log(number)
// undefined

만약 초기화 해주지 않았다면 javascript 엔진이 undefined라는 값을 할당한다. (빈 값이 아님) undefined라는 값은 할당되지 않았음을 의미하며 실제로는 Garbage 값이 들어있다.

호이스팅

console.log(number)
var number = 1
// undefined

javascript 엔진은 컴파일시, 실행 컨텍스트 내에 변수들을 undefined 값을 할당한 후 저장한다. 그렇기 때문에 Reference Error가 아니라 undefined 값이 출력된다.

JIT 컴파일러 : 먼저 전체 코드를 컴파일한 후, 인터프리팅 방식으로 javascript를 읽음.

lexical scoping : 함수 실행 컨텍스트 내의 scope는 실행이 아니라 선언시 정의 됨.

빈 값 할당

var number = null
console.log(null)
// null

변수에 빈 값을 할당하고 싶으면 null을 할당해준다.

2. let const 변수 선언

중복 선언 X

let number = 1
let number = 2
// error

var number = 1
var number = 2
// 2

let, const 로 선언된 변수는 중복 선언이 불가하다.

블록레벨 스코프

if (1) {
  let number = 1
}
console.log(number)
// error

if (1) {
  var number = 2
}
console.log(number)
// 2

함수가 아니더라도 if, for 등의 코드 블럭 내부에서 선언된 변수 참조를 막는다.

호이스팅(TDZ)

console.log(number)
let number = 1
// error

let, const의 경우 컴파일시, 실행 컨텍스트 내에 변수들을 저장하지만 undefined 값을 할당하지 않는다. 그렇기 때문에 error를 출력한다.

인터프리팅시, 할당값이 없으면 undefined를 할당한다.

3. let vs const

원시타입의 경우

재할당이 필요한 경우, let을 사용한다.

재할당이 필요하지 않는 상수의 경우, const를 사용한다.

let money = 0
const WAGE = 8590
while (work) {
  money += WAGE
}

참조타입(배열,객체)의 경우

참조타입의 경우, 변수가 가리키는 값을 재할당하지 않아도 수정이 가능하다.

const number = 1
number = 2
// error

const numbers = [1, 2]
numbers.push(3)
// [1, 2, 3]