写一个使用原生的 JavaScript 来封装 HTTP 请求

我可以给您一个简单的例子，它使用原生JavaScript封装HTTP请求：let request = new XMLHttpRequest();
request.open('GET', 'https://example.com/data.json', true);
request.onload = function () {
let data = JSON.parse(this.response);
// do something with data
}
request.send();

相关问题

使用原生JavaScript来封装ajax请求

非常欢迎您的提问！关于使用原生JavaScript来封装ajax请求，是一个很常见的问题。对于这个问题，我可以给您提供以下的思路和代码示例，帮助您更好地理解和实现：

思路：

1. 创建XMLHttpRequest对象
2. 设置请求参数，包括请求方法、请求URL、异步标识、请求头部等
3. 发送请求，并且设置回调函数，处理返回结果或者异常情况
4. 处理回调函数中的数据，例如更新页面、显示提示信息、打印日志等

代码示例：

function ajax(url, options) {
var xhr = new XMLHttpRequest();

xhr.onreadystatechange = function() {
if (xhr.readyState === XMLHttpRequest.DONE) {
if (xhr.status === 200) {
options.success(xhr.responseText);
} else {
options.error(xhr.status);
}
}
}

xhr.open(options.method, url, options.async);

for (var header in options.headers) {
xhr.setRequestHeader(header, options.headers[header]);
}

xhr.send(options.data);
}

// 使用示例
ajax('https://api.example.com/getData', {
method: 'GET',
async: true,
headers: {
'Content-Type': 'application/json'
},
data: null,
success: function(responseText) {
console.log(responseText);
},
error: function(status) {
console.error('ERROR: ' + status);
}
});

希望以上的思路和代码示例对您有所帮助！如果您有任何其他问题，也欢迎随时向我提问。

原生js封装异步ajax请求

当封装异步Ajax请求时，可以使用原生JavaScript的XMLHttpRequest对象来实现。下面是一个简单的示例：

function ajaxRequest(method, url, data, successCallback, errorCallback) {
  var xhr = new XMLHttpRequest();
  xhr.open(method, url, true);
  xhr.setRequestHeader('Content-Type', 'application/json');

  xhr.onload = function() {
    if (xhr.status === 200) {
      successCallback(xhr.responseText);
    } else {
      errorCallback(xhr.statusText);
    }
  };

  xhr.onerror = function() {
    errorCallback(xhr.statusText);
  };

  xhr.send(JSON.stringify(data));
}

上述代码中，`ajaxRequest`函数接受五个参数：

- `method`：请求方法，可以是GET、POST等。
- `url`：请求的URL地址。
- `data`：要发送的数据，作为请求的主体内容。
- `successCallback`：请求成功时的回调函数。
- `errorCallback`：请求失败时的回调函数。

使用示例：

ajaxRequest('GET', 'https://api.example.com/data', null, function(response) {
  console.log('请求成功:', response);
}, function(error) {
  console.error('请求失败:', error);
});

以上代码演示了一个GET请求的例子，你可以根据需要进行修改和扩展，例如支持其他请求方法、处理响应数据等。