Javascript：非阻塞回调（又一次）

Question

我不是经验丰富的开发人员，过去几天我一直在努力理解关于 Javascript 的一些基本概念。单线程，阻塞与非阻塞和回调。看了很多书还是一头雾水

我的理解是，在一个简单的JS代码中，所有的语句都是在一个线程中顺序执行的。在更复杂的情况下，有很长的运行语句（数据库调用、网络交互等），这可能是一个大问题。程序执行（下一条语句）被阻塞，直到当前（long 运行）语句完成。解决方案是实现一个异步模式，其中长运行语句在后台执行（我在这里可能是严重错误的！），同时执行下一个语句并且当长运行语句完成时，它使用调用语句中提供的回调函数传回其结果。

在这里和那里复制和粘贴代码我写了一段简单的代码，其中有一个回调函数

// function with callback    
function doSomething(callback) {
    callback();
}

// callback function implementation
function doSomethingElse() {
    document.write("<p>Second element in the page</p>");
}

doSomething(doSomethingElse);   
document.write("<p>First element in the page</p>");

这段代码的结果实际上是我在开始阅读非阻塞和回调（顺序代码执行）之前所期望的： - 第二要素 - 第一个元素

所以我的问题是，将我的代码转换为异步非阻塞代码的魔法仙尘是什么？

干杯，乔瓦尼

Answer 1

what's the magic fairy dust that transforms my code into asynchronous non-blocking one?

通常，大多数长运行操作将由 API 处理，这些 API 在比 JavaScript 更低的级别处理异步操作（用于发出 HTTP 请求的 XMLHttpRequest是一个典型的例子）。

如果您需要自己实现一个很长的运行函数（也许您想在客户端进行一些繁重的数字运算），那么您可以使用 Web Workers.

var myWorker = new Worker("find_prime_numbers.js");
myWorker.onmessage = function(e) {
  console.log('Next prime number is ' + e.data);
}

在find_prime_numbers.js中：

// Calculate some primes
postMessage(my_prime_number);

Answer 2

你使用了回调，但不代表这个调用是异步的。

它同步运行doSomething，它运行callback并输出"Second element"。

它将是异步的，如果您在那里有异步调用 - AJAX 调用、文件系统访问或简单的 setTimeout：

function doSomething(callback) {
  setTimeout(callback, 1000);
}

// callback function implementation
function doSomethingElse() {
  document.write("<p>Second element in the page</p>");
}

doSomething(doSomethingElse);   
document.write("<p>First element in the page</p>");

现在，它执行以下操作：运行 doSomething，然后运行 setTimeout，然后立即运行 doSomethingElse。同时setTimeout异步等待1秒后调用函数

在其他情况下，它可能是任何其他异步操作，需要时间才能完成。

Javascript：非阻塞回调（又一次）

Javascript: non-blocking callback (yet another time)

javascript

callback

blocking