javascript - 什么是异步 javascript 函数的简单示例？

Question

我在这里真的很难掌握编写异步 JavaScript。您能否提供一个简单的 JavaScript 函数示例，该函数是用纯 JavaScript 异步编写的（不使用 Node.js 或 JQuery）

Answer 1

JavaScript 本身是同步的和单线程的。你不能写异步函数；普通 JS 没有计时 API。并行线程不会有副作用。

您可以做的是使用您的环境（Node.js、Webbrowser）提供的一些 API，这些 API 允许您安排异步任务 - 使用超时、ajax、FileAPI、、、requestAnimationFrameWebWorkers nextTick、DOM 事件等等。

使用示例setTimeout（由HTML Timing API提供）：

window.setTimeout(function() {
    console.log("World");
}, 1000);
console.log("Hello");

---

更新：由于 ES6 有作为异步原语内置到纯 JavaScript 中的承诺，所以你可以这样做

 Promise.resolve("World").then(console.log); // then callbacks are always asynchronous
 console.log("Hello");

但是，当您无法等待（例如超时）时，它们本身并没有真正的帮助。而且它们也不会改变线程模型的任何内容，所有执行都是运行到完成，没有任何事件在中途干扰。

Answer 2

这是异步的：

setTimeout(function(){
   console.log('1');
}, 2000);

console.log('2');

2 会在 1 之前写入控制台。因为 setTimeout 是异步的。

Answer 3

这是一个非常简单的例子：

for (var i = 0; i < 10; i++) {
  window.setTimeout(function() {
    console.log(i);
  }, 2000);
}

您可能希望这些console.log()调用向您显示0, 1, 2等，如以下代码段所示：

for (var i = 0; i < 10; i++) {
  console.log(i);
}

但实际上只有10s 会被打印出来！传递给setTimeout函数的函数（作为它的“回调”参数）将在循环完成后 for调用的原因 - 即，在i值设置为 10 之后。

然而你应该明白一件事：浏览器中的所有 JavaScript 都在一个线程上执行；异步事件（例如鼠标点击和计时器）仅在执行队列中有空位时运行。这是John Resig 写的一篇关于这个主题的精彩文章。