在前端開發中，我們經常需要攔截請求來進行一些特殊的處理，這個時候 JavaScript 就非常有用了。JavaScript 攔截請求就是通過編寫一段 JavaScript 代碼，來監控網絡請求，并在必要的時候對這些請求進行攔截、修改或重定向。本文就來詳細介紹下 JavaScript 是如何實現攔截請求的。

這里我們以XMLHttpRequest對象為例來說明。XMLHttpRequest 是 JavaScript 中的一個重要的網絡請求 API。通過對XMLHttpRequest.open函數進行重寫，我們可以對瀏覽器的 HTTP 請求進行攔截和修改。

// 重寫 open 函數來攔截HTTP請求
var _open = XMLHttpRequest.prototype.open;
XMLHttpRequest.prototype.open = function (method, url, async, user, pass) {
console.log('攔截到請求：', method, url);
return _open.apply(this, arguments);
}

上面的代碼中，我們通過重寫XMLHttpRequest對象的open方法，對所有HTTP請求進行監聽。在重寫的open方法中，我們先打印出請求的HTTP方法和URL，然后再調用XMLHttpRequest的原始open方法。

上述方法通過攔截請求的方式，來實現對 HTTP 請求的監控。如果我們希望中斷請求，直接返回一個自定義響應，該怎么辦呢？我們可以再次對XMLHttpRequest的send方法進行攔截，如下：

// 重寫 send 函數來中斷HTTP請求
var _send = XMLHttpRequest.prototype.send;
XMLHttpRequest.prototype.send = function (body) {
console.log('Abort request.');
this.abort();
}

在上面的代碼中，我們通過重寫XMLHttpRequest.send() 方法，實現了對 HTTP 請求的中斷。當然，我們可以將其擴展，自定義響應：

// 重寫 send 函數來返回自定義響應
XMLHttpRequest.prototype.send = function (body) {
console.log('Custom response.');
this.respond(200, { 'Content-Type': 'text/plain' }, 'Hello, World!');
}

在上面的代碼中，我們通過XMLHttpRequest.prototype.respond() 方法來返回自定義響應。第一個參數是狀態碼，第二個參數是響應頭，第三個參數是響應內容。

除了對 XMLHttpRequest 進行攔截以外，還有一個比較好用的庫，那就是 axios。axios 是一個基于 Promise 的 HTTP 客戶端，可以在瀏覽器和 Node.js 中使用。下面我們以 axios 為例，演示如何在瀏覽器中攔截 HTTP 請求。

// 通過攔截器來實現 HTTP 請求的攔截
axios.interceptors.request.use(function (config) {
console.log('攔截到請求：', config.method, config.url);
return config;
}, function (error) {
return Promise.reject(error);
});
axios.interceptors.response.use(function (response) {
console.log('響應內容：', response.data);
return response;
}, function (error) {
return Promise.reject(error);
});

在上面的代碼中，我們使用 Axios 提供的攔截器，對 HTTP 請求進行了監聽。在請求之前和請求之后分別進行了處理。請求前我們可以訪問配置信息，請求后可以訪問響應內容。

總之，在 JavaScript 中實現 HTTP 請求的攔截，可以通過監聽 XMLHTTPRequest 和 axios 的攔截器實現。只需要在合適的時間戳進行覆寫即可。攔截器可以通過設置request、response屬性實現攔截所有請求。