如果没有解决承诺，那么在300ms后如何模拟承诺的结果？

Question

假设我们有一个返回不重要数据的请求。 如果我们的承诺自300毫秒以来仍未解决，我们希望获得模拟响应。

我们也有请求代码（例如）

function getNotImportantData() {
  return fetch("url").then((response) => response.json());
}

我们能做什么？

PS：可以使用es6 +

Answer 1

好吧，在这种情况下，我们可以使用标准的Promise API。

让我们逐步进行：

1. 我们可以做出另一个保证，即保证在约300毫秒内通过模拟有效载荷解决

const mockPromise = new Promise((resolve) => {
  setTimeout(() => {
    resolve([]); // any payload, here is empty array for example
  }, 300);
});

2. 我们也可以使用Promise.race方法检测谁解决了第一个

function getNotImportantData() {
  return fetch("url").then((response) => response.json());
}

const mockPromise = new Promise((resolve) => {
  setTimeout(() => {
    resolve([]); // any payload, here is empty array for example
  }, 300);
});

Promise.race([
  getNotImportantData(),
  mockPromise,
]);

3. 最后，我们可以将代码包装为有用的功能

function getNotImportantData() {
  return fetch("url").then((response) => response.json());
}

function tryOrMock(promise, mock, timeout) {
  const mockPromise = new Promise((resolve) => {
    setTimeout(() => {
      resolve(mock);
    }, timeout);
  });

  return Promise.race([
    promise,
    mockPromise,
  ]);
}

tryOrMock(getNotImportantData(), [], 300)
  .then((firstResult) => {
    console.log(firstResult);
  })
  .catch((error) => {
    // don't forget to handle exceptions
  })

// or async/await syntax

try {
  const firstResult = await tryOrMock(getNotImportantData(), [], 300);
} catch (e) {
  // handle exceptions here too
}

我在这里引用了Promise.race文档