I have a conditional statement in which I need to perform one of two operations, then continue after whichever operation has resolved. So my code currently looks as follows:
if (shoud_do_thing_a) { //should_do_thing_a is just a variable that determines which function to call. it is not a promise do_thing_a() } else { do_thing_b() } // more code
The issue is that both do_thing_a
and do_thing_b
return promises, and I can't move on until whichever gets executed has resolved. The best way I've come up with to solve this is like this:
var more_code = function () { // more code } if (shoud_do_thing_a) { do_thing_a().then(more_code) } else { do_thing_b().then(more_code) }
I don't like this structure. It's difficult to follow because you need to jump around to find where more_code
is defined (imagine I have this type of control flow in several locations), rather than simply being able to continue reading.
Is there a better way to deal with this type of thing in javascript?
Here we need to first declare a Promise by using the Promise syntax, and we will be using the then() method for its execution and then inside that then() method we will create another promise by using the same Promise syntax as illustrated above, and then we will call our result of first inside that new Promise.
To use Javascript promises in a for loop, use async / await . This waits for each promiseAction to complete before continuing to the next iteration in the loop. In this guide, you learn how async/await works and how it solves the problem of using promises in for loops.
Nested Promise: In a promise nesting when you return a promise inside a then method, and if the returned promise is already resolved/rejected, it will immediately call the subsequent then/catch method, if not it will wait. If promised is not return, it will execute parallelly.
Inside an async function, you can use the await keyword before a call to a function that returns a promise. This makes the code wait at that point until the promise is settled, at which point the fulfilled value of the promise is treated as a return value, or the rejected value is thrown.
If you can use async/await
async function someFunc() { var more_code = function () { // more code } if (shoud_do_thing_a) { await do_thing_a() } else { await do_thing_b() } more_code() }
Or if you can't, use then()
:
var more_code = function () { // more code } var do_thing; if (shoud_do_thing_a) { do_thing = do_thing_a() } else { do_thing = do_thing_b() } do_thing.then(more_code)
If you're stuck with raw Promises and can't use async/await
(You usually should have no trouble, what with babel/typescript etc), the following is a bit more elegant than storing the promise in a variable:
function something() { return Promise.resolve() .then(() => { if (should_do_thing_a) { return do_thing_a(); } else if (should_do_thing_b) { return do_thing_b(); } }) .then(some_more_code); }
Note that when you start working with Promises, your functions should always return a Promise that other functions can work with. Leaving an asynchronous action without any way to handle it means bad things, especially when it comes to error handling.
In a more general sense, it means that when you use Promises, more of your code is "uplifted" into being executed and returned as Promises.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With