用promise封装ajax

最新推荐文章于 2024-03-25 09:39:58 发布

weixin_34400525

最新推荐文章于 2024-03-25 09:39:58 发布

阅读量57

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/zhangbs/p/9674826.html

本文介绍了一个使用原生JavaScript实现的自定义Ajax函数。该函数通过传入配置参数，利用XMLHttpRequest发起GET请求，并返回Promise对象来处理异步操作。文章详细解释了readyState和status的作用，以及如何根据不同状态调用resolve或reject。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

首先贴代码

 1 var ajaxOptions = {
 2     url: 'url',
 3     method: 'GET',
 4     async: true,
 5     data: null,
 6     dataType: 'text',
 7 }
 8 
 9 function ajax(protoOptions) {
10     var options = {};
11 
12     for(var i in ajaxOptions){
13         options[i] = protoOptions[i] || ajaxOptions[i];
14     }
15     
16 
17     return new Promise(function(resolve, reject){
18         var xhr = new XMLHttpRequest();
19 
20         xhr.open(options.method, options.url, options.async);
21 
22         xhr.onreadystatechange = function() {
23             if (this.readyState === 4 && this.status === 200) {
24                 resolve(this.responseText, this);
25             } else {
26                 var resJson = {
27                     code: this.status,
28                     response: this.response
29                 }
30                 reject(resJson, this)
31             }
32         }
33 
34         xhr.send()
35 
36     })
37 }