JavaScript Promises/Synchoronous/Asynchronous - Part 1

[RAMANA MURTHY G]

Hello folks,

Here I am sharing a few insights on JavaScript Synchronous/Asynchronous calls and JavaScript Promises. 

What is Synchronous in JavaScript?

Synchronous means one task at a time, in order.

JavaScript executes code line by line, waiting for each line to complete before proceeding to the next.

E.g.:

console.log("Start");
console.log("Processing….");
console.log("Done");

/* 
Output:
Start
Processing….
Done
*/

It follows top-to-bottom execution, and each line waits for the previous line.

What is Asynchronous in JavaScript?

Asynchronous means some tasks can take time (like fetching data from the internet), so JavaScript doesn’t wait and continues with other tasks.

Example using setTimeout:

console.log("Start");
setTimeout(function () {
  console.log("Processing");
}, 2000);
console.log("Can’t wait for the Previous task");

/* Output:
Start
Can’t wait for the Previous task 
Processing   */

Note:  setTimeout() runs after 2 seconds, doesn’t block the rest of the code

Real-world Example: Fetching from Internet (API)

fetch('https://official-joke-api.appspot.com/random_joke')
    .then(response => response.json())
    .then(data => {
        console.log('Setup: '+data.setup);
        console.log('Punchline: '+data.punchline);
    })
    .catch(error => {
        console.log('Error: '+error);
    });

// Here is used the existing Free Javascript APIs, if you want you can try with any other APIs

• fetch() returns a Promise
• .then() handles success
• .catch() handles error

Note: 

We can connect multiple .then() blocks & .catch() blocks like the above example, which is called Chaining Promises. 

Points to remember:

• JS is single-threaded, but with asynchronous behavior using Promises, fetch(), async/await.
• Promises help you deal with code that doesn’t complete immediately.

More on JavaScript Promises - Part 2, please check out article below 

🔗Understanding Promises in JavaScript – Part 2 

Please mark as helpful if you found my articles useful

Thank you

Ramana Murthy G

ServiceNow Developer