AJAX（Asynchronous JavaScript and XML）是一種用于在不重新加載整個網頁的情況下實現異步通信的技術。它允許我們向服務器發送請求并獲取響應，以及更新部分網頁內容而不用刷新整個頁面。當涉及到處理 JSON（JavaScript Object Notation）數據時，AJAX 提供了一些方便的方法來遍歷 JSON 對象，并獲取所需的數據。

在講解 AJAX 對 JSON 數據的遍歷之前，讓我們看一個簡單的例子。假設我們從服務器請求一個存儲了學生信息的 JSON 文件：

{
"students": [
{
"name": "Alice",
"age": 18,
"grade": "A"
},
{
"name": "Bob",
"age": 17,
"grade": "B"
},
{
"name": "Charlie",
"age": 19,
"grade": "A+"
}
]
}

我們可以使用 AJAX 發送一個 GET 請求來獲取這個 JSON 文件：

var httpRequest = new XMLHttpRequest();
httpRequest.onreadystatechange = function() {
if (httpRequest.readyState === 4 && httpRequest.status === 200) {
var response = JSON.parse(httpRequest.responseText);
// 處理 JSON 數據
}
};
httpRequest.open("GET", "students.json", true);
httpRequest.send();

在上面的代碼中，當我們發送 GET 請求并獲得服務器的響應之后，我們可以使用JSON.parse()方法將響應文本轉為 JSON 對象，以便進一步處理。

接下來，我們將討論幾種常用的方法來遍歷 JSON 數據。

方法一：使用 for 循環

最簡單的遍歷 JSON 數據的方法是使用 for 循環。通過獲取數組的長度，我們可以使用索引訪問 JSON 數組中的每個元素。

var students = response.students;
for (var i = 0; i < students.length; i++) {
var student = students[i];
console.log(student.name + "，" + student.age + "歲，成績：" + student.grade);
}

上面的代碼會輸出以下內容：

Alice，18歲，成績：A
Bob，17歲，成績：B
Charlie，19歲，成績：A+

在這個例子中，我們使用了一個 for 循環來遍歷 JSON 數組students。對于每個學生對象，我們可以通過屬性名稱來訪問其值。

方法二：使用 forEach() 方法

除了使用 for 循環，我們還可以使用 JSON 數組的forEach()方法來遍歷 JSON 數組。

response.students.forEach(function(student) {
console.log(student.name + "，" + student.age + "歲，成績：" + student.grade);
});

上面的代碼與前面的例子效果相同。

使用forEach()方法有一個優勢，即它可以更簡潔地迭代數組元素。而不需要手動跟蹤索引值。

方法三：使用 jQuery 的 $.each() 方法

如果使用了 jQuery 庫，我們可以使用其提供的$.each()方法來遍歷 JSON 數組。

$.each(response.students, function(index, student) {
console.log(student.name + "，" + student.age + "歲，成績：" + student.grade);
});

上面的代碼同樣會輸出同樣的結果。

使用$.each()方法時，我們需要提供一個回調函數，它會在每個元素上執行。回調函數的第一個參數是當前迭代的索引，第二個參數則是當前元素的值。

方法四：使用 ES6 的 for...of 循環

如果你使用了支持 ES6 標準的瀏覽器或 JavaScript 運行環境，你還可以使用 for...of 循環來遍歷 JSON 數組。

for (var student of response.students) {
console.log(student.name + "，" + student.age + "歲，成績：" + student.grade);
}

上面的代碼同樣會輸出相同的結果。

在這個例子中，我們使用了一個 for...of 循環來迭代 JSON 數組students中的每個元素。循環的每次迭代都會將當前元素的值存儲在變量student中。

通過上述演示，我們可以看到 AJAX 在處理 JSON 數據時的靈活性和便利性。使用不同的方法，我們可以根據實際需求遍歷 JSON 數據。

無論是使用傳統的 for 循環，還是使用forEach()、$.each()或 for...of 循環，我們都能輕松地遍歷 JSON 數據，并獲取所需的信息。