Bài 9: Hàm callback – hiểu và áp dụng

Tiếp tục với Bài 9 – Hàm callback trong JavaScript. Đây là một khái niệm cực kỳ quan trọng, là nền tảng để hiểu sâu hơn về lập trình bất đồng bộ và các hàm cao cấp.

---

1. Callback là gì?

Callback là một hàm được truyền vào như tham số của một hàm khác và được gọi lại (callback) sau khi hàm kia thực hiện xong công việc.

📋 Copyfunction greet(name, callback) {
  console.log("Xin chào " + name)
  callback()
}

function sayBye() {
  console.log("Tạm biệt!")
}

greet("An", sayBye)
// → Xin chào An
// → Tạm biệt!

---

2. Callback ẩn trong JavaScript

Rất nhiều hàm tích hợp sẵn trong JavaScript đều dùng callback, ví dụ:

setTimeout

📋 CopysetTimeout(function () {
  console.log("Đã đợi 2 giây")
}, 2000)

---

Array.forEach

📋 Copylet numbers = [1, 2, 3]

numbers.forEach(function (num) {
  console.log(num)
})

---

3. Viết hàm nhận callback tự tạo

📋 Copyfunction processSomething(callback) {
  console.log("Đang xử lý...")
  callback()
}

processSomething(function () {
  console.log("Xử lý xong!")
})

---

4. Callback có tham số

📋 Copyfunction calculate(a, b, callback) {
  let result = a + b
  callback(result)
}

calculate(3, 4, function (res) {
  console.log("Kết quả: " + res)
})

---

5. Giao diện học (code + output)

Code ví dụ	Kết quả
greet("An", sayBye)	Xin chào An / Tạm biệt
setTimeout(...)	In sau vài giây
forEach(...)	In từng phần tử

---

6. Khi nào cần dùng callback?

• Khi xử lý bất đồng bộ (ví dụ: đợi API, thao tác tệp, hẹn giờ)
• Khi muốn thực hiện hành động tùy theo người dùng định nghĩa
• Khi viết hàm dùng lại được nhiều cách xử lý khác nhau

---

Tóm tắt bài 9

Bạn đã học:

• Callback là hàm được truyền vào hàm khác
• Rất nhiều hàm JS hỗ trợ callback (setTimeout, forEach…)
• Có thể viết hàm tự nhận callback
• Callback có thể nhận tham số khi được gọi lại

---

Bài tập

1. Viết hàm hello(name, callback) → chào tên và gọi hàm tiếp theo
2. Dùng setTimeout in ra "Xong rồi!" sau 3 giây
3. Duyệt mảng [5, 10, 15] bằng forEach để in từng phần tử + 1