Tôi chỉ thật sự hiểu event loop khi ngừng xem nó là một vòng lặp

Event loop thường được minh hoạ bằng một vòng tròn liên tục kiểm tra hàng đợi. Hình ảnh đó hữu ích, nhưng lại che mất ý quan trọng nhất: JavaScript hoàn thành trọn vẹn một công việc, còn môi trường chạy quyết định khi nào công việc tiếp theo được bắt đầu.

Khi chuyển từ suy nghĩ về một “vòng lặp” sang các lượt thực thi, thứ tự chạy trở nên dễ dự đoán hơn nhiều.

console.log('đầu tiên');
queueMicrotask(() => console.log('microtask'));
setTimeout(() => console.log('task'), 0);
console.log('cuối cùng');

Script hiện tại phải kết thúc trước. Sau đó toàn bộ microtask được xử lý. Chỉ khi ấy timer task mới có thể bắt đầu một lượt mới.

Ta có thể ghi nhớ bằng ba bước:

1. Hoàn thành công việc hiện tại.
2. Xử lý hết hàng đợi microtask.
3. Để môi trường chạy chọn task tiếp theo.