const delay = ms => new Promise(res => setTimeout(res, ms));
async function notInstant() {
await delay(1);
return 1;
}
(async function() {
let a = notInstant();
console.log(a);
await delay(10000);
console.log("Still a promise after 10 seconds even though the function only waits for 1 millisecond =>", a);
a = await a;
console.log("Printing directly after but now is resolved with the correct value", a);
})();
I know that I shouldn't rely on setTimeout for these kinds of things, but I don't understand why printing the result after 10 seconds still gives an unresolved promise even though the function called only waits for 1 millisecond before returning a value. Then using await makes the result directly available for some reason.
This example illustrates the principle you're observing:
let a = {};
console.log(a);
a.val = 1;
console.log(typeof a); // still an object even though `a` has a value
a = a.val;
console.log(typeof a); // now it's a number
The original promise returned from notInstant will always be a promise. await basically extracts the resolved value from the promise for you. The only reason a ends up being a value in your example is that you're setting it to the result of the await expression.
If you wanted to set a to the result of its promise when it completes, but avoid awaiting it, you could use its then method to affect a state change, like this:
const delay = ms => new Promise(res => setTimeout(res, ms));
async function notInstant() {
await delay(1);
return 1;
}
(async function() {
let a = notInstant();
console.log(a);
a.then(n => a = n);
await delay(1000);
console.log("a has its value now; we waited long enough", a);
})();
That's probably not a great pattern to follow (reusing the variable to represent both the promise and the value), but hopefully it helps teach the principle.
from the docs:
The await expression causes async function execution to pause until a Promise is settled (that is, fulfilled or rejected), and to resume execution of the async function after fulfillment. When resumed, the value of the await expression is that of the fulfilled Promise.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/await
So, as mentioned by DaveG, with out calling the await, you are just holding the promise
Notice that async functions return a promise.
And you need await to get the value of the promise.
here is what MDN says about it:
A Promise which will be resolved with the value returned by the async function, or rejected with an exception thrown from, or uncaught within, the async function.