Promise

更新: 2025/3/26 18:47:45 字数: 0 字

理解

  Primise 的出现统一了 JS 中的异步实现方案。

  理解: Promise 是异步编程的一种解决方案，是 js 中处理异步操作的一种模式， 他提供了一套更优雅的方式来处理异步代码，尤其是处理回调地狱问题，Promise 的链式操作见底了编码的难度， 代码可读性更加清晰。

  三种状态： Promise 有三种状态，pending、fulfilled、rejected。
   pending(进行中): 初始状态，表示一个异步操作尚未完成。
   fulfilled(已完成): 表示异步操作成功完成。
   rejected(已失败): 表示异步操作失败。
   该对象的状态不受外部的影响，只有异步操作的结果，可以确定当前是哪一种状态，一段状态改变就无法再 变，从进行中--->已完成/已失败

手写 Promise

手写 Promise.all

/**
 * 自己写的 Promise.all 方法
 * @param promises 传入参数 是可迭代对象
 */
Promise.myAll = (promises) => {
    let _resolve, _reject;
    const resultPromise = new Promise((resolve, reject) => {
        // 记录函数
        _resolve = resolve;
        _reject = reject;
    })
    // 处理我们传入的参数
    const resultData = [];
    let fullCount = 0; // 完成的 promise 的数量
    let i = 0;
    let count = 0; // 记录可迭代对象的元素长度
    for(const p of promises){
        // 不论 p 是什么类型，都统一处理成 Promise
        const index = i;
        i++;
        count++;
        Promise.resolve(p).then((res) => {
            // 处理成功的结果我们需要收集起来
            // 保持返回结果的顺序
            resultData[index] = res
            fullCount++;
            if(fullCount === count){
                _resolve(resultData)
            }
        }, _reject)
    }
    // 无可迭代对象的情况，直接返回
    if(count === 0){
        _resolve(resultData)
    }
    return  resultPromise
}


Promise.all([1, 2, 3, Promise.reject(21)]).then((res) => {
    console.log(res);
}, (err) => {
    console.log(err);
});

Promise 和 async/await

区别

1. 使用语法不同:promise 是 then 链式调用，async/await 是 await 语法。
2. 错误处理方式不同:promise 使用 .catch()，async/await 使用 try/catch。
3. 处理并发能力不同:promise 可以使用 Promise.all() 并发处理多个请求，async/await 不支持并发处理，只能串行执行异步操作。