Array.length 为 3 但记录一个“空”数组答案

【问题标题】：Array.length is 3 but logs an "empty" arrayArray.length 为 3 但记录一个“空”数组
【发布时间】：2018-01-30 15:20:25
【问题描述】：

我希望记录的结果：[ 'freecodecamp' , 'twitchtv' , 'exercise' ]

我已经阅读了一堆关于 Asynchronous situation 的帖子，这解释了为什么我在控制台上得到这些“空 []”：
“空”意味着它看起来像这样：[]，
比这更重要：['freecodecamp'，'twitchtv'，'exercise']。

我得到了什么到目前为止：如果 console.log(online_streamer) 放置在以下场景中：

A. （在 getJSON 回调中）--- 日志：未定义，然后是几行空 []，然后打印包含 3 个项目（游戏玩家姓名）的最终“可用”数组。

B. （forLoop 外）--- 日志：1 [ ] 数组，包含 3 个项目，仅当我按下向下箭头按钮时才显示。同样，(Async situation.)

我的问题： 我是放错了 consoe.log 还是需要一些完全不同的函数来打印一个可用的数组，例如： [ 'item1' , 'item2' , 'item3' ] 就像场景 A.) 的最后一次迭代一样。) ?谢谢大家。

function getOnlineGamers(){
    var online_gamers = [];
    for (var i=0; i<gamers.length; i++){
        //(gamers is a defined array with 11names of 11gamers.)

        $.getJSON(url+"streams/"+ gamers[i]+cid).done(function(data){
            if(data.stream === null){
            }else {
                var name= data.stream.channel.name;
                online_gamers.push(name);
            }
            console.log(online_gamers);  // <--- A 
        });
    };
    console.log(online_gamers); //<--- B 
};

console.log(getOnlineGamers())

【问题讨论】：

getOnlineGamers() 不返回任何内容，因此记录它不会记录任何有用的内容。您需要使用适当的“异步返回”技术。
How do I return the response from an asynchronous call?的可能重复
第一个空数组来自B，然后是来自console.log(getOnlineGamers()) 的undefined，然后 A 可能正在记录一些东西。

标签： javascript arrays for-loop asynchronous twitch

【解决方案1】：

您必须等待每个解决方案，然后你就可以使用结果数组了。

function getOnlineGamers(gamers, cid) {

  return Promise
    .all(gamers.map(function(game) {
       return $
        .getJSON(url + "streams/" + game + cid)
        .then(function(data) {

          return data.stream && data.stream.channel.name;
        })
      ;
    }))
  ;
}    


getOnlineGamers([123, 321, 231], 'foobaz')
  .then(function(names) {

    console.log('names', names);
  })
;

【讨论】：