javascript - 在for循环中从函数返回分配的变量？

Question

让我们以此为例:

function test(i, total) {
    return total + i * 100 / 999 * -124 / 333;
}
var total = 0;
for (var i = 0; i <= 100; i++) {
    total = test(i, total);
    console.log(total);
}

在测试它时，我发现它是同步工作的——for 循环将等到 test(i, total) 返回它的值，然后再进行下一次迭代。

然而，在其他情况下，循环会继续进行甚至结束，甚至在函数完成其功能之前。如果测试函数需要 3 秒才能返回，为什么循环会等待它？是因为测试函数中没有任何异步性质吗？我尝试在测试函数中将 setTimeout 设置为 3 秒，然后我从控制台日志中得到 undefined。

Answer 1

"If the test function took 3 seconds to return, why does the loop wait on that? Is it because there is nothing of async nature in the test function?"

没错。函数的执行在 Javascript 中是同步的，就像在几乎所有其他语言中一样。执行是沿着单一路径完成的，因此当您调用一个函数时，它会在返回之前完成，并且调用之后的代码可以继续。

如果您在函数中使用异步代码(例如使用 setTimeout)，那么异步代码将被搁置，直到其余代码执行完毕并且浏览器取回控制权，因为 Javascript 是单线程的。

如果您在循环中调用 test 101 次并且每次都使用 setTimeout，那么在循环完成时有 101 段代码等待运行。这 101 段代码只有在循环完成后才能运行。您搁置的代码无法提供从函数返回的值，因为函数在代码运行之前返回。

要异步运行代码，您可以使用在函数完成时调用的回调。示例:

function test(i, callback) {
  window.setTimeout(function(){
    var result = i * 100 / 999 * -124 / 333;
    callback(result);
  }, 1000);
}

var total = 0;
var resultCount = 0;
for (var i = 0; i <= 100; i++) {
  test(i, handleCallback);
}

function handleCallback(value) {
  total += value;
  resultCount++;
  if (resultCount == 101) {
    console.log(total);
  }
}

演示:http://jsfiddle.net/7VgWV/