1️⃣ 함수 선언문 (Function Declaration)
문법
function add(a, b) {
return a + b;
}
사용
add(2, 3); // 5
🔹 특징 핵심
✔ 호이스팅 됨 (전체 함수가 끌어올려짐)
✔ 함수 이름이 필수
✔ 어디서든 호출 가능
📌 예제: 선언 전에 호출 가능
add(2, 3);
function add(a, b) {
return a + b;
}
👉 에러 안 남
왜냐면 JS가 실행 전에 함수 전체를 메모리에 올려두기 때문
2️⃣ 함수 표현식 (Function Expression)
문법
const add = function (a, b) {
return a + b;
};
사용
add(2, 3); // 5
🔹 특징 핵심
✔ 변수에 함수 저장
✔ 함수 이름 생략 가능 (익명 함수)
❌ 호이스팅 안 됨 (정확히는 변수만 호이스팅)
📌 예제: 선언 전에 호출하면?
add(2, 3); // ❌ 에러
const add = function (a, b) {
return a + b;
};
👉 ReferenceError 발생
3️⃣ 왜 이런 차이가 나냐?
🔍 호이스팅 차이
함수 선언문
function add() {}
JS 내부 처리 (개념적으로)
function add() {}
// 그대로 위로 올라감
함수 표현식
const add = function () {};
JS 내부 처리
const add; // 변수만 호이스팅 (TDZ)
add = function () {};