在現代web開發中，Ajax是一種非常重要的技術，它可以在不刷新整個頁面的情況下與服務器進行數據交互。而傳遞數據的格式化是Ajax中一個關鍵的環節，其中最常用的數據格式之一就是JSON（JavaScript Object Notation）。JSON是一種輕量級的數據交換格式，以易讀、易解析和易編寫的特點而受到廣泛的使用。本文將介紹如何使用Ajax傳遞和解析JSON格式的數據，并結合實際例子進行說明。

假設我們有一個網頁，其中有一個表單用于提交用戶的姓名和年齡，并將數據發送給服務器。我們希望服務器返回一個JSON對象，其中包含一個greeting屬性，值為"Hello, [姓名]，你今年[年齡]歲了！"，這樣我們就可以在頁面上顯示出個性化的問候語。

首先，我們需要編寫前端的HTML和JavaScript代碼，以及后端的服務器代碼。在HTML中，我們創建一個表單，并用JavaScript監聽表單的提交事件。當表單提交時，我們使用Ajax向服務器發送數據，并等待服務器的響應。在JavaScript代碼中，我們可以使用XMLHttpRequest對象來處理Ajax請求，通過設置請求的方法、URL和數據類型，我們可以指定要發送的數據和期望的數據格式。在服務器端，我們可以使用一種服務器端語言（如PHP、Node.js等）來接收請求，處理數據，并返回一個JSON對象。

// HTML代碼
<form id="myForm">
<label for="name">姓名:</label>
<input type="text" id="name" name="name">
<br>
<label for="age">年齡:</label>
<input type="text" id="age" name="age">
<br>
<input type="submit" value="提交">
</form>
// JavaScript代碼
document.getElementById("myForm").addEventListener("submit", function(e) {
e.preventDefault(); // 阻止form默認提交行為
var name = document.getElementById("name").value;
var age = document.getElementById("age").value;
var xhr = new XMLHttpRequest();
xhr.open("POST", "/api/greeting", true);
xhr.setRequestHeader("Content-Type", "application/json");
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var response = JSON.parse(xhr.responseText);
alert(response.greeting);
}
};
var data = JSON.stringify({name: name, age: age});
xhr.send(data);
});
// 后端代碼（示例使用Node.js和Express框架）
app.post("/api/greeting", function(req, res) {
var name = req.body.name;
var age = req.body.age;
var greeting = "Hello, " + name + ", 你今年" + age + "歲了！";
var response = {greeting: greeting};
res.json(response);
});

在上面的代碼中，我們通過監聽表單的提交事件，使用XMLHttpRequest對象發送一個POST請求到服務器的"/api/greeting"路徑。我們通過設置請求頭"Content-Type"為"application/json"來指定請求的數據格式為JSON。在服務器端，我們使用Express框架提供的路由來監聽該路徑的POST請求，并解析請求中的JSON數據。然后，我們根據解析的數據生成一個包含個性化問候語的JSON對象，并使用res.json()方法返回給前端。

前端收到服務器返回的JSON對象后，我們使用JSON.parse()方法將其轉換為JavaScript對象，并從中提取"greeting"屬性的值。最后，我們可以將該問候語顯示在頁面上。

通過以上的例子，我們可以看到JSON在Ajax數據傳遞中的重要性。它可以將復雜的數據結構轉換為簡單的字符串，方便傳輸和解析。同時，JSON格式的數據易讀易解析，使得服務器和客戶端之間的數據交互更加清晰和高效。

總之，Ajax傳遞和解析JSON格式的數據是現代web開發中的常見任務。通過使用XMLHttpRequest對象和一種服務器端語言，我們可以實現前后端之間的無刷新數據交互。JSON作為一種輕量級的數據格式，不僅降低了數據傳輸的復雜性，還提供了易讀易解析的特點，為實現更好的用戶體驗提供了便利。