如何在JavaScript Promise中获取/演示异步行为

Question

我读过

承诺还确保顺序独立。 将生产者和使用者分开，以便他们可以独立执行，是异步编程的关键。 有了承诺，您可以先向消费者做出承诺，然后再向生产者提供解决方案。 然后，他们可以按照自己的时间表生产或消费，并且诺言同步。

为了理解上面描述的顺序独立性，我正在编写一些代码来希望证明这一点。 基本上，我想创建两个异步partA() （基于在partA()和partB()中的两个不同时间下载两个映像），然后使用all解决这两个问题。

var axios = require('axios');
function loadImage(imgsrc) {
    return axios.get(imgsrc);
}
function partA() {
    var promise1 = loadImage("http://cn.bing.com/s/a/hp_zh_cn.png");
    var promise2 = setTimeout(partB,20000);
    Promise.all([promise1, promise2]).then(function() {
    console.log("The images are loaded");
    });
};

function partB () {
    return loadImage("http://cn.bing.com/s/a/hpc20.png");
};

partA();

这是我的问题，问题是：

1. 在最后一行执行partA() ，由于var promise2 = setTimeout(partB,20000);我期望我必须等待20秒才能看到成功消息var promise2 = setTimeout(partB,20000); 行（我希望两次下载间隔20秒，以供说明）。 也许我没有正确使用setTimeout 。 但是无论如何，在babel- babel-node REPL中调用partA（）之后，几乎立即获得成功消息。 如何正确获得延迟？

2. 在此示例中（如果正确），我如何按照produce or consume on their own schedule按produce or consume on their own schedule来解释订单独立性？ 生产和消费地点在哪里？

（这是在Ubuntu 16.04下使用带有--presets es2015 babel-node 6.24.1的）

Answer 1

问题是，setTimeout不返回Promise。 您必须插入一个对Promise.all执行超时的Promise。

function partA() {
     var promise1 = loadImage("http://cn.bing.com/s/a/hp_zh_cn.png");
     var promise2 = new Promise((resolve, reject) => {
         setTimeout(() => {
             return resolve(partB);
         }, 20000);
     });
     Promise.all([promise1, promise2]).then(function() {
         console.log("The images are loaded");
     });
 };

 function partB() {
     return loadImage("http://cn.bing.com/s/a/hpc20.png");
 };

 partA();

在这种情况下，promise2实际上是一个promise，在20秒后，它将以partB结果解析。

Answer 2

setTimeout不返回承诺。

要查看工作中的订单独立性，请考虑以下示例：

var promise1, promise2;
promise1 = loadImage("http://cn.bing.com/s/a/hp_zh_cn.png");
promise2 = loadImage("http://cn.bing.com/s/a/hpc20.png");
promise1.then(function () {
    console.log("promise1 finished");
});
promise2.then(function () {
    console.log("promise2 finished");
});
Promise.all([promise1, promise2]).then(function() {
    console.log("both finished");
});

该脚本的输出可以是：

promise1 finished
promise2 finished
both finished

要么

promise2 finished
promise1 finished
both finished

这仅取决于哪个请求较早完成。 如果您想要一个更受控的示例，请考虑以下事项：

var promise1, promise2;
promise1 = create_timeout_promise(20);
promise2 = create_timeout_promise(10);

function create_timeout_promise(timeout) {
    var promise;
    promise = new Promise(function (resolve) {
        setTimeout(resolve, timeout);
    });
    return promise;
}

现在执行的输出为：

promise2 finished
promise1 finished
both finished

因为承诺2将首先解决。