Modify array object by async method under async forEach loop

Question

First of all, I have an array of users that contains some basic data, such as

{"id": "1", "name": "a" }, {"id": "2", "name": "b" }

Now by calling a remote API: self.getDrinks for each user.id, it returns a new array drinks[]. Then I want to integrate the drinks into each user, finally it should be:

{"id": "1", "name": "a", "drinks": [{"id": "1-1", "name": "coke"}, {"id": "1-2", "name": "orange"}]}, {"id": "2", "name": "b", "drinks": [{"id": "2-1", "name": "coke"}, {"id": "2-2", "name": "lime"}] }

I used noSQL so that I have to do async functions to resolve return data:

Result {
  result (object, optional),
  message (string, optional),
  error (integer, optional)
}

So here is my function:

var self = this;
var itemsProcessed = 0;

this.users.forEach(function (user, idx, arr) {

  //assume the API getDrinks needs more parameters like below

  self.getDrinks(user.id, "getDrink", 0, 100, '', '', '', '', '') 
    .then((data: Result) => {
      itemsProcessed++;
      arr[idx].drinks = data.result.drinks;            
      }
      if (itemsProcessed === arr.length) {
        Logger.debug("Expected Result: " + JSON.stringify(arr));
      }
    })
    .catch(reason => Logger.error(reason));
});

Logger.debug("UnExpected Result: " + JSON.stringify(this.users));

As you can see, finally I cannot get correct this.users since it is modified in then function under forEach.

Some people suggest me to use Promise.all() but it always reports syntax error due to the return type is an array drinks[]

@JaromandaX It only prints the same original users without drinks[]. And the 2nd Logger will be executed before the 1st Logger, so the users will not have drinks[] in the end. — Vincent
– Vincent, Commented Aug 4, 2016 at 0:26
my point was that users are modified, just not at the point you log this.users - you state that they will not be changed - which is incorrect — Jaromanda X
– Jaromanda X, Commented Aug 4, 2016 at 0:30

Jaromanda X · Accepted Answer · 2016-08-04 00:46:03Z

1

Using promise.all you should be able to simplify your code to the following:

Promise.all(this.users.map((user, idx, arr) => 
    this.getDrinks(user.id, "getDrink", 0, 100, '', '', '', '', '') 
    .then((data: Result) => {
        itemsProcessed++;
        user.drinks = data.result.drinks;            
    })
    .catch(reason => Logger.error(reason))
))
.then(() => Logger.debug("UnExpected Result: " + JSON.stringify(this.users)));

answered Aug 4, 2016 at 0:46

Jaromanda X

57.1k6 gold badges82 silver badges96 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Vincent Over a year ago

As our drinks type is an array. That code will give syntax error: Argument type Promise<TResut>[] is not assignable to parameter type iterableShim<PromiseLike<T>|T>

Jaromanda X Over a year ago

is that a typescript limitation on what a promise can resolve to?

Vincent Over a year ago

I get this from Github: link But I think it should support common types

Jaromanda X Over a year ago

If there's a problem with an array and promises that's irrelevant to this as any promises are unaware of the data type of drinks. Look at the code.

Vincent Over a year ago

okay, as it returns an error what you could think of the problem is? I think type Promise<TResult>[] is to say some [] returned to Promise during mapping before it converted to any other type which iterableShim may accept.

Collectives™ on Stack Overflow

Modify array object by async method under async forEach loop

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related