重新激活时强制重置承诺答案

【问题标题】：Force reset promise when re-activated重新激活时强制重置承诺
【发布时间】：2021-12-04 00:59:27
【问题描述】：

我正在尝试使用一个异步功能，如果它被召回，它会重置。该函数链接多个按钮，触发一个div作为通知覆盖框。

我想，当 callAlert() 函数再次被调用时，它会重置 clearAlert() 的超时时间。我尝试在调用 newAlert 时增加 1500 毫秒，但我假设当单击任何按钮（触发 callAlert()）时，它已经移到 clearAlert() 承诺上。要么这样，要么我的等待时间越来越长。

任何建议都会很棒。

let alertActive = false;
let alertCd = 0;

function newAlert(){
    return new Promise((resolve,reject)=>{
        setTimeout(()=>{
            alert_pop.classList.remove("alert_pop");
            alertActive=true;
            alertCd = 1500
            resolve();
        } , 100);
    });
}

function clearAlert(){
    return new Promise((resolve,reject)=>{
        setTimeout(()=>{
            alert_pop.classList.add("alert_pop");
            alert_string.innerHTML="";
            resolve();
         } , alertCd);
         alertActive=false;
    });
}

async function callAlert(){
        await newAlert();
        await clearAlert();
}

【问题讨论】：

1.保存 timeoutID returned by setTimeout()。 2. 任何时候需要创建一个新的警报，cancel the last timer using clearTimeout()，然后创建一个新的超时。 3.如果你需要取消现有的定时器（根据描述，你不需要），使用clearTimeout()。
clearTimeout() 会完成 clearAlert() 上的承诺吗？
不会。 ……需要吗？ clearAlert() 创建自己的 Promise 并尝试设置自己的超时，我不知道为什么。您应该更改 clearAlert() 以不返回 Promise。它不需要一个。首先，在newAlert() 中，将活动Promise 中的resolve 或reject 保存到clearAlert() 可以访问的范围内。然后，在clearAlert() 中，调用clearTimeout() 和resolve() 或reject()（取决于您要执行的操作）。
已更新至此，它似乎可以解决问题 - 谢谢！您能否将其发布为答案，以便我将其标记为已回答？
啊哈；是的，我是。通过排除简单的问题，将其他人的问题作为自己的学习经验。

标签： javascript asynchronous promise

【解决方案1】：

创建一个可重置的计时器

如果你想创建一个可以重置的计时器，

保存setTimeout()返回的timeoutID。
任何时候需要创建新的警报，使用clearTimeout() 取消最后一个计时器，然后创建一个新的超时。

取消定时器

如果您需要取消现有计时器，请使用clearTimeout()。现在，clearAlert() 创建了自己的 Promise 并尝试设置自己的超时时间。您应该更改 clearAlert() 以不返回 Promise（至少目前是这样。看起来您可能试图延迟取消）。

首先，在newAlert() 中，将活动Promise 中的resolve 或reject 保存到clearAlert() 可访问的范围内。然后，在clearAlert() 中调用clearTimeout() 和resolve() 或reject()（取决于您要执行的操作）。

【讨论】：

当取消计时器时，你不应该离开未解决的承诺。最好拒绝它。
@Bergi 同意了。我认为这是最后一段

【解决方案2】：

为确保 JavaScript 函数不会每隔几秒调用一次以上，您可以将其包装在 lodash 中提供的“去抖动”函数中。

这里有一个很好的解释example。

【讨论】：

同意，这确实是一个去抖功能