Assigning result of a resolved Promise to a variable

Question

I have a service that has a function that returns a Promise;

service.getStuff(); // returns a Promise of an array; I'm interested in the field 'cool stuff'

In a separate service, I want to grab the result of that resolved promise and assign it to a global variable, like so:

scope.coolStuff = {resolved value of service.getStuff()['cool stuff']}

I've tried doing this:

service.getStuff()
    .then(function(stuff) {
        scope.stuff = stuff['cool stuff'];
    });

However, console.logging scope.stuff later shows that that value isn't defined. What am I missing here? Thanks in advance!

To confirm, the type of `stuff` is an array and not an object? — Ben Rondeau, Mar 23 '21 at 03:02
Yeah, so `service.getStuff()` returns a promise that, when resolved, is an array — user319407, Mar 23 '21 at 03:05
According to this post: https://stackoverflow.com/questions/41091818/assign-resolve-values-to-global-variables-promises This isn't allowed, but I wanted to confirm/see what other options there are — user319407, Mar 23 '21 at 03:05
service.getStuff() .then(function(stuff) { scope.stuff = stuff['cool stuff']; console.log(scope.stuff); }); console.log(scope.stuff); /** * prints: * undefined * true **/ — user319407, Mar 23 '21 at 03:14
So that is not an array... I am wondering what the value returned from the promise is. Does that make sense? — Ben Rondeau, Mar 23 '21 at 03:16
Sorry, formatting is weird, but essentially if I put a console.log of `scope.stuff` right under `scope.stuff = stuff['cool stuff'];`, as well as under that entire code block, then i get `undefined` and then `true` — user319407, Mar 23 '21 at 03:17
Oh gotcha, so if I print `stuff` from within that code block: it prints [object Object] — user319407, Mar 23 '21 at 03:18
So you are getting an `object` back and not an `array`, hence why you are getting `undefined` when trying to run `stuff['cool stuff']`. What is the contents of the `object` returned from the promise? — Ben Rondeau, Mar 23 '21 at 03:20
console.log(Object.keys(stuff)) --> prints out `cool stuff` Sorry, to be clear: console.log(stuff['cool stuff]) from within that code block is printing expected value of 'true' — user319407, Mar 23 '21 at 03:24

score 0 · Answer 1 · answered Mar 23 '21 at 03:27

The thing you need to know about promises, is that they are wrapping code that happens asynchronously. That is, outside of the normal control flow of your program. It is quite straightforward to set a continuation function on a promise as a callback to then() to register code to be run after the promise has resolve like below:

function doSomething(result) {
// some code
}

myPromise.then(doSomething).then((result) => {
 doAnotherThingInAnAnonymousFunction();
 console.log(result);
 console.log('this happens after doSomething()');
});

It can take a little getting used to using continuation functions in this manner. If you want to jump ahead and get right to something that is more familiar to you, you can just wrap your code in an async/await pattern and it will appear to work just like your asynchronous code (but believe me, it's using Promises and continuation functions under the hood).

async function doAsyncStuff() {
  const result = await service.getStuff();
  scope.stuff = result['mine'];
  console.log(scope.stuff); // this is up to date because of the await above
}

Read on for more information: https://www.oreilly.com/library/view/you-dont-know/9781491905241/ch04.html

This stuff is rather central to JS development and I suggest you take some time on it.

Assigning result of a resolved Promise to a variable

1 Answers1