AJAX 是一種在網頁上實現異步數據交互的技術，而 REST（Representational State Transfer）是一種設計風格，用于構建網絡應用程序接口（API）。結合使用 AJAX 和 REST 接口，可以實現從網頁向服務端發送請求，獲取和更新數據，以及接收實時數據更新等功能。下面將以示例的方式介紹如何使用 AJAX 調用 REST 接口。

首先，我們假設有一個 REST 接口，用于獲取書籍信息。該接口以 HTTP GET 方法提供，接收一個書籍的 ID 作為參數，并返回對應的書籍信息。我們可以使用 AJAX 發送 GET 請求來調用該接口。

<script>
// 書籍 ID
var bookId = 123;
// 創建 XMLHttpRequest 對象
var xhr = new XMLHttpRequest();
// 監聽 AJAX 請求狀態變化
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
// 請求成功
var bookInfo = JSON.parse(xhr.responseText);
console.log(bookInfo);
}
};
// 發送 GET 請求
xhr.open('GET', '/api/books/' + bookId, true);
xhr.send();
</script>

以上代碼片段展示了使用 AJAX 調用 REST 接口的基本步驟。首先創建一個 XMLHttpRequest 對象，然后設置其 onreadystatechange 屬性為一個回調函數，該回調函數在 AJAX 請求狀態發生變化時被觸發。當 readyState 變為 4 且 status 為 200 時，表示請求成功。最后調用 open 方法設置請求方法和請求 URL，再調用 send 方法發送請求。

下面我們以另一個示例來說明如何使用 AJAX 調用支持更新數據的 REST 接口。假設有一個 REST 接口，用于更新書籍評論。該接口以 HTTP POST 方法提供，接收書籍 ID 和評論內容作為參數，并返回更新后的書籍信息。我們可以使用 AJAX 發送 POST 請求來調用該接口。

<script>
// 書籍 ID
var bookId = 123;
// 新的評論
var comment = '很好的書籍！';
// 創建 XMLHttpRequest 對象
var xhr = new XMLHttpRequest();
// 監聽 AJAX 請求狀態變化
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
// 請求成功
var updatedBookInfo = JSON.parse(xhr.responseText);
console.log(updatedBookInfo);
}
};
// 發送 POST 請求
xhr.open('POST', '/api/books/' + bookId + '/comments', true);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.send(JSON.stringify({ comment: comment }));
</script>

以上代碼展示了如何使用 AJAX 調用支持更新數據的 REST 接口。我們仍然創建一個 XMLHttpRequest 對象，并設置其 onreadystatechange 屬性為一個回調函數。然后調用 open 方法設置請求方法和請求 URL，并使用 setRequestHeader 方法設置請求頭，確保服務器能正確處理請求內容。最后，調用 send 方法發送請求，并將評論內容作為請求的主體數據。

綜上所述，通過 AJAX 可以方便地調用支持 REST 風格的接口。通過發送不同的 HTTP 請求（如 GET、POST、PUT、DELETE 等），并攜帶不同的參數，我們可以實現從服務端獲取數據、更新數據以及其他各種功能。這使得我們能夠更加靈活地構建與服務端交互的網頁應用。