Returning Promise.all from Function

Question

I am attempting to return a promise with Promise.all but for some reason my .then values are evaluating to undefined. This seems to work when it's all inline but it was my understanding I should be able to return the top promise.all and then treat it like any other promise.

function createStreamerArray() {
  const regularStreamers = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"]
  const baseURL = 'https://wind-bow.gomix.me/twitch-api'

  return Promise.all(
    regularStreamers.map(streamer => {
      Promise.all([
        Promise.resolve($.getJSON(baseURL + '/users/' + streamer + '?callback=?', null)),
        Promise.resolve($.getJSON(baseURL + '/streams/' + streamer + '?callback=?', null)) 
      ]).then(values => {
        return values
      })
    })
  )
}

createStreamerArray().then(values => console.log(values))

for a start, you can remove the `.then(values => { return values })` - though, this wont fix any issue (but makes the code less incorrect :) — Jaromanda X, Mar 02 '17 at 03:17
ADD `return` before the "inner" `Promise.all([` - so that your map actually returns something - or remove the `{}` that wraps the inner `Promise.all` — Jaromanda X, Mar 02 '17 at 03:18
[Drop the pointless `.then(values => { return values })`](http://stackoverflow.com/q/41089122/1048572) — Bergi, Mar 02 '17 at 04:45

score 2 · Accepted Answer · answered Mar 02 '17 at 03:24

Firstly (and most importantly) you need to return a value in the .map callback

THis can either be done like this

regularStreamers.map(streamer => {
  // added return
  return Promise.all([
    Promise.resolve($.getJSON(baseURL + '/users/' + streamer + '?callback=?', null)),
    Promise.resolve($.getJSON(baseURL + '/streams/' + streamer + '?callback=?', null)) 
  ])
})

Or, using the short form for arrow functions, like this

//                               { removed
regularStreamers.map(streamer => 
  Promise.all([
    Promise.resolve($.getJSON(baseURL + '/users/' + streamer + '?callback=?', null)),
    Promise.resolve($.getJSON(baseURL + '/streams/' + streamer + '?callback=?', null)) 
  ])
)
// } removed

Secondly, (purely to remove unrequired code) remove the redundant

.then(values => {
    return values
})

This results in:

    function createStreamerArray() {
        const regularStreamers = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"];
        const baseURL = 'https://wind-bow.gomix.me/twitch-api';
      
        return Promise.all(regularStreamers.map(streamer => Promise.all([
              Promise.resolve($.getJSON(baseURL + '/users/' + streamer + '?callback=?', null)),
              Promise.resolve($.getJSON(baseURL + '/streams/' + streamer + '?callback=?', null)) 
        ])));
    };
    createStreamerArray().then(values => console.log(values));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Which you will see, works

Works great, but that redundant code was in there as a placeholder. I don't actually want to return the values. I want to combine them into another object and return that but I was trying to get the rest working first. — Cliff Smith, Mar 02 '17 at 03:51

Turnipdabeets · Answer 2 · 2017-03-02T03:26:41.073

0

Did you try adding an extra return inside your map function? If you don't return the second Promise.all then you you won't see your values.

edited Mar 02 '17 at 03:26

answered Mar 02 '17 at 03:18

Turnipdabeets

5,815
8
40
63

Returning Promise.all from Function

2 Answers2