AJAX（Asynchronous JavaScript and XML）是一種用于在后臺與服務器進行數據交互的技術。通過AJAX，我們可以實現異步加載數據，提高用戶體驗。在傳輸數據時，常常使用JSON（JavaScript Object Notation）格式。JSON是一種輕量級的數據交換格式，具有易讀易寫的特點。本文將介紹如何使用AJAX傳輸JSON數組，并結合舉例說明。

使用AJAX傳輸JSON數組的基本步驟如下：

1. 創建XMLHttpRequest對象

var xmlhttp;
if (window.XMLHttpRequest) {
// 標準瀏覽器
xmlhttp = new XMLHttpRequest();
} else {
// IE5, IE6
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}

首先，我們需要創建一個XMLHttpRequest對象。該對象用于與服務器進行數據交互。如果瀏覽器支持標準的XMLHttpRequest對象，則創建該對象；否則，創建一個IE特定的ActiveXObject。

2. 設置回調函數

xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
var response = JSON.parse(xmlhttp.responseText);
// 處理服務器返回的數據
}
};

接下來，我們需要設置一個回調函數，用于處理服務器返回的數據。在該回調函數中，我們可以通過XMLHttpRequest對象的readyState和status屬性來判斷服務器返回的狀態。

3. 打開連接

xmlhttp.open("POST", "example.php", true);

然后，我們需要打開與服務器的連接。open()方法接受三個參數：請求的方法（通常是"POST"或"GET"），服務器的URL和是否使用異步請求。在這個例子中，我們使用POST方法，并將數據發送到example.php文件。

4. 設置請求頭

xmlhttp.setRequestHeader("Content-Type", "application/json");

在發送請求之前，我們還需要設置請求頭。這里我們設置請求的Content-Type為"application/json"，表示要發送的數據是JSON格式。

5. 發送請求

var data = [
{ "name": "John", "age": 30 },
{ "name": "Alice", "age": 25 },
{ "name": "Bob", "age": 35 }
];
xmlhttp.send(JSON.stringify(data));

最后，我們使用send()方法發送請求。在這個例子中，我們將一個包含三個對象的數組轉換成JSON字符串，并發送給服務器。

綜上所述，通過以上步驟，我們可以使用AJAX傳輸JSON數組。下面是一個完整的示例：

var xmlhttp;
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
} else {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
var response = JSON.parse(xmlhttp.responseText);
// 處理服務器返回的數據
}
};
xmlhttp.open("POST", "example.php", true);
xmlhttp.setRequestHeader("Content-Type", "application/json");
var data = [
{ "name": "John", "age": 30 },
{ "name": "Alice", "age": 25 },
{ "name": "Bob", "age": 35 }
];
xmlhttp.send(JSON.stringify(data));

在這個示例中，我們創建了一個包含三個對象的數組，并以JSON格式發送到example.php文件。服務器可以解析這個JSON數組，并做相應的處理。

總而言之，使用AJAX傳輸JSON數組可以幫助我們在前端和后端之間高效地傳遞數據。無論是處理表單數據、列表數據還是其他類型的數據，都可以使用這種方法來實現異步加載和交互。通過了解AJAX的基本原理和相關的用法，我們可以更好地掌握前端開發中的數據傳輸技巧。