How can I call a function after several callbacks have been called

Question

I need to push the data into a new array from the database, which will return promise object. 5 times I need to call. So I do it like this.

  var items = []; function setData() { facilityAPIs.getAllListItems.get({ listName: "Samples" }). $promise.then(function(data) { alert("1"); for (var j = 0; j < data.items.length; j++) { items.push(data.items[j]); } console.log(items); }).then(function() { facilityAPIs.getAllListItems.get({ listName: "Controls" }). $promise.then(function(data) { alert("2"); for (var j = 0; j < data.items.length; j++) { items.push(data.items[j]); } console.log(items); }); }).then(function() { facilityAPIs.getAllListItems.get({ listName: "FibroBlast" }). $promise.then(function(data) { alert("3"); for (var j = 0; j < data.items.length; j++) { items.push(data.items[j]); } console.log(items); }); }).then(function() { facilityAPIs.getAllListItems.get({ listName: "pBMC" }). $promise.then(function(data) { alert("4"); for (var j = 0; j < data.items.length; j++) { items.push(data.items[j]); } console.log(items); }); }).then(function() { facilityAPIs.getAllListItems.get({ listName: "iPS Cell Lines" }). $promise.then(function(data) { alert("5"); for (var j = 0; j < data.items.length; j++) { items.push(data.items[j]); } console.log(items); }); }); } 

But if I want to use items array after all of data are pushed into it, such as call splitData(items). how can I that. Thank you.

Answer 1

So is it something like this?

var items = [];

some_fn(...)
    .then(function(data) { [push data to items] })
    .then(function() {
        some_fn(...).then(function(data) { [push data to items] });
    })
    .then(function() {
        some_fn(...).then(function(data) { [push data to items] });
    })
    .then(function() {
        some_fn(...).then(function(data) { [push data to items] });
    })
    .then(function() {
        some_fn(...).then(function(data) { [push data to items] });
    })
    .then(function() {
        ...use items somehow after _all_ data has been pushed to it...
    })

If so, then the problem is that this " .then chain" isn't really a chain: the "top level .then "s will be executed one after another, but inside each of them you start a new asynchronous operation separately. Each of these will eventually push some data to items, but the end result cannot be captured in the last " .then ".

If you simply attach multiple "fulfilled" callbacks to the same promise, and you don't return a promise from them, they will simply be execute one after the other, when your first promise is fulfilled:

promise
  .then(function() { foo; }  // will be executed when promise is fulfilled
  .then(function() { bar; }  // will be executed right after

If you run other async operations in your callbacks, and want to create a chain, you need to return a promise from the callback:

promise
   .then(function() { return promise_foo; }  // will be executed when promise is fulfilled
   .then(function() { return promise_bar; }  // will be executed when promise_foo is fulfilled

(For details, see The Promise Resolution Procedure in the spec .)

So the original example could be reorganised like this to create a single chain:

some_fn(...)
    .then(function(data) { [push data to items] })
    .then(function() {
        return some_fn(...).then(function(data) { [push data to items] });
    })
    .then(function() {
        return some_fn(...).then(function(data) { [push data to items] });
    })
    .then(function() {
        return some_fn(...).then(function(data) { [push data to items] });
    })
    .then(function() {
        return some_fn(...).then(function(data) { [push data to items] });
    })
    .then(function() {
        ...all operations have finished, you can use items here...
    })