嵌套承诺实现顺序执行

Question

I have a function that calls itself a couple of times when a promise is resolved, and when it is done calling itself, it resolves the promise like so:

var counter = 0;
function runStep(past_resolved_content) {
  return new Promise(function(resolve, reject){
  //do something different with counter
  if (counter < reference ) {
    counter++;
    var step_ran = somePromiseReturningFunction();
    step_ran.then(runStep);
  } else {
    resolve("message");     
  }

From what I can tell, the function does what I want, it will call the somePromiseReturningFunction() correctly and in the desired order. I have a second function that must call runStep() and continue execution when the promise returned by it is resolved.

function executeAllSteps() {
  runStep().then(
    function(){
      console.log("resolved outer promise");
  });
}

My problem is that I cannot make the executeAllSteps function work as desired. I have tried several syntax for the .then but nothing produced the desired output.

Either the content is called immediately, without the promise resolving ( when I write it like this: runStep().then(console.log("resolved outer promise")); , or never at all.

Does anyone know how to correct this function?

Note: I need to use the native javascript promise implementation.

Answer 1

Once you go inside the if (counter < reference ) { condition, you will never resolve the promise that you created in that invocation of runStep() and thus the .then() handler in executeAllSteps() never fires. You need to find a place in runStep() where you resolve the promise you created for each invocation of runStep() , whether or not you've reach your counter max.

I'm not sure I fully understand what you're trying to achieve, but you could do this:

var counter = 0;
function runStep(past_resolved_content) {
  return new Promise(function(resolve, reject) {
    //do something different with counter
    if (counter < reference ) {
      counter++;
      var step_ran = somePromiseReturningFunction();
      step_ran.then(runStep).then(resolve);          // <== change made here
    } else {
      resolve("message");     
    }
  });
}

Logically, this will call call the first runStep() which will execute somePromiseReturningFunction() and when that is done (when it's promise is resolved), it will call a nested runStep() and when that inner runStep resolves, the outer one will resolve itself. So what will happen is you will nest several calls to runStep() until your counter gets to the reference value and then that inner runStep will resolve itself. That will allow the next-most outer runStep to resolve itself, then the next most outer runStep to resolve itself continuing until it gets to the most outer runStep which will resolve itself and then all then .then() handler in executeAllSteps() which it sounds like is what you want.

---

I suspect that if I understood more what you're really trying to accomplish rather than this somewhat abstract code example, then I could probably find a much cleaner way to do this, but I don't really follow what you want to do in what conditions.

---

There are several different approaches you could take that will use existing promises rather than always creating new ones. Here's one idea:

var counter = 0;
function runStep(past_resolved_content) {
    //do something different with counter
    if (counter < reference ) {
        counter++;
        return somePromiseReturningFunction().then(runStep);
    } else {
        // return a resolved promise with your message
        return Promise.resolve("message");
        });
    }
}

---

You could also avoid calling runStep recursively when the counter has reached its value which simplifies things a bit (assumes you don't call runStep the first time when counter has already exceeded the value):

var counter = 0;
function runStep(past_resolved_content) {
    counter++;
    return somePromiseReturningFunction().then(function(data) {
        if (counter < reference) {
            return runStep(data);
        } else {
            return data;
        }
    });
}

Working demo of this idea: http://jsfiddle.net/jfriend00/PfEV2/

---

And, if you don't need to manipulate the counter variable as the process unfolds, then you could do it in a loop too where runStep doesn't have to call itself and the counter doesn't have to be a public variable:

function runStep() {
    var p = Promise.resolve();
    for (var counter = 0; counter < reference; counter++) {
        p = p.then(somePromiseReturningFunction);
    }
    return p;
}

Working demo: http://jsfiddle.net/jfriend00/33ZZ6/