JAVASCRIPT

XỬ LÝ BẤT ĐỒNG BỘ TRONG JAVASCRIPT VỚI WHEN

thiet ke web tai da nang
Written by Mai Đông Giang

Trong lập trình web, đôi khi chúng ta cần xử lý việc get dữ liệu từ server cho client. Thông thường chúng ta làm việc đó bằng ajax. Ajax là gì?

Chúng ta sẽ thực hiện một số thao tác gì đó bằng code javascript sau khi get ajax đúng không nào? Cụ thể là ta lấy dữ liệu hoặc dùng data để kiểm tra hay hiển thị lên website. Nhưng có một số trường hợp ajax sẽ xử lý chậm, tức là thời gian chờ để server response về client lâu. Lúc đó, chắc chắn code của chúng ta lỗi, vì một số nguyên nhân nhưng đa số là thiếu biến hoặc biến không có dữ liệu. Code sẽ “chết” ngay!

Để giải quyết vấn đề bất đồng bộ này chúng ta sẽ sử dụng kỹ thuật $.when().then() của javascript. Nó rất là dễ để hình dung đúng không nào. Dịch nôm na ra thế này: Khi cái gì đó thì đến cái gì đó. hehe

OK, mình vào cụ thể nhé!

Mình sẽ có 1 ajax như sau:

var ajax = function() {
    var d = $.Deferred();
    $.ajax({
        type: "POST",
        url: "abc.php",
        error: function(error) {
            d.resolve( {status: false, message: error} );
        },
        success: function(res) {
            d.resolve( {status: false, message: "Success", data: res} );
        }
    });
    return d.promise();
}

Rồi nhé, đoạn ajax của bạn sẽ trả về một promise sau khi ajax chạy xong. Bây giờ bạn sử dụng $.when cho code của mình như sau.

$.when(ajax).done(function(res1) {
  console.log("Ajax 1 done"); 
  // Bây giờ code của bạn thực hiện tiếp theo sẽ đặt ở đây 
  // Nó giải quyết cho bạn thực hiện một số công việc nhằm đảm bảo ajax đã được xử lý xong. 
  // Hạn chế được lỗi. 
});

Đơn giản thôi đúng không nào? Các bạn đọc thêm về Promise trong Javascript để hiểu cơ chế bất đồng bộ nhé.

Hẹn các bạn trong những bài viết tiếp theo!

About the author

Mai Đông Giang

Thẳng thắn, sống tình cảm, làm việc hết mình.
Chia sẻ những gì tôi biết.