How to change promises in nested loops?

Question

Here is my hot mess of function. This will capture the model variants (which are in the array as strings) from the csv file (the path to this file depends on the text that we extract from other csv files, therefore, the loop).

The call csvService.getCsvAsArrayyou see receives an object with the contents of the csv file, where each column is stored in an array under the attribute with the name of the top column. Thats working fine, so just be aware that when you see things like result["NavigationSectionShortNames"], it's just an array of strings.

    var INDEX_OF_PRODUCTS_SECTION = 1;
    var getAllModelVariants = function () {
        return csvService.getCsvAsArray("Contents/Sections/" + navFileNames[INDEX_OF_PRODUCTS_SECTION] + "/order.csv").then(function (result) {
            var products = [];
            for (var i = 0; i < result["NavigationSectionShortNames"].length; i++) {
                csvService.getCsvAsArray("Contents/Sections/" + navFileNames[INDEX_OF_PRODUCTS_SECTION] + "/" + result["NavigationSectionShortNames"][i]
                + "/order.csv").then(function (productModelInfo) {
                    var productFamilies = []; //array of all different families for a certain product
                    for (var j = 0; j < productModelInfo["NavigationSectionShortNames"].length; j++) {
                        csvService.getCsvAsArray("Contents/Sections/" + navFileNames[INDEX_OF_PRODUCTS_SECTION].length + "/" + result["NavigationSectionShortNames"][i] + "/" + productModelInfo["NavigationSectionShortNames"][j] + "/order.csv").then(function (modelVariants) {
                            var productModels = []; //array of all different model types for a certain family
                            for (var k = 0; k < modelVariants.length; k++) {
                                productModels.push(modelVariants["NavigationSections"][k]);
                            };
                            productFamilies.push(productModels);
                        });
                    };
                    products.push(productFamilies);
                });

            };
        })
        return products;
    };

, , (i, j k) . promises , ? $q.all, , . , promises for, .

- 3D- (. ).

, promises:

    var getAllModelVariantsTest = function () {
        var result = ["productFamily1", "productFamily2", "productFamily3"];
        var testArray = ["productFamilyModel1", "productFamilyModelt2", "productFamilyModel3", "productFamilyModel4"];
        var testArray3 = ["productFamilyModelVariant1", "productFamilyModelVariant2", "productFamilyModelVariant3", "productFamilyModelVariant4"];
            var products = [];
            for (var i = 0; i < result.length; i++) {
                    var productFamilies = []; //array of all different families for a certain product
                    for (var j = 0; j < testArray.length; j++) {
                            var productModels = []; //array of all different model types for a certain family
                            for (var k = 0; k < testArray3.length; k++) {
                                productModels.push(testArray3[k]);
                            };
                            productFamilies.push(productModels);
                    };
                products.push(productFamilies);
            };
            return products;
    };
    var testOutput = getAllModelVariantsTest();

, , .

, promises , plunker. promises?

$q.all ?

. , - , .

Answer 1

Hell Pyramid of Doom:

function fatchAllDataForProduct(product) {

  var getProductFamilies = (product) => Promise.resolve(["productFamily1", "productFamily2", "productFamily3"]);
  var getFamilyModels    = (productFamily) => Promise.resolve(["productFamilyModel1", "productFamilyModelt2", "productFamilyModel3", "productFamilyModel4"]);
  var getModelVariants   = (familyModel) => Promise.resolve(["productFamilyModelVariant1", "productFamilyModelVariant2", "productFamilyModelVariant3", "productFamilyModelVariant4"]);
  var processVariant     = (modelVariant) => modelVariant;
  var mapFunArray = ( fun ) => (array) => array.map( fun ); // mapFunArray( e => e )( [1,2,3,4] )

  return getProductFamilies(product)
    .then( pfs => pfs
      .map( pf => getFamilyModels(pf)
        .then( fms => fms
          .map( fm => getModelVariants(fm)
            .then( mvs => mvs
              .map( processVariant )
            )
          )
        )
      )
    );
}

fatchAllDataForProduct('foobarProduct').then(
  results => {
    console.log(results);
  }
);

getFoos Promise.
then, Promise.
then foos.map(..getBars().then..), promises.
then bars.map(..getGoos.then..).
Goos promises .

(* ):

productPromise:
  *familyPromise:
    *modelsPromise:
      *processedVariant

Callback Hell, async/await EcmaScript7, Babel.

async function fatchAllDataForProduct(product) {

  var getProductFamilies = (product) => Promise.resolve(["productFamily1", "productFamily2", "productFamily3"]);
  var getFamilyModels    = (productFamily) => Promise.resolve(["productFamilyModel1", "productFamilyModelt2", "productFamilyModel3", "productFamilyModel4"]);
  var getModelVariants   = (familyModel) => Promise.resolve(["productFamilyModelVariant1", "productFamilyModelVariant2", "productFamilyModelVariant3", "productFamilyModelVariant4"]);
  var processVariant     = (modelVariant) => modelVariant;

  var pfs = await getProductFamilies(product);
  var promises = pfs.map( async(pf) => {
    var fms = await getFamilyModels(pf)
    return fms.map( async(fm) => {
      var mvs = await getModelVariants(fm);
      return mvs.map( processVariant )
    })
  });
  return Promise.all(promises);
}

fatchAllDataForProduct('foobar').then(
  results => {
    for(var promise of results) {
      promise.then(...)
    }
  }
);