用Promise对象实现的 Ajax

简介: 用Promise对象实现的 Ajax
const getJSON = function(url) {
    const promise = new Promise(function(resolve, reject) {
        const handler = function() {
            if (this.readyState !== 4) {
                return;
            }
            if (this.status === 200) {
                resolve(this.response);
            } else {
                reject(new Error(this.statusText));
            }
        };
        const client = new XMLHttpRequest();
        client.open("GET", url);
        client.onreadystatechange = handler;
        client.responseType = "json";
        client.setRequestHeader("Accept", "application/json");
        client.send();
    });
    return promise;
};
getJSON("/posts.json").then(function(json) {
    console.log('Contents: ' + json);
}, function(error) {
    console.error('出错了', error);
});

上面代码中,getJSON是对 XMLHttpRequest 对象的封装,用于发出一个针对 JSON 数据的 HTTP 请求,并且返回一个Promise对象。需要注意的是,在getJSON内部,resolve函数和reject函数调用时,都带有参数。

相关文章
|
1月前
|
数据采集 前端开发 JavaScript
如何在爬虫过程中正确使用Promise对象和async/await?
如何在爬虫过程中正确使用Promise对象和async/await?
48 2
|
1月前
|
设计模式 前端开发 JavaScript
|
1月前
|
XML JSON 前端开发
学习Ajax使用异步对象发送请求
Ajax,全称Asynchronous JavaScript and XML(异步JavaScript和XML),是一种用于创建更好、更快以及交互性更强的Web应用程序的技术。
27 3
|
1月前
|
前端开发 JavaScript API
Promise 对象与 Promises/A+ 规范
Promise 对象与 Promises/A+ 规范
41 0
|
1月前
|
前端开发 JavaScript 数据处理
JavaScript中的异步编程及Promise对象
【2月更文挑战第3天】 传统的JavaScript编程模式在处理异步任务时常常会导致回调地狱和代码可读性较差的问题,而Promise对象的引入为解决这一问题提供了一种优雅的解决方案。本文将介绍JavaScript中的异步编程方式以及Promise对象的使用方法和优势,帮助读者更好地理解和运用异步编程技术。
27 8
|
1月前
|
XML 前端开发 JavaScript
AJAX - 创建 XMLHttpRequest 对象
AJAX - 创建 XMLHttpRequest 对象
|
1月前
|
前端开发 算法
2723. 两个 Promise 对象相加
2723. 两个 Promise 对象相加
25 0
|
1月前
|
XML 前端开发 JavaScript
AJAX - 创建 XMLHttpRequest 对象
AJAX - 创建 XMLHttpRequest 对象
|
1月前
|
XML JSON 前端开发
AJAX 中创建 XMLHttpRequest 对象的方法和常用属性、方法
AJAX 中创建 XMLHttpRequest 对象的方法和常用属性、方法
46 0
|
1月前
|
存储 前端开发
PROMISE解决AJAX中的串行和并行
PROMISE解决AJAX中的串行和并行
33 0