So sánh Microtask và Macrotask trong JavaScript qua ví dụ thực tế dễ hiểu
Xin chào mọi người, mình là [Tên bạn] đây!
Gần đây khi ôn phỏng vấn, mình thấy có rất nhiều câu hỏi xoay quanh Event Loop, Microtask, Macrotask trong JavaScript. Bài viết này sẽ giúp bạn phân biệt rõ ràng 2 loại task này qua ví dụ minh họa dễ hiểu.
1. Event Loop là gì?
Event Loop là cơ chế giúp JavaScript xử lý bất đồng bộ (async). Dù chỉ chạy trên 1 luồng (single-threaded), nhưng nhờ Event Loop, JavaScript vẫn có thể “làm nhiều việc một lúc”.
2. Microtask vs Macrotask
| Tiêu chí | Microtask | Macrotask |
|---|---|---|
| Ví dụ | Promise.then, queueMicrotask() |
setTimeout, setInterval |
| Ưu tiên | Cao hơn | Thấp hơn |
| Thực thi khi nào | Sau khi call stack rỗng | Sau khi toàn bộ microtask xong |
3. Ví dụ minh họa
console.log('Start'); setTimeout(() => { console.log('Macrotask - setTimeout');
}, 0); Promise.resolve().then(() => { console.log('Microtask - Promise');
}); console.log('End');