Significance of Promises in asynchronous Operations.

[abdulrazak]

Intro:

Hello,

I'm Writing my first blog on SAP community network, while developing the application and reviewing the other's code I came across this requirement. many new developers are feared to use the promises. and they develop a logic that is not convenient and increase the execution time.

In this blog I'm trying my best to describe how to use Promises and manage asynchronous operations.

This blog post delve into the world of promises in SAP UI5, exploring their importance and practical implementation.

What is Asynchronous programming?

Asynchronous programming plays a crucial role in modern web development and SAP UI5 developer as can leverage promises to streamline the asynchronous operations.

In asynchronous programming the operation is executed in the background by external process for this JavaScript engine uses the event loop and callback mechanism so the engine can perform the next operation/task in line. after completion of that task the asynchronous operation which is waiting in queue is completed.

In some cases our task is depend on the result of that asynchronous operation results and we get the wrong outcome because our asynchronous function is not executed and our dependant task is executed already, for that many developers use some weird logic of count and setTimeout(). and if the time set in timeout function is passed before executing the asynchronous operation then it will show the wrong result, Promise can help in this area.

 

Basics of Promise:

A promise is created using the 'Promise' constructor, which take a a single argument function known as "executor".

The executor function takes two arguments resolve and reject. These are the functions provided by the promise implementation.

State of promises:

• 
  

  Pending:

  
  This is the initial state when promise is created


• 
  

  Resolved:

  
  when promise is fulfilled. The promise transition to this state when 'resolve' function is called.


• 
  

  Rejected:

  
  when there is an error or the async operation fails. Promise transition to this state when the 'reject' function is called.

Consuming promise:

Once a promise is created you can use the '.then' method to handle the resolved state and '.catch

method to handle the rejected state.

Promise.all:

The 'Promise.all' method takes an iterable of promise and return a new promise that resolves when

all of the input promise have resolved or rejects.

 

Result:

async / await:

'async / await' is a feature in JavaScript that simplifies the handling of asynchronous code, It's build on top of promises and provides a more synchronous - looking syntax, making asynchronous code easier to read and write.

async function:

mark a function as 'async' by using 'async' keyword before the function declaration. This signifies that the function will always return a promise.

await operator:

Inside async function you can use the 'await' keyword before a promise to pause the execution of the function until the promise is resolved.

 

This make asynchronous operation looks like synchronous code.

await keyword only work with Parent level async function.

Wrong example:

above function will throw an error because the await keyword only work with parent level async function here forEach callback function is parent level function so I have to

make the forEach function async.

Correct Example:

Conclusion

The use of  promises or async / await and the combination of both is depend on the requirement of the project. promises helps to manipulate the asynchronous operation as per developer need.

You can write your thoughts and questions in the comment section. If you think this blog is helpful please do not forget to like and share 🙂 .