functionDisplayOne là Function Expression (biểu thức hàm), functionDisplayTwo là Function Declaration (khai báo hàm). Function declaration được định nghĩa ngay khi function bao quanh được thực thi (hoisting toàn bộ).
Cả hai đều dùng để khai báo function trong JS. functionDisplayOne là anonymous function (hàm ẩn danh) gán cho biến.
Function Expression
functionDisplayOne(); // ❌ TypeError: functionDisplayOne is not a function
var functionDisplayOne = function() {
console.log("Hello!");
};
Giải thích: var functionDisplayOne được hoisting với giá trị undefined. Gọi trước dòng gán → undefined() → TypeError.
Function Declaration
functionDisplayTwo(); // ✅ Hoạt động: "Hello!"
function functionDisplayTwo() {
console.log("Hello!");
}
Giải thích: Toàn bộ function (name + body) được hoisting. Có thể gọi ở bất kỳ đâu trong scope.
So sánh chi tiết
| Đặc điểm | Function Declaration | Function Expression |
|---|---|---|
| Cú pháp | function name() {} | var name = function() {} |
| Hoisting | Toàn bộ function | Chỉ biến (var → undefined, let/const → TDZ) |
| Tên function | Bắt buộc (named) | Có thể anonymous hoặc named |
| Có thể dùng trước khai báo? | Có | Không (trừ var + gọi sau khi gán) |
| Trong block (if/for) | Non-standard (tránh dùng) | An toàn (block-scoped với let/const) |
| Arrow function | Không áp dụng | Chỉ expression: () => {} |
Named Function Expression (NFE)
var func = function myName() {
// myName chỉ truy cập được bên trong function (recursion)
console.log(myName.name); // "myName"
};
console.log(func.name); // "myName" - debug stack trace đẹp hơnBest Practice hiện đại
- Ưu tiên Function Declaration cho function độc lập (dễ đọc, hoisting an toàn).
- Dùng Arrow Function cho callback, method ngắn, functional programming.
- Dùng Function Expression (const/let) khi cần conditional definition hoặc gán động.
- Tránh
var- dùngconst/let(block-scoped, TDZ bảo vệ).