在 JavaScript 中同步使用 setTimeout

Question

我有以下场景：

setTimeout("alert('this alert is timedout and should be the first');", 5000);
alert("this should be the second one");

我需要在执行setTimeout中的代码之后执行setTimeout之后的代码。由于 setTimeout 之后的代码不是我自己的代码，我无法将其放入 setTimeout 中调用的函数中...

有什么办法解决这个问题吗？

Answer 1

代码是否包含在函数中？

function test() {
    setTimeout(...);     

    // code that you cannot modify?
}

在这种情况下，您可以阻止该函数进一步执行，然后再次运行它：

function test(flag) {

    if(!flag) {

        setTimeout(function() {

           alert();
           test(true);

        }, 5000);

        return;

    }

    // code that you cannot modify

}

Answer 2

上周我遇到了需要类似功能的情况，这让我想到了这篇文章。基本上我认为@AndreKR 提到的“忙等待”在很多情况下都是一个合适的解决方案。下面是我用来占用浏览器并强制等待条件的代码。

function pause(milliseconds) {
	var dt = new Date();
	while ((new Date()) - dt <= milliseconds) { /* Do nothing */ }
}

document.write("first statement");
alert("first statement");

pause(3000);

document.write("<br />3 seconds");
alert("paused for 3 seconds");

请记住，此代码实际上会阻止您的浏览器。
希望它对任何人都有帮助。

Answer 3

使用 ES6 和承诺与承诺async 你可以实现同步运行。

那么代码在做什么呢？

// 1. Calls setTimeout 1st inside of demo then put it into the webApi Stack
// 2. Creates a promise from the sleep function using setTimeout, then resolves after the timeout has been completed;
// 3. By then, the first setTimeout will reach its timer and execute from webApi stack. 
// 4. Then following, the remaining alert will show up.


function sleep(ms) {
  return new Promise(resolve => setTimeout(resolve, ms));
}

async function demo() {
  setTimeout("alert('this alert is timedout and should be the first');", 5000);
  await sleep(5000);
  alert('this should be the second one');
}
demo();

Answer 4

只需将其放入回调中即可：

setTimeout(function() {
    alert('this alert is timedout and should be the first');
    alert('this should be the second one');
}, 5000);

Answer 5

不可以，由于 Javascript 中没有延迟功能，因此除了忙等待（这会锁定浏览器）之外没有其他办法可以做到这一点。

Answer 6

您可以创建一个承诺并等待其履行

const timeOut = (secs) => new Promise((res) => setTimeout(res, secs * 1000));

await timeOut(1000)

Answer 7

ES6（忙等待）

const delay = (ms) => {
  const startPoint = new Date().getTime()
  while (new Date().getTime() - startPoint <= ms) {/* wait */}
}

用法：

delay(1000)

Answer 8

这是在代码中进行同步延迟的好方法：

async function yourFunction() {
  //your code
  await delay(n);
  //your code
}

function delay(n) {
  n = n || 2000;
  return new Promise(done => {
    setTimeout(() => {
      done();
    }, n);
  });
}

在这里找到它 在 JavaScript 中同步延迟执行而不使用循环或超时的正确方法！

Answer 9

setTimeout(function() {
  yourCode();    // alert('this alert is timedout and should be the first');
  otherCode();   // alert("this should be the second one");
}, 5000);

Answer 10

我认为你必须做出承诺，然后使用 .then() ，以便你可以将你的代码链接在一起。你应该看看这篇文章 https://developers.google.com/web/fundamentals/底漆/承诺

Answer 11

您可以尝试用自己的函数替换 window.setTimeout ，就像这样，

window.setTimeout = function(func, timeout) {
    func();
}

这可能会或可能根本无法正常工作。除此之外，您唯一的选择是更改原始代码（您说您不能这样做）

请记住，像这样更改本机函数并不是一个非常理想的方法。