在 for 循环之外做出承诺答案

【问题标题】：Promise outside of for loop在 for 循环之外做出承诺
【发布时间】：2018-03-08 02:35:13
【问题描述】：

我有一个这样的 for 循环：

var currentLargest
for (var site in sites) {
    // Each site is a website (www.mysite1.com, www.mysite2.com, etc.)
    $.getJSON(site).then(function(data) {
       if (data > currentLargest) {
           currentLargest = data
       }
    });
}
// Here is where I want to use "currentLargest"

它检查多个不同的网站以获得最大的价值。但是，我无法在 for 循环之后提取我需要的数据。我只能在 Promise 中与 currentLargest 进行交互，但该数据仅与其中一个站点相关（直到 for 循环之后它才完成所有这些站点的循环）。

如何在包含 getJSON 承诺的 for 循环之后访问 currentLargest 值？

【问题讨论】：

Why is my variable unaltered after I modify it inside of a function? - Asynchronous code reference的可能重复
基本上这在你想象的方式中是不可能的。由于getJSON 调用是异步的，因此无法在循环后同步访问currentLargest。您必须通过 .then 函数访问该数据，就像任何其他基于异步操作的结果一样。
@CRice 那么我该如何构建这个呢？
您需要将所有getJSON 承诺放入一个数组中，然后使用Promise.all 等待所有承诺的完成，然后计算最大的并用它做你需要的那个Promise.all的.then。
@CRice 我正在尝试这个实现，但无法弄清楚如何将我的sites 数组转录为Promise.all()。如果你有时间，你能给我举个例子吗？

标签： javascript asynchronous promise

【解决方案1】：

// Your code:
/*
var currentLargest
for (var site in sites) {
    // Each site is a website (www.mysite1.com, www.mysite2.com, etc.)
    $.getJSON(site).then(function(data) {
       if (data > currentLargest) {
           currentLargest = data
       }
    });
}
*/

// Updated:
const sitePromisesArr = sites.map((site) => $.getJSON(site));

$.when(sitePromisesArr)
  .then((valArr, index) => {
    // The "valArr" here will be an Array with the responses
    const largest = valArr.reduce((current, next) => next > current ? next : current, 0);
    
    // This will be the largest value.
    console.log(largest);
    
    // This will be the site that contains the largest value.
    console.log(sitePromisesArr[index]);
  });

&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;

【讨论】：

这太好了，我会接受的！不过，有什么方法可以让我跟踪最大价值来自哪个网站？
是的。我会更新我的答案，为您提供这些信息。
@AlwaysQuestioning => 我已经更新了我的答案，也为您提供了这些信息。
经过测试，这个不行。当我执行循环通过valArray 的for 循环时，变量仍然未定义。我怎样才能让承诺到那时已经完全解决？
@AlwaysQuestioning => 你能提供一个sites 数组的例子吗？也许这有什么问题。

【解决方案2】：

您需要使用异步循环，然后在所有异步 getJSON 请求完成后执行回调。你可以使用http://caolan.github.io/async/docs.html#each 来帮助解决这个问题。

【讨论】：