Javascript - 延迟 Promise 解析

Question

我有一项服务，可以产生一些确认警报并等待用户交互，由 Promise 管理。

如果在用户回答第一个确认警报之前生成了新的确认警报，则服务会将其存储在一种“等待列表”中，并在用户取消前一个确认警报后立即显示它

let waitList = []
let activeAlert = null;

function createAlert(){
   if(!activeAlert){
       let pr = new Promise((resolve, reject) => {
           // do stuff to show the alert
           if('user click ok') resolve();
           else reject();
       });
       activeAlert = pr;
       return pr;
   }
   else {
       let p = new Promise();
       waitList.push(p);
       return p;
   }
}

let alert = createAlert();
alert.then(()=>{
    // the user clicked OK
}).catch(()=>{
    // the user click CANCEL
});

let alert2 = createAlert();
alert2.then(()=>{
    // the user clicked OK on the second one
}).catch(()=>{
    // the user click CANCEL on the second one
});

我知道 Promise 反模式的概念，并且 Defer 对象已被弃用并被认为已过时。我无法理解如何为保存在数组中的 Promise 定义“解决”和“拒绝”条件。

Answer 1

如果不先保存一些引用，则无法从 promise 范围之外解析 promise 。如果您想从数组外部解决它们，您还应该将相关的解析和拒绝回调推送到对象中，以便可以从该范围之外使用它们。 例如:

let myRefHolder = {};
let toResolve = new Promise((res, rej) => {
    myRefHolder.resolutionCallback = res;
    //other code
});

然后在偶数处理程序中:

clickHandler = () => {
    myRefHolder.resolutionCallback(resolutionValue);
    //other code
}

然后你只需要稍微改变这个结构来适应你所有的 promise 和回调......而不是 myRefHolder对象，你可以有一个形状像 myRefHolders 的对象数组，每个 Promise 一次!

另一种方法是直接在 Promise 中分配按钮事件处理程序:

new Promise((rej, res) => yourButtonElement.addEventListener(‘click’, res));

当您点击按钮时，这个问题就会得到解决。除了 ref 之外，您还可以传递一个具有更复杂逻辑的更复杂的内联函数。 由于一个事件可以有多个处理程序，因此您可以继续为每个 Promise 添加该事件 - 但这可能会变得困惑，因为您必须在实际解决 Promise 之前删除监听器(我使用的示例 1 行代码可能会这样)泄漏内存，因为该处理程序保持事件状态，并阻止垃圾收集器释放 Promise 内存)

如果您问的是我如何然后/捕获一系列 promise 中的特定 promise ，那么就像 myArray[index].then(() => {}) 一样简单 如果您正在等待一系列 promise ，就像 Promise.all(myArray) 一样简单