title: How to map an array of objects and fetch network data for each in JS?
body: <p>I am making apps in React Native. I have to fetch an array of data of categories from a URL and then for each category I have to fetch assets from their respective URLs.</p>
  
  <p>My data is stored in the following format:</p>
  
  <p>From the <code>mainURL</code>:</p>
  
  <pre><code>{
    "id": 1,
    "name": "Home",
    "type": "",
    "url": "",
    "subCategories": [
      {
        "id": 92,
        "name": "Documentary",
        "type": "JTV_LEAF",
        "url": "yyy",
      }
    ]
  }
  </code></pre>
  
  <p>From each category URL,</p>
  
  <pre><code>[
    {
      "id": "1",
      "title": "Inception",
      "type": "vod"
    }
  ]
  </code></pre>
  
  <p>How do I fetch data for each category using <code>map</code> and <code>reduce</code> and <code>axios</code>?</p>
  
  <hr>
  
  <p>This is what I have written so far. I am getting <code>undefined</code> at the end.</p>
  
  <pre><code>export const fetchNavigationFeed = (navUrl, subId) =&gt; {
    return dispatch =&gt; {
      const url = navUrl
        .replace("__JTV__SUBSCRIBER__ID__", subId);
      dispatch({ type:FETCH_NAVIGATION_FEED });
      return axios.get(url)
        .then(response =&gt; {
          let categories = [];
          for (var i = 0; i &lt; response.data.subCategories.length; i++) {
              var cat = response.data.subCategories[i];
              var category = new Category(cat);
              categories.push(category);
          }
          console.log(categories);
          let promises = [];
          categories.map(category =&gt; {
            let request = axios.get(category.url)
              .then(assetsJson =&gt; {
                let assets = [];
                for (var i = 0; i &lt; assetsJson.data.length; i++) {
                    var ass = assetsJson.data[i];
                    var asset = new Asset(ass);
                    assets.push(asset);
                }
                category.assets = assets;
              });
            promises.push(request);
          });
          axios.all(promises)
            .then(axios.spread(...args) =&gt; {
              console.log(args);
            });
          return categories;
        })
        .then(categories =&gt; {
          // console.log(categories);
          dispatch({ type:FETCH_NAVIGATION_FEED_SUCCESS, payload:categories });
        });
    }
  }
  </code></pre>