Promise - 在多个事件后解决

Question

我正在使用 Promise 异步连接到 API。 API 发出两个事件：connected 和 socketConnected。

根据我的connect() 函数，我想等待这两个事件触发。

connect() {
  return new Promise((resolve,reject)=>{
    this._client.on('connected', resolve);
    this._client.on('socketConnected', resolve);
    setTimeout(reject, 5000);
  }
}

但是，您只能解决一次，我希望这两个事件在 promise 解决之前触发。我该如何设置它以使其行为如此？

Answer 1

您需要使用Promise.all 创建两个 承诺，每个事件一个，当两者都解决时 - 当Promise.all 解决时 - 您可以解决connect 返回的承诺：

connect() {
  return new Promise((resolveAll, rejectAll) => {
    Promise.all([
      new Promise(res1 => this._client.on('connected', res1)),
      new Promise(res2 => this._client.on('socketConnected', res2))
    ]).then(resolveAll);
    setTimeout(rejectAll, 5000);
  });
}

如果您希望尽快进行垃圾回收，您还可以在 Promise.all 解析时清除超时：

connect() {
  return new Promise((resolveAll, rejectAll) => {
    const rejectTimeout = setTimeout(rejectAll, 5000);
    Promise.all([
      new Promise(res1 => this._client.on('connected', res1)),
      new Promise(res2 => this._client.on('socketConnected', res2))
    ]).then(() => {
      clearTimeout(rejectTimeout);
      resolveAll();
    });
  });
}

Answer 2

我是可重用代码的粉丝 - 如果你发现自己想要让 Promise 超时，那么为什么不编写一个函数来这样做

const promiseTimeout = (promise, timeout) => {
    let timer;
    return Promise.race([
        promise, 
        new Promise((_, reject) => (timer = setTimeout(reject, timeout, promiseTimeout.symbol)))
    ])
    .then(result => (clearTimeout(timer), result));
};
promiseTimeout.symbol = Symbol('timeout');

现在，您可以在需要为承诺设置时间限制的任何地方使用它

在这种情况下，正如已经观察到的那样，您的逻辑需要 两个 承诺，包装在 Promise.all 中，这就是您的一个承诺，当两个承诺都解决时会解决

即

const promise = Promise.all([
    new Promise(resolve => this._client.on('connected', resolve)),
    new Promise(resolve => this._client.on('socketConnected', resolve))
]);

现在，结合这两个代码sn-ps

const promiseTimeout = (promise, timeout) => {
    let timer;
    return Promise.race([
        promise, 
        new Promise((_, reject) => (timer = setTimeout(reject, timeout, promiseTimeout.symbol)))
    ])
    .then(result => (clearTimeout(timer), result));
};
promiseTimeout.symbol = Symbol('timeout');

function connect() {
    const promise = Promise.all([
        new Promise(resolve => this._client.on('connected', resolve)),
        new Promise(resolve => this._client.on('socketConnected', resolve))
    ]);
    return promiseTimeout(promise, 5000);
}

// if connect rejects with reason promiseTimeout.symbol, you can be sure it was because of the timeout

不过，在这种情况下，另一个答案更好，我只提供这个答案，以防你发现自己想要为承诺解决方案设置时间限制