AJAX（Asynchronous JavaScript and XML）是一種用于在網頁中異步傳輸數據的技術。通過使用AJAX，網頁可以在不重新加載整個頁面的情況下與服務器進行交互。AJAX使用的最常見的數據格式是JSON（JavaScript Object Notation），它是一種輕量級的數據交換格式。

JSON是由鍵值對組成的簡單數據結構，這些鍵值對可以嵌套在其他的鍵值對中。每對鍵值由冒號分隔，不同的鍵值對由逗號分隔，整個JSON對象使用大括號包圍。JSON提供了一個易于解析和生成的數據輸入和輸出格式，使得它成為在AJAX調用中傳輸數據的理想選擇。

<script>
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var response = JSON.parse(xhr.responseText);
console.log(response);
}
};
xhr.open('GET', '/data.json', true);
xhr.send();
</script>

上面的代碼是一個簡單的使用AJAX請求獲取JSON數據的例子。它創建了一個XMLHttpRequest對象（xhr），并指定了一個回調函數，該函數在請求的狀態改變時被調用。當readyState變為4（即請求完成）且status為200（即請求成功）時，代碼將獲取到的JSON數據進行解析并輸出到控制臺中。

假設我們有一個服務器端API，它返回一個JSON對象，其中包含有關產品的信息，如名稱、價格和庫存數量。我們可以使用AJAX請求從服務器獲取這些信息，然后在頁面上動態顯示出來。假設API的URL為“/api/products”，以下是前端代碼：

<script>
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var response = JSON.parse(xhr.responseText);
var productsContainer = document.getElementById('products-container');
response.products.forEach(function(product) {
var productElement = document.createElement('div');
productElement.innerHTML = '名稱：' + product.name + '，價格：' + product.price + '，庫存：' + product.stock;
productsContainer.appendChild(productElement);
});
}
};
xhr.open('GET', '/api/products', true);
xhr.send();
</script>

上面的代碼使用AJAX請求從服務器獲取到的JSON數據，然后動態創建HTML元素來顯示每個產品的信息。這樣，當我們加載頁面時，AJAX請求將被發送到服務器，獲取產品的JSON數據，然后通過JavaScript將產品信息逐個顯示在指定的容器中。

總的來說，使用AJAX定義返回值為JSON的確有許多優點。首先，JSON是一種簡單且易于理解和解析的數據格式，使得在前端和后端之間傳輸數據變得非常方便。其次，AJAX可以實現異步數據交互，無需重新加載整個頁面，提高了用戶體驗。最后，使用AJAX請求獲取JSON數據可以使頁面在加載時更快，并減輕服務器的負擔。因此，當我們需要從服務器獲取數據并在頁面上動態顯示時，AJAX請求返回JSON數據是一種非常有效和常用的方法。