使用两个中间$ .getJSON调用将

时间:2016-04-06 05:42:41

标签: javascript jquery arrays promise map-function

输入:用户名字符串数组

需要的输出:与输入中的每个用户名对应的Javascript对象数组。这些JS对象的属性将通过每个用户名的两个API调用构建(我正在使用$.getJSON个调用。建议欢迎)。

我有一个Twitch API的用户名数组:

let users = ["OgamingSC2", "storbeck", "comster404"] // actual list is longer

我想使用Array.prototype.map()高阶函数来创建像

这样的对象数组
let userObjects = [ {...}, {...}, {...}, ... ]

每个对象看起来像:

{
 username: 'storbeck'   // <-- Added by me
 stream: null,          // <-- Added by first API call
 _links: {              // <-- Added by first API call
     self:'https://api.twitch.tv/kraken/streams/storbeck',
     channel:'https://api.twitch.tv/kraken/channels/storbeck'
 }
 logo: 'http:// ... png' // <-- Added by second API call
}

这两个API调用函数返回$.getJSON Promises:

let getStreamInfo = (username) => {
  return $.getJSON('https://api.twitch.tv/kraken/streams/'+username+'?callback=?')
    .then((x) => x) // should I include this then? 
}

let getUserInfo = (twitchObject) => {
  return $.getJSON('https://api.twitch.tv/kraken/users/'+ twitchObject.user )
}

到目前为止,我的代码中没有产生预期对象的内容是:

let userObjects = users.map((user)=>{
  return getStreamInfo(user)
    .done((data) => {
      let result = {
        username: user,
        data: data
      }
      console.log(JSON.stringify(result)) // prints out the intended object so far
      return result
  })
})

现在,当我打印出userObjects的内容时,我得到了:

"{}"
"{}"
"{}"
// ... and so on

更进一步,我想链接userObjects,并从getUserInfo函数中的任何内容中为每个JS对象添加更多内容。

我想了解如何使用功能性Javascript完成此操作,但这不是必需的。

1 个答案:

答案 0 :(得分:0)

你是正确的,你只需要对你的功能进行小编辑。

let getStreamInfo = (username) => {
  return $.getJSON('https://api.twitch.tv/kraken/streams/'+username+'?callback=?');
}

let getUserInfo = (user) => {
  return $.getJSON('https://api.twitch.tv/kraken/users/'+ user);
}

let userObjects = [];

核心功能需要Promise同步:

users.map((user)=>{

  Promise.all(getStreamInfo(user), getUserInfo(user)).then((data)=>{
    let obj = {
      username: user,
      stream: data[0].stream,
      _links: data[0]._links,
      logo: data[1].logo
    }
    userObjects.push(obj);
  });
});