获取请求反应 - Javascript

在Web开发过程中，页面往往需要通过请求数据来完成相关功能，而获取请求反应则是实现这一功能的重要步骤。在Javascript中，我们可以使用XMLHttpRequest或fetch API来获取请求反应。

XMLHttpRequest

XMLHttpRequest提供了一种在客户端与服务器交换数据的途径，具有实时更新页面的能力。通过XMLHttpRequest，我们可以发送GET或POST请求，接受来自服务端的反应。

发送请求

我们可以使用XMLHttpRequest的open方法来打开请求链接，并使用send方法来发送请求。

let xhr = new XMLHttpRequest();
xhr.open("GET", "https://example.com/api/data");
xhr.send();

在上面的代码示例中，我们创建了XMLHttpRequest实例，并使用open方法打开了GET请求链接。然后，我们使用send方法发送请求。

处理反应

在发送请求后，我们需要使用onreadystatechange事件和readyState属性来检测XMLHttpRequest的状态，并使用responseText属性获取服务器的响应内容。

let xhr = new XMLHttpRequest();
xhr.open("GET", "https://example.com/api/data");
xhr.onreadystatechange = function() {
  if (this.readyState === 4 && this.status === 200) {
    console.log(this.responseText);
  }
};
xhr.send();

在上面的代码示例中，我们使用onreadystatechange事件来监听XMLHttpRequest的状态变化。当readyState为4（操作完成）且状态码为200（成功）时，我们打印XMLHttpRequest的responseText属性。

fetch API

fetch API提供了一种更现代化的方式来获取请求反应，它可以直接返回Promise对象，更加易于使用。

发送请求

我们可以使用fetch API的fetch方法来发送请求，并将请求设置为GET或POST请求。

fetch("https://example.com/api/data")
  .then(function(response) {
    return response.json();
  })
  .then(function(data) {
    console.log(data);
  });

在上面的代码示例中，我们使用fetch方法发送了GET请求，并使用then方法来处理返回的Promise对象。在then中，我们首先将响应的数据转换成json格式，然后打印该数据。

处理反应

fetch API的反应处理方式与XMLHttpRequest的反应处理方式类似，我们可以在then方法中处理反应数据。

fetch("https://example.com/api/data")
  .then(function(response) {
    return response.text();
  })
  .then(function(data) {
    console.log(data);
  });

在上面的代码示例中，我们使用then方法来处理反应数据。首先，我们将响应数据转换成文本格式，然后打印该数据。

结论

通过XMLHttpRequest或fetch API，我们可以轻松获取请求反应。需要注意的是，在使用XMLHttpRequest时，我们需要使用onreadystatechange事件来处理反应数据。而fetch API则使用Promise对象方便了反应数据的处理。