学习Promise,这些知识点就够了

前端三疯

已于 2022-11-26 08:09:39 修改

阅读量323

点赞数 1

分类专栏： JS 文章标签： javascript

于 2021-07-28 19:47:58 首次发布

本文链接：https://blog.csdn.net/sanfeng_hu/article/details/119188460

版权

本文详细介绍了Promise的用法、本质、常见误区、then链式调用、异常处理、静态方法、并行执行和时序问题，以及async/await的使用，帮助读者全面理解Promise和异步编程。

摘要由CSDN通过智能技术生成

前言

回调函数是所有异步函数的根基（JavaScript运行模式）。但是直接使用回调函数方式去完成复杂的异步流程无法避免回调嵌套问题，甚至会出现回调地狱问题。

Commons社区率先提出Promise规范，在ES2015中被标准化成规范。本质上Promsie是一个类，根据内部状态去进行成功或失败操作，而且状态状态是不可逆的。

用法

promise对象是通过new Promise(arg) 而来，对于传递的arg参数是由要求的，arg是处理器函数，这个处理器函数有接受两个函数作为参数–resolve和reject,通过调用resolve函数将promise的状态变为fulfilled,通过调用reject函数将状态变为rejected。请添加图片描述

let promise = new Promise((resolve, reject)=>{
	resolve(10);
	// reject(new Error("promsie error"))
})

当状态改变时，会自定调用then 方法中我们定义好的成功回调或失败回调,并能拿到promise传递的值。

promise.then((val)=>{
	console.log(val)
},(error)=>{
	console.log(err)
})

使用promise封装ajax的例子

function ajaxPromise(url) {
    return new Promise((resolve, reject) => {
        let xhr = new XMLHttpRequest()
        xhr.open('GET', url)
        xhr.responseType = 'json'
        xhr.onload = function () {
            if (this.status == 200) {
                resolve(this.response)
            } else {
                reject(new Er