经典面试题 手写Promise.all

902 阅读1分钟

手写Promise.all

首先来聊一聊Promise的3个方法all、allSettled、race的区别。

共同点: 都是将多个Promise组合返回成一个Promise。

不同点: 简单来说就是race是谁先返回谁先输出,all是只要有一个没有返回成功那么就请求失败,allSettled是不管你是否成功都给你返回回来并且带上每个Promise的状态。

    // 先定义3个模拟接口的函数
    const fn1 = () => {
      return new Promise((resolve, reject) => {
         resolve(111111);
      });
    };
    const fn2 = () => {
      return new Promise((resolve, reject) => {
        resolve(22222);
      });
    };
    const fn3 = () => {
      return new Promise((resolve, reject) => {
        resolve(33333);
      });
    };

根据all的特性可以知道 当有一个失败的时候就会整个返回失败,我们用一个数组用来记录每一次成功调用的值,在遍历调用的时候当请求失败立即抛出错误不执行后面的代码,假如遍历到最后一个Promise也成功的话就会resolve出所有的数据。

完整代码

    const PromiseAll = (d = []) => {
      return new Promise((resolve, reject) => {
        const result = [];
        d.forEach((v, i) => {
          v.then((res) => {
            result.push(res);
            if (result.length === d.length) {
              resolve({
                state: true,
                data: result,
                message: null,
              });
            }
          }).catch((res) => {
          // 当请求错误的时候直接抛出错误
            reject({
              state: false,
              data: null,
              message: '请求失败了',
            });
          });
        });
      });
    };

抛砖引玉,感兴趣的小伙伴可以试试race与allSettled