AJAX（Asynchronous JavaScript and XML）是一種用于在不重新加載整個頁面的情況下從服務器異步獲取數據的技術。在網頁開發中，使用AJAX可以提供更流暢和交互性強的用戶體驗。在AJAX中，回調函數（callback）是一種重要的概念，它用于處理從服務器返回的數據。本文將通過舉例來詳細討論AJAX回調的使用和作用。

假設我們正在開發一個簡單的天氣預報應用程序。用戶輸入城市名稱，點擊查詢按鈕后，網頁向服務器發送AJAX請求，服務器會返回該城市的天氣數據。在處理這個AJAX請求的過程中，我們可以使用回調函數來處理服務器返回的數據。

function getWeather(city, callback) {
// 發送AJAX請求獲取城市的天氣數據
// 假設這個過程非常耗時，需要幾秒鐘才能返回數據
var data = {
city: city,
temperature: '25°C',
condition: '晴天'
};
// 請求返回后，調用回調函數處理數據
setTimeout(function() {
callback(data);
}, 3000);
}
function displayWeather(weatherData) {
// 在頁面上顯示天氣數據
var city = weatherData.city;
var temperature = weatherData.temperature;
var condition = weatherData.condition;
document.getElementById('city').innerText = city;
document.getElementById('temperature').innerText = temperature;
document.getElementById('condition').innerText = condition;
}
// 用戶點擊查詢按鈕時調用該函數
function queryWeather() {
var city = document.getElementById('cityInput').value;
getWeather(city, displayWeather);
}

在上述代碼中，getWeather函數用于發送AJAX請求并獲取天氣數據。由于這個過程需要一定的時間，因此我們使用了setTimeout函數模擬一個延遲，3秒鐘后調用回調函數callback，并將天氣數據作為參數傳遞給它。

displayWeather函數用于在頁面上顯示天氣數據。它從傳遞給它的參數weatherData中提取出城市、溫度和天氣狀況，并將其顯示在相應的DOM元素中。

最后，當用戶點擊查詢按鈕時，我們調用queryWeather函數。它首先獲取用戶輸入的城市名稱，然后調用getWeather函數，并將displayWeather函數作為回調函數傳遞給它。當AJAX請求返回并獲取到天氣數據后，setTimeout函數將調用回調函數displayWeather，從而將天氣數據顯示在頁面上。

通過使用回調函數，我們可以在異步請求完成后處理返回的數據，而無需阻塞用戶界面。在實際開發中，回調函數常常用于處理AJAX請求的響應，包括數據的處理、顯示或其他后續操作。

綜上所述，AJAX回調是一種重要的概念，它為我們在處理異步請求時提供了靈活和可擴展的方式。通過合理使用回調函數，我們可以更好地控制和處理網頁與服務器之間的數據交互，從而提供更好的用戶體驗。