Nếu bạn đã học lập trình, chắc hẳn bạn biết thế nào là function. Nhưng bạn đã nghe đến Callback Function bao giờ chưa? Callback Function là một phần quan trọng của JavaScript. Một khi bạn hiểu rõ về , bạn sẽ thành thạo JavaScript hơn rất nhiều.
Mục lục
1. Callback Function là gì?
Theo Wikipedia, Callback Function là một đoạn code chạy được được sử dụng như tham số truyền vào của hàm B nào đó. Hàm A được gọi ngay lập tức hoặc trễ một chút sau khi hàm B được gọi. Dễ hiểu hơn, hàm callback là một hàm được gọi khi một điều gì đó xảy ra. Điều gì đó ở đây là một event, theo ngôn ngữ lập trình.
Hàm callback là một khái niệm có được từ lập trình hàm và cụ thể hóa cách dùng của các hàm như argument (đối số). Trong JavaScript, mỗi hàm đều là một first-class object (đối tượng hạng nhất). Điều này có nghĩa là mỗi hàm là một object và có thể được sử dụng như những object khác (string, number…). Điều này cho phép chúng ta sử dụng hàm này như tham số cho một hàm khác. Đây chính là ý tưởng cốt lõi đằng sau Callback function.
2. Tại sao cần sử dụng Callback Function?
Hầu hết thời gian, chúng ta tạo chương trình và phần mềm theo hướng xử lý đồng bộ. Điều này có nghĩa là khi nào bước 1 hoàn thành, bước 2 mới được thực hiện; khi nào một chương trình xong thì mới thực hiện chương trình khác. Thông thường, khi chúng ta yêu cầu dữ liệu từ một nguồn khác như API (phương thức trung gian) mở, chúng ta không biết khi nào dữ liệu sẽ được trả về.
Trong những trường hợp như vậy, đương nhiên chúng ta muốn chờ dữ liệu xuất hiện. Nhưng chúng ta không muốn cả chương trình phải dừng lại khi các dữ liệu đang được tìm kiếm. Đây là lúc hàm callback trở nên hữu dụng. Ngoài ra, nó còn cho phép chúng ta tái sử dụng code.
Với JavaScript, hàm callback đặc biệt quan trọng. Lý do là bởi: JavaScript là một ngôn ngữ lập trình hướng sự kiện. Điều này có nghĩa là thay vì đợi phản hồi rồi mới tiếp tục, JavaScript sẽ thực thi, đồng thời “lắng nghe” các sự kiện khác. Không phải là JavaScript không thực thi các hàm theo đúng trật tự chúng ta muốn, mà là JavaScript sẽ không đợi phản hồi từ, ví dụ hàm first(), rồi mới chuyển sang thực thi hàm second ().
Callback function là cách giúp chúng ta đảm bảo rằng một code nhất định sẽ không thực thi trừ khi một code khác hoàn thành thực thi.
3. Phân loại Callback
Callback Function được chia thành 2 loại, dựa trên cách chúng được gọi: synchronous (xử lý đồng bộ) và asynchronous (xử lý không đồng bộ).
Synchronous callback function còn được gọi là blocking callback function. Lý do là vì Higher-Order Function (hàm bậc cao) sẽ không hoàn thành nếu như callback chưa chạy xong.
greet() là một callback đồng bộ vì nó được chạy cùng lúc với hàm bậc cao map() . Như đã thấy từ ví dụ, cách để gọi callback là:
- Hàm cấp cao bắt đầu chạy: ‘map() starts’
- Hàm callback chạy: ‘greet() called’
- Hàm bậc cao hoàn thành chạy: ‘map() completed’
Asynchronous callback còn được gọi là non-blocking callback. Hàm bậc cao hoàn thành thực thi, không đợi callback function. Hàm bậc cao đảm bảo sẽ thực thi callback function trong một sự kiện sau đó. Ở ví dụ dưới đây, hàm later()được thực thi sau 2 giây.
later() là một hàm không đồng bộ vì setTimeout(later, 2000)bắt đầu và hoàn thành thực thi , nhưng later() được thực thi sau đó 2 giây. Cách để gọi hàm callback không đồng bộ là:
- Hàm bậc cao bắt đầu thực thi: ‘setTimeout() starts’
- Hàm bậc cao hoàn thành thực thi: ‘setTimeout() completed’
- Callback unction được thực thi sau đó 2 giây: ‘later() called’
4. Cách triển khai
Hãy xem ví dụ dưới đây về Callback Function trong JavaScript:
- Từ dòng 1-9: Hàm calculateSum nhận một số n, và một hàm. Nó tính tổng các số từ 1 đến n, xuất tổng tìm được đó và truyền đến callback function, như ở dòng 8.
- Từ dòng 12-14: Khi gọi hàm calculateSum, hàm callback cũng được định nghĩa bên trong hàm call. Nó nhận sum được truyền đến từ calculateSum và sử dụng tổng đó để xuất ra số trung bình.
Got It hy vọng rằng với bài viết trên, bạn đã có được cái nhìn cơ bản về Callback Function. Happy Coding!
Got It Vietnam – Tham khảo: Free Code Camp, Educative, Dmitri Pavlutin
