「掌握Promise精髓」：巧妙解决并发请求，征服美团二面场景题！

前端

2024-01-23 05:56:25

美团二面场景题：「征服并发请求」

一开场，美团面试官就抛出一个棘手的问题：

场景： 现在提供10个id和请求函数（请求返回promise对象），要求你设置一个并发数（假设为3），同时发起请求，并按照请求返回的顺序打印结果。

问题： 你能实现这个功能吗？

作为一名技艺娴熟的程序员，你当然不能被这样的问题吓倒。你胸有成竹地回答：「没问题，我这就写代码实现。」

深入剖析：Promise的强大之处

为了解决这个问题，你首先要对Promise对象有深入的了解。Promise是一种用于处理异步操作的JavaScript对象。它可以让你将异步操作转换为同步操作，从而使你的代码更加清晰和易于管理。

Promise对象有三种状态：

Pending： 初始状态，表示操作尚未完成。
Fulfilled： 操作成功完成，并具有一个值。
Rejected： 操作失败，并具有一个错误原因。

你可以使用.then()方法来处理Promise对象。当Promise对象的状态变为Fulfilled时，.then()方法中的第一个函数就会被调用；当Promise对象的状态变为Rejected时，.then()方法中的第二个函数就会被调用。

巧妙构思：解决方案的步骤

有了对Promise对象的深刻理解，你开始构思解决方案。你意识到，你可以将10个请求分成3组，每组3个请求。然后，你可以使用Promise.all()方法来同时发起这3组请求。

const ids = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
const requestFunction = (id) => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve(id);
    }, Math.random() * 1000);
  });
};

const并发数 = 3;

const promises = [];
for (let i = 0; i < ids.length; i +=并发数) {
  promises.push(
    Promise.all(
      ids.slice(i, i +并发数).map((id) => requestFunction(id))
    )
  );
}

Promise.all(promises).then((results) => {
  results.forEach((result) => {
    console.log(result);
  });
});