如何在JavaScript中处理嵌套的Promise？

Question

I need a solution to this below confusion i have .

I have a list of promises outer_promises_list .

Inside the promise.then of each promise in this outer_promises_list , I have another list of promises inner_promises_list

What I want is a method which gets called when all the outer promises and all the promises inside them get resolved .

Here is my code to get the context :

fetch = require("node-fetch") 

function all_promises_resolved_method() {
    console.log("All promises resolved ! ");
}


function start_main_process() {
    let outer_promises_list = []
    let inner_promises = []


    start_urls_list.forEach(url => {
        outer_promises_list.push(fetch(url).then(resp => resp.text()))
    })


    outer_promises_list.forEach((outer_prom) => 
        {
            outer_prom.then(htmlbody => 
            {

                inner_promises = inner_promises.concat(get_theater_promises());
                inner_promises.forEach(inner_prom => {
                    inner_prom.then(inner_resp => {

                        inner_resp.clone().text().then(inner_html_body => {
                            console.log("do synchronous stuff on this html body ");
                        })
                    })
                })
            })


            console.log("inner promises skipped , will be resolved later ");

            Promise.all(inner_promises.concat(outer_promises_list)).then(all_promises_resolved_method)

        })
}





function get_inner_promises() {
    inner_promises = []
        [url1, url2, url3].forEach((url)=>{

            inner_promises.push(fetch(href))

        })

return inner_promises;
}


start_main_process() ; 

My issue is that all_promises_resolved_method is called only when the inner_promises of the first outer promise is resolved . I need a solution to call that method when all outer promises and each of all of those inner promises are resolved. What's the easiest way and efficient way to do this ?

Answer 1

It seems you missed a few things in your pseudocode or there is some typo. Also, you are calling Promise.all on outer_promises_list and inner_promises twice, not sure why. Following is my solution, anyway.

Please remember that JS Promise is designed to avoid nested code. So if you are using promises while nesting callbacks or Promises, most likely you are not doing it right.

fetch = require("node-fetch")

function all_promises_resolved_method() {
    console.log("All promises resolved ! ");
}


function start_main_process() {
    let outer_promises_list = []
    let inner_promises = []

    start_urls_list.forEach(url => {
        outer_promises_list.push(fetch(url).then(resp => resp.text()))
    })


    Promise.all(outer_prom)
        .then(htmlbodyArr => {//it is an array of resolved values from all the promises in outer_prom
            /*
               I don't know how you are using htmlBody to create inner promise.
               Following is my best guess
             */

            htmlbodyArr.forEach((htmlBody)=>{
                inner_promises.push(get_theater_promises(htmlBody));
            })
            return inner_promises;
        })
        .then((inner_promises)=>{
            return Promise.all(inner_promises)
        })
        .then((innerPromiseResultArr)=>{
            all_promises_resolved_method();
        })
        .catch((err)=> console.log(err))

/*
    outer_promises_list.forEach((outer_prom) =>
    {
        outer_prom.then(htmlbody =>
        {

            inner_promises = inner_promises.concat(get_theater_promises());
            inner_promises.forEach(inner_prom => {
                inner_prom.then(inner_resp => {

                    inner_resp.clone().text().then(inner_html_body => {
                        console.log("do synchronous stuff on this html body ");
                    })
                })
            })
        })


        console.log("inner promises skipped , will be resolved later ");

        Promise.all(inner_promises.concat(outer_promises_list)).then(all_promises_resolved_method)

    })
    */
}





function get_inner_promises() {
    inner_promises = []
        [url1, url2, url3].forEach((url)=>{

        inner_promises.push(fetch(href))

    })

    return inner_promises;
}


start_main_process() ;