Hỏi Đáp

Callback là gì? (Callback trong javascript)

Cập nhật lúc: 19 Tháng Chín, 2023

Rate this post

Video callback là gì

Trong ngôn ngữ lập trình JavaScript, Callback (gọi tắt là “gọi lại”) là một tính năng vô cùng quan trọng. Nó được cài đặt vào các function và có vai trò thông báo kết quả trả về cho những người khác. Một cách hiệu quả để thực hiện công việc mà không cần phải chờ đợi lâu.

JavaScript và đặc trưng không chờ đợi

Khác với PHP, JavaScript có đặc điểm không chờ đợi. Khi một function JavaScript được gọi, nó không chờ function đó trả về kết quả mà tiếp tục thực hiện. Điều này tương tự như việc con thỏ trẻ muốn đi chơi và không muốn chờ đợi.

Callback – Mời thỏ trang điểm xong

Hãy tưởng tượng con thỏ muốn ăn cỏ và uống nước trong một hang động. Thỏ cần mất 3 giây để hoàn thành nhiệm vụ này. Function “con_tho_an_co” sẽ giúp con thỏ thực hiện nhiệm vụ này và gọi function “hotel” khi thỏ đã hoàn thành việc ăn uống.

function con_tho_an_co(callback007) {
   setTimeout(function() {
       console.log('con thỏ ăn cỏ, uống nước');
       callback007(); // Báo cáo khi thỏ hoàn thành
   }, 3000);
}

function hotel() {
   console.log('chui vô hotel');
}

var callback007 = function() {
   hotel();
}

con_tho_an_co(callback007);

Hoặc chúng ta có thể viết gọn lại như sau:

con_tho_an_co(function() {
   hotel();
});

Đảm bảo sự tuân thủ thứ tự

Để đảm bảo rằng thỏ chỉ vào hotel sau khi đã ăn no uống say, chúng ta sử dụng callback để con thỏ báo cáo khi hoàn thành. Điều này cũng giúp chúng ta kiểm soát thời gian và đảm bảo thứ tự hoạt động.

Giải quyết “Callback Hell” một cách đơn giản

Trong JavaScript, callback hell (địa ngục callback) là một tình huống khi chúng ta sử dụng quá nhiều callback lồng nhau, dẫn đến mã nguồn khó đọc và bảo trì. Tuy nhiên, giải pháp không phải lúc nào cũng là Promise. Đôi khi, chỉ cần sắp xếp mã code đẹp hơn một chút là đủ.

function doA(cb) {
   cb();
}

function doB(cb) {
   cb();
}

function doC(cb) {
   cb();
}

function kotexcode() {
   doA(thenB); // Làm A xong làm B
}

function thenB() {
   doB(thenC);
}

function thenC() {
   doC(function() {
       console.log('ahihi đồ ngốc !'); // Đã hoàn thành công việc
   });
}

Hãy nhớ rằng, khi gặp phải callback hell, chúng ta có thể giải quyết vấn đề một cách thông minh bằng kiến thức và kĩ năng lập trình, chứ không phải lúc nào cũng cần đến Promise.