AJAX（Asynchronous JavaScript and XML）是一種用于創(chuàng)建交互式網(wǎng)頁應用程序的技術(shù)。它允許在不重新加載整個網(wǎng)頁的情況下，通過與服務器進行異步通信，獲取數(shù)據(jù)并更新部分頁面內(nèi)容。在實現(xiàn)這一功能時，常常需要將接收到的數(shù)據(jù)轉(zhuǎn)換為JSON（JavaScript Object Notation）格式。JSON是一種輕量級的數(shù)據(jù)交換格式，易于讀寫和解析，廣泛用于Web應用程序中。

假設我們正在開發(fā)一個天氣預報應用程序。我們希望通過AJAX從服務器上獲取最新的天氣數(shù)據(jù)，并將其在頁面上以JSON格式顯示。以下是一個示例，展示了如何使用AJAX接收數(shù)據(jù)并將其轉(zhuǎn)換為JSON格式。

// 創(chuàng)建XMLHttpRequest對象
var xhr = new XMLHttpRequest();
// 指定服務器地址和請求方式
xhr.open('GET', 'weatherAPI', true);
// 監(jiān)聽數(shù)據(jù)接收狀態(tài)
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
// 將接收到的數(shù)據(jù)轉(zhuǎn)換為JSON格式
var weatherData = JSON.parse(xhr.responseText);
// 在頁面上顯示天氣信息
displayWeather(weatherData);
}
};
// 發(fā)送請求
xhr.send();
function displayWeather(data) {
var cityName = data.city;
var temperature = data.temperature;
var weatherDescription = data.description;
var weatherInfo = '城市：' + cityName + '<br/>' +
'溫度：' + temperature + '<br/>' +
'天氣描述：' + weatherDescription;
document.getElementById('weather').innerHTML = weatherInfo;
}

在上述示例中，我們首先創(chuàng)建了一個XMLHttpRequest對象，該對象用于與服務器進行通信。然后，我們使用open方法指定了請求地址和請求方式。在監(jiān)聽數(shù)據(jù)接收狀態(tài)的函數(shù)中，我們首先檢查了服務器的響應狀態(tài)和HTTP狀態(tài)碼。當readyState為4且狀態(tài)碼為200時，表示數(shù)據(jù)已經(jīng)接收到并準備就緒。接著，我們使用JSON.parse方法將接收到的文本數(shù)據(jù)轉(zhuǎn)換為JSON對象。最后，我們調(diào)用displayWeather函數(shù)，將天氣信息顯示在頁面上。

假設服務器返回的數(shù)據(jù)格式如下：

{
"city": "Beijing",
"temperature": "25°C",
"description": "Sunny"
}

在displayWeather函數(shù)中，我們從JSON對象中獲取了城市名稱、溫度和天氣描述等數(shù)據(jù)，并將其拼接為一個格式化的字符串。然后，我們找到ID為"weather"的HTML元素，并將天氣信息字符串賦值給其innerHTML屬性，以便在頁面上顯示出來。

通過上述示例，我們可以看到通過AJAX接收數(shù)據(jù)并將其轉(zhuǎn)換為JSON格式，可以方便地獲取服務器返回的數(shù)據(jù)，并在頁面上進行相應的展示和處理。這種方式不僅提高了用戶體驗，還為開發(fā)者提供了更靈活和高效的開發(fā)方式。