Phân biệt var, let, const và cơ chế Hoisting, Temporal Dead Zone (TDZ) trong JavaScript

Nền tảng cốt lõi của JavaScript hiện đại#

Mặc dù từ năm 2015 (ES6), hầu hết các lập trình viên đã chuyển sang dùng let và const, các câu hỏi về Hoisting và Temporal Dead Zone (TDZ) vẫn là đề tài yêu thích trong các vòng phỏng vấn kỹ thuật để kiểm tra xem ứng viên có hiểu cách JavaScript Engine (V8) phân bổ bộ nhớ hay không.

Hãy cùng giải phẫu đoạn code thú vị sau:

console.log(a); // In ra: undefined (Tại sao không báo lỗi?)
var a = 10;

console.log(b); // Báo lỗi: ReferenceError: Cannot access 'b' before initialization
let b = 20;

1. Bản chất của Hoisting trong JavaScript#

Trước khi thực thi một dòng code nào, JavaScript Engine sẽ trải qua Pha khởi tạo (Creation Phase):

• Engine quét qua toàn bộ mã nguồn và đăng ký các khai báo biến, hàm vào vùng nhớ (Lexical Environment).
• Với var: Biến được đưa vào bộ nhớ và ngay lập tức được gán giá trị mặc định là undefined. Vì vậy khi truy cập trước dòng khai báo, bạn nhận được undefined.

2. Temporal Dead Zone (Vùng chết tạm thời - TDZ)#

Có một hiểu lầm phổ biến là "let và const không bị hoisting". ĐIỀU ĐÓ LÀ SAI!

• Cả let và const đều CÓ BỊ HOISTING vào Lexical Environment.
• Điểm khác biệt mấu chốt: Chúng KHÔNG ĐƯỢC KHỞI TẠO GIÁ TRỊ BAN ĐẦU.
• Khoảng thời gian từ lúc bắt đầu khối lệnh cho đến khi dòng lệnh let b = 20 được thực thi gọi là Temporal Dead Zone (TDZ). Bất kỳ nỗ lực truy cập biến b trong vùng này đều sẽ bị ném ra lỗi ReferenceError!

Bảng so sánh toàn diện#

Góc thảo luận#

Quy tắc đặt linter ở công ty bạn có cấm tuyệt đối từ khóa var không? Có trường hợp đặc biệt nào bắt buộc phải dùng var trong năm 2026 không?

Xem thêm nội dung liên quan:

• Bộ 2.916 câu trắc nghiệm Lập trình
• Lộ trình làm chủ JavaScript Nâng cao