试图使JavaScript回调正常运行而不阻塞

Question

试图更好地理解回调。...

我有此代码：

function receiveOrder(orderNo, callback) {
    console.log("Received order " + orderNo)
    callback(orderNo, orderReady);
}

function prepareFood(orderNo, callback) {
    console.log("Preparing order " + orderNo)
    for (i = 1; i < 500000000; i++) {} // just to wait a bit, not to use setTimeout
    callback(orderNo);
}

function orderReady(orderNo) {
    console.log("Order " + orderNo + " is ready");
}

receiveOrder(1, prepareFood);
receiveOrder(2, prepareFood);

现在它以阻塞方式输出：

Received order 1
Preparing order 1
Order 1 is ready
Received order 2
Preparing order 2
Order 2 is ready

如何获得它的工作方式：

Received order 1
Preparing order 1
Received order 2
Preparing order 2
Order 1 is ready
Order 2 is ready

感谢

Answer 1

感谢您的回答，所以这就是我使用setTimeout完成此工作的方式。

function receiveOrder(orderNo, callback) {
    console.log("Received order " + orderNo)
    callback(orderNo, orderReady);
}

function prepareFood(orderNo, callback) {
    console.log("Preparing order " + orderNo)
    setTimeout(() => {
        console.log(callback(orderNo));
    }, Math.floor(Math.random() * 10000))
}

function orderReady(orderNo) {
    return ("Order " + orderNo + " is ready");
}

receiveOrder(1, prepareFood);
receiveOrder(2, prepareFood);
receiveOrder(3, prepareFood);
receiveOrder(4, prepareFood);

并且在运行之后是输出-显然，每次运行都使用Math.random（）来随机回答。

Received order 1
Preparing order 1
Received order 2
Preparing order 2
Received order 3
Preparing order 3
Received order 4
Preparing order 4
Order 3 is ready
Order 4 is ready
Order 1 is ready
Order 2 is ready