如何获取 setTimeout 函数的结果？答案

【问题标题】：How to get the result of setTimeout function?如何获取 setTimeout 函数的结果？
【发布时间】：2020-07-03 12:29:49
【问题描述】：

问题代码是：

var result = 10;
function wait(time,f) {
  setTimeout(function() {
  result = f(result);
  }, time);
}

wait(500, function(x) {return x + 5})
wait(250, function(x) {return x * 2})

我认为结果是 30，但结果是 25（解决方案）。

为什么结果值为 25？

【问题讨论】：

result 变为 20，然后根据函数调用的时间变为 25

标签： javascript

【解决方案1】：

您安排了两个回调：

wait(500, function(x) {return x + 5}) // execute after 500ms
wait(250, function(x) {return x * 2}) // execute after 250ms

第一个参数是回调运行的时间。由于第二个wait 调用的第一个参数较低，因此它首先运行。

在 250 毫秒左右，由于 result 从 10 开始，x * 2 将 result 乘以 2，得到 20。

然后，在 500 毫秒左右，x + 5 运行，将您带到 25。

如果您希望能够执行此类操作以使代码看起来更按顺序运行，请改用 Promises 和 await：

let result = 10;
function wait(time,f) {
  return new Promise(resolve => setTimeout(() => {
    result = f(result);
    resolve();
  }, time));
}

(async () => {
  await wait(250, x => x * 2);
  await wait(250, x => x + 5);
  console.log(result);
})();

【讨论】：

我觉得奇怪的是，有些解析器不允许(function(){})()，只接受(function(){}())，而他们只接受(()=>{})()，而不接受(()=>{}())。知道为什么，@CertainPerformance？
所有现代解析器应该在这种情况下表现相同 - 规范中明确定义了那种基本语法。尽管如此，(function(){})() 应该可以正常工作（你有一个看起来没有的示例链接吗？）。 (function(){}()) 也应该始终有效。 (()=>{}()) 不会，因为an ArrowFunction cannot be on the LHS of a CallExpression。
我不记得是什么浏览器了，但我确实遇到了一个问题，几年前我不得不将 (function(){})() 更改为 (function(){}())。我当时很困惑。我认为这是一个浏览器错误，但仍然有问题，所以我只是更改了我的代码，然后它工作了。我实际上更喜欢外面的参数。对我来说更有意义。现在我会忘记我曾经遇到过这个问题，但我过去确实遇到过。

【解决方案2】：

如果您希望在 Edge 15 以下，这是一种向后兼容的方式来实现您想要的：

const delay = (()=>{
  let n = 0;
  return (time, func)=>{
    n += time; setTimeout(func, n);
    return delay;
  }
})();
let x = 10;
delay(500, ()=>{
  x += 5;
  console.log(x);
})(250, ()=>{
  x *= 2;
  console.log(x);
});

【讨论】：