为什么我不能在 window.alert() 之前清除电子邮件字段？

Question

我想在 alert() 出现在屏幕上之前清除输入类型 =“电子邮件”（通过单击按钮）。我只是使用一个在 20 毫秒内解决的承诺来实现这一点。但是为什么如果我删除第 11 行（promise 行）它就停止工作了？正在执行的命令不是同步的，因此它们应该按顺序执行？ （如果我在胡说八道，请纠正我，我还在学习异步 js）

第 11 行在这里：https://codepen.io/layige5800/pen/zYmEaQe

await new Promise(resolve => setTimeout(resolve, 20));  // only with this line I can make the input be emptied before the alert appears

Answer 1

window.alert

暂停主线程。这意味着当警报打开时，不会运行其他代码。因此，当您告诉浏览器清除输入时，它不会立即出现（重新绘制）（见下文），并且在此期间会打开警报，这会导致浏览器停止执行其他所有操作。通过添加

setTimeout

（你不需要

Promise

）你基本上是在创建警报之前给浏览器时间来完成DOM更新/绘画（清除电子邮件）。

现在，你可能会问这在 JS 中怎么可能，通常是单线程程序。 这是一篇博客文章，它准确地解释了您的情况（请参阅“使 DOM 更新看起来异步 w/

alert()

”部分。