title: How to use Promise.all with an object as input
body: <p>I've been working on a small 2D game library for my own use, and I've run into a bit of a problem. There is a particular function in the library called loadGame that takes dependency info as input (resource files, and a list of scripts ot be executed). Here's an example.</p>
  
  <pre><code>loadGame({
      "root" : "/source/folder/for/game/",
  
      "resources" : {
          "soundEffect" : "audio/sound.mp3",
          "someImage" : "images/something.png",
          "someJSON" : "json/map.json"
      },
  
      "scripts" : [
          "js/helperScript.js",
          "js/mainScript.js"
      ]
  })
  </code></pre>
  
  <p>Each item in resources has a key that is used by the game to access that particular resource. The loadGame function converts the resources into an object of promises.</p>
  
  <p>The problem is that it tries to use Promises.all to check for when they're all ready, but Promise.all accepts only iterables as inputs - so an object like what I have is out of the question.</p>
  
  <p>So I tried to convert the object into an array, this works great, except each resource is just an element in an array and doesn't have a key to identify them.</p>
  
  <p>Here's the code for loadGame:</p>
  
  <pre><code>var loadGame = function (game) {
      return new Promise(function (fulfill, reject) {
          // the root folder for the game
          var root = game.root || '';
  
          // these are the types of files that can be loaded
          // getImage, getAudio, and getJSON are defined elsewhere in my code - they return promises
          var types = {
              jpg : getImage,
              png : getImage,
              bmp : getImage,
  
              mp3 : getAudio,
              ogg : getAudio,
              wav : getAudio,
  
              json : getJSON
          };
  
          // the object of promises is created using a mapObject function I made
          var resources = mapObject(game.resources, function (path) {
              // get file extension for the item
              var extension = path.match(/(?:\.([^.]+))?$/)[1];
  
              // find the correct 'getter' from types
              var get = types[extension];
  
              // get it if that particular getter exists, otherwise, fail
              return get ? get(root + path) :
                  reject(Error('Unknown resource type "' + extension + '".'));
          });
  
          // load scripts when they're done
          // this is the problem here
          // my 'values' function converts the object into an array
          // but now they are nameless and can't be properly accessed anymore
          Promise.all(values(resources)).then(function (resources) {
              // sequentially load scripts
              // maybe someday I'll use a generator for this
              var load = function (i) {
                  // load script
                  getScript(root + game.scripts[i]).then(function () {
                      // load the next script if there is one
                      i++;
  
                      if (i &lt; game.scripts.length) {
                          load(i);
                      } else {
                          // all done, fulfill the promise that loadGame returned
                          // this is giving an array back, but it should be returning an object full of resources
                          fulfill(resources);
                      }
                  });
              };
  
              // load the first script
              load(0);
          });
      });
  };
  </code></pre>
  
  <p>Ideally I'd like for some way to properly manage a list of promises for resources while still mantaining an identifier for each item. Any help would be appreciated, thanks.</p>