1. 변수의 생성과정

📌 초기화: undefined를 할당해주는 단계
📌 변수: 값을 담기 위한 공간

const

1. 선언 및 초기화 및 할당 단계

var

1. 선언 및 초기화 단계
2. 할당 단계

let

1. 선언 단계
2. 초기화 단계
3. 할당 단계

2. 변수 특징과 호이스팅

const

📌const로 선언한 변수에는 새로운 값을 할당할 수 없다.

---

var

📌선언하기 전에 사용할 수 있다.

console.log(b) // undefined
var b = 'bee'

var에서 위의 코드는 아래와 같이 동작이 이루어진다. (3)이 (1)로 실제 올라가는 것은 아니지만 그와 같이 끌어올려진 것 처럼 동작한다. (호이스팅)

var bug; // (1)
console.log(bug) // undefined (2)
bug = 'bee'//(3)

콘솔에 찍었을 때 'undefined'가 되는 이유는 선언은 호이스팅되지만 할당은 호이스팅되지 않기 때문이다.

---

📌 한 번 선언된 변수를 다시 선언할 수 있다.

var name = 'Mary'
console.log(name) // Mary

var name = 'William'
console.log(name) // William

---

3. let

📌 선언 전에 사용할 수 없다.

console.log(bug) // ERROR!!
// Uncaught ReferenceError: bug is not defined
let bug = 'bee'

TDZ(Temporal Dead Zone): 일시적 사각지대. TDZ 안에 있는 변수들은 사용할 수 없다. let과 const는 TDZ의 영향을 받기에 할당 전에 사용할 수 없다.

예시1

console.log(bug) // TEMPORAL DEAD ZONE!!! 사용불가
let bug = 'bee'// 함수의 선언, 할당
console.log(bug) // 사용가능

예시2

let dessert = 'cheeseCake';
function displayDessert() {
	console.log(dessert) //  TEMPORAL DEAD ZONE
	
  	let dessert = 'chocolateCake'
} 

displayDessert() // ERROR!!
// Cannot access 'dessert' before initialization

---

📌 이미 한 번 선언된 변수를 다시 선언할 수 없다.

let name = 'Mary'
console.log(name) // Mary

let name = 'William' // ERROR!!
// Uncaught SyntaxError: Identifier name has already been declared.
console.log(name)