javascript - 构建一组延迟函数( promise )？

Question

我正在学习 promises，在这个例子中，我正在尝试创建一个 promise 数组，我可以使用 Promise.all(...) 执行它们(在 native ES6 下)。

promise 应该“启动”一个函数，使传递给它的数字加倍。我预计 promise 的执行将推迟到我调用 Promises.all() 之后，但结果会立即打印出来。我错过了什么？？

我希望 promise 在我调用他们时开始，而不是尽快开始(如果不清楚的话)

 var buildPromises = function(numbers) {
    var res = [];
     numbers.forEach(function(num) {
         var p = new Promise(function(resolve, reject) {
             console.log(num * 2);
         });
         res.push(p);
     });
     return res;
 }

 var numbers = [1, 2, 3];
 var p = buildPromises(numbers); 

Answer 1

promise 执行器函数(传递给 new Promise() 的回调)被设计为立即执行，因此您将看到所有 console.log()立即发表声明。

执行器中通常发生的事情是您启动一些异步操作，例如 ajax 请求或异步文件 I/O 请求，然后一段时间后，该请求将调用 resolve(xxx)用一个值来解决这个 promise 。你现在拥有的没有异步操作，从不调用 resolve()并且真的不应该使用 promise ，因为这里没有异步事件。

promise 不是函数。它不是“执行”的。所以，你并没有像你的问题所暗示的那样真正创建一个带有 promise 的延迟函数数组。您可以使用 promises 来跟踪一些异步操作，并且可以在通过将监听器附加到 promise 来解决这些 promise 时执行一些函数，但您并没有真正执行 promises。

为了 promise 您正在创建工作，您提供作为传递给 new Promise(fn) 的 promise 执行器回调执行的函数。 .这就是执行发生的地方。 Promise 本身只是一个对象，用作某些异步操作的 future 值的占位符。当执行程序中的代码调用 resolve(someValue) 时设置 promise 值.或者，可以通过调用 reject(someError) 来指示错误.同时，执行器函数之外的代码可以使用 .then() 注册监听器。或 .catch()监听 promise 中的状态变化(当 promise 实现某个值或以错误结束时的某个 future 时间)。

所以，在 resolve() 之后或 reject()被调用时，相应的事件监听器(在 .then() 或 .catch() 注册的)将触发，通知监听代码最终解决了此 promise (值或错误)。然后，该监听代码可以处理该值或错误。

Promise.all()接受一组 promise 并返回一个新的主 promise ，当 promise 数组中的任何一个被拒绝时，该 promise 将被拒绝，或者当所有 promise 数组都已解决时，该 promise 将被解决为一个值数组。它会监视所有其他 promise ，并从本质上为您提供所有 promise 的摘要。

为了模拟异步操作，我们可以将所有操作放在 setTimeout() 中然后调用resolve()就像这个可运行的片段:

 var buildPromises = function (numbers) {
     var res = [];
     numbers.forEach(function (num) {
         var p = new Promise(function (resolve, reject) {
             // this is called immediately and it starts
             // an asynchronous operation that will finish later
             setTimeout(function () {
                 var result = num * 2;
                 console.log("individual:", result);
                 // resolve the promise with our result
                 resolve(result);
             }, Math.floor(Math.random() * 500) + 500);
         });
         res.push(p);
     });
     return Promise.all(res);
 }

 var numbers = [1, 2, 3, 4, 5];
 buildPromises(numbers).then(function (results) {
     console.log("group: ", JSON.stringify(results));
 });

在运行此代码段后的结果中，请注意个人 console.log()语句可以是任何顺序(因为异步操作在时间上通常是不可预测的)，但是 Promise.all()组结果始终保持数组中 promise 的原始顺序。那是 Promise.all() 的另一项服务提供。

---

此外，它还节省了代码以使用 .map()构建你的 promise 数组，因为你正在遍历一个数组并构建一个新数组，每个元素一个 promise ，这正是 .map()专为。你可以这样做:

var buildPromises = function (numbers) {
    return Promise.all(numbers.map(function (num) {
        return new Promise(function (resolve, reject) {
            setTimeout(function () {
                var result = num * 2;
                console.log("individual:", result);
                resolve(result);
            }, Math.floor(Math.random() * 500) + 500);
        });
    }));
}

var numbers = [1, 2, 3, 4, 5];
buildPromises(numbers).then(function (results) {
     console.log("group: ", JSON.stringify(results));
});