從jQuery Ajax 呼叫解耦成功回調函數

使用jQuery ajax 從伺服器檢索資料時，通常的做法是定義成功.ajax () 區塊中的回呼函數。這將回調處理與 AJAX 呼叫緊密結合在一起，限制了靈活性和可重複使用性。

要在 .ajax() 區塊之外定義成功回調，通常需要宣告一個用於儲存返回資料的變數。不過，建議使用更現代的方法使用延遲物件。

自 jQuery 1.5 起，延遲物件提供了一種更好的方法來處理 AJAX 呼叫等非同步操作。以下是實現此目的的方法：

function getData() {
    return $.ajax({
        url : 'example.com',
        type: 'GET'
    });
}

function handleData(data /* , textStatus, jqXHR */ ) {
    alert(data);
    //do some stuff
}

getData().done(handleData);

這種方法將回呼處理與 AJAX 呼叫解耦，允許輕鬆進行多個回調、錯誤處理和非同步事件同步。

例如:

// Timer for demo purposes, resolves itself after 5 seconds
var timer = $.Deferred();
setTimeout(timer.resolve, 5000);

// Get data using AJAX and attach done and error handlers
var ajax = getData().done(handleData).fail(error);

// Wait for both AJAX and timer to finish before continuing
$.when(timer, ajax).done(function() {
    // Both AJAX and 5s timer have finished
});

// Additional callbacks can be added even after AJAX call finishes
ajax.done(function(data) {
    //Do some stuff with data
});

這展示了延遲物件的強大功能，可以更好地控制 jQuery 應用程式中的非同步操作並提高靈活性。