I'；我试图理解如何在javascript中使用承诺，但我的脚本从不执行；然后"；

我有一个脚本，它设置了一组用户名，然后为每个用户名运行一个获取请求，以twitches API端点获取每个用户的Json信息。然后我想把这些信息放到一个数组中供以后使用，结果发现我必须使用承诺，这是我以前从未使用过的。我通读了这个：还有这个：我在这里读到了菲利克斯·克林的回应：我仍然无法准确地理解什么去了哪里，什么做了什么。这就是我到目前为止所做的：

var users = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"]

var arr = [];

var headers = {
  'Client-Id': 'xxxxxxxxxxx'
}

var promise = new Promise(function usersJson(callback) {
  for (i = 0; i < users.length; i++) {
    var url = "https://api.twitch.tv/helix/users?login=" + users[i];
    fetch(url, {headers})
    .then(function(response) {
      return response.json();
    })
    .then(function(myJson) {
      arr.push(myJson);
    })
    callback(arr);
  };
})

promise.then(function(result) {
  console.log(result);
})

var用户=[“ESL_SC2”、“OgamingSC2”、“cretetion”、“freecodecamp”、“storbeck”、“habathcx”、“RobotCaleb”、“Noobs2nijas”]
var-arr=[]；
变量头={
“客户端Id”：“XXXXXXXXXX”
}
var promise=新承诺（函数usersJson（回调）{
对于（i=0；i

---

据我所知，这应该是通过每个端点运行的，将数据推送到我的数组变量，然后一旦整个事情“完成”，它应该使用我的promise变量调用“then”东西到console.log我的数组。我得到的只是一个空白数组，我真的不确定我做错了什么。如果我在arr.push（json）之后放入console.log（arr），我会返回8个数组，每个数组都带有下一个响应主体，因此我知道调用正在工作，我就是无法让它留在数组中。

请执行类似操作：

const runTheTrap = async function(users){
   const ret = [];
   for (i = 0; i < users.length; i++) {
    var url = "https://api.twitch.tv/helix/users?login=" + users[i];
    await fetch(url, {headers})
    .then(function(r) {
      return r.json().then(v => ret.push(v));
    });
  };

  return ret;
}


runTheTrap(users).then(function(result) {
  console.log(result);
});

---

为了得到您想要的结果，您的代码可以重写为

const users = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"]

const headers = {
  'Client-Id': 'xxxxxxxxxxx'
}

Promise.all(users.map(user => fetch(`https://api.twitch.tv/helix/users?login=${user}`, {headers}).then(response => response.json())))
.then(result => console.log(result));

更具可读性

const users = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"]

const headers = {
  'Client-Id': 'xxxxxxxxxxx'
}

const mapper = user => 
    fetch(`https://api.twitch.tv/helix/users?login=${user}`, {headers})
    .then(response => response.json());

const promises = users.map(mapper);

Promise.all(promises)
.then(result => console.log(result));

最后，由于您的原始代码显示不了解ES2015+

var users = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"];

var headers = {
    'Client-Id': 'xxxxxxxxxxx'
};

var mapper = function mapper(user) {
    return fetch("https://api.twitch.tv/helix/users?login=" + user, { headers: headers }).then(function (response) {
        return response.json();
    });
};

var promises = users.map(mapper);

Promise.all(promises).then(function (result) {
    return console.log(result);
});

---

一种可能帮助你在承诺中思考更多的方法是，一旦你在承诺之地，你只能在你还在承诺之地的时候获得数据。在您的示例中，您从

fetch

promise获取数据。这意味着您只能从

fetch

promise内部使用该数据。请注意：

.then(function(myJson) {
  arr.push(myJson);
})
callback(arr);

构建阵列的

arr.push

在promise内部，而

callback（arr）

在promise外部。因为你已经不在承诺范围之内了，所以你无法获得数据

在您的情况下，您还希望同时等待多个承诺，因为您同时从多个源获取数据。最好的方法是使用

承诺。所有的
和一系列承诺：

const promise = Promise.all(users.map(user => {
    const url = `https://api.twitch.tv/helix/users?login=${user}`;
    return fetch(url, { headers })
    .then(function(response) {
      return response.json();
    });
}));

现在，
promise。然后，
将允许您在解决所有承诺后访问一组数据。您不需要推送到另一个数组，
.map
将为您创建承诺数组


您还可以使用
async
/
await
语法编写此代码，该语法更易于推理，而且可能更简洁

const promise = Promise.all(users.map(async user => {
    const url = `https://api.twitch.tv/helix/users?login=${user}`;
    const response = await fetch(url, { headers });
    return response.json();
}));


顺便说一句，当使用本身不实现承诺的库时，您应该只需要使用
newpromise
fetch
已经返回了一个承诺，所以当你调用它时，你已经得到了一个承诺，所以没有必要用
new Promise
来包装它，为什么要使用forEach循环呢？你也没有返回承诺中的任何内容。不，实际上是你的
回调（arr）
应该在第二个
中，然后是
，而且每次提取都是一个承诺，因此，一旦解决第一个问题，它将触发
回调（arr）
，并将退出。我只是将其切换到forEach，这并不能解决我的问题。就我所知，使用forEach还是for循环并不重要数组#映射
不返回承诺，因此
运行跟踪（用户）。然后
会抱怨
。然后
不是一个函数：p这是真的，我现在修复了很多？不要让我收回我的投票lol
我更喜欢这种方法
-除了，你要返回一个数组。。。一个数组没有
。那么
方法，所以，你首选的方法是有缺陷的。哎哟，让我来修正一下。这是一个惊人的解释，非常感谢。我能够让console.log处理这些信息，我应该能够从这里继续前进。非常感谢。
const promise = Promise.all(users.map(async user => {
    const url = `https://api.twitch.tv/helix/users?login=${user}`;
    const response = await fetch(url, { headers });
    return response.json();
}));