What is Callback, Promise ,Async await in Javascript ? - Free Web Development || UI Development || React JS || Angular

Latest

Free Web Development ||Free UI Development || React JS || HTML5 || CSS3 || JavaScript || Angular Learn Web Development || Frontend Developer || Full Stack Developer

1 / 3
Welcome to Shravan Ghanchi

Sunday, March 16, 2025

What is Callback, Promise ,Async await in Javascript ?


What is callback function in Javascript ?

A callback in JavaScript is a function that you pass as an argument to another function, which is then executed at a later time. This technique is often used to handle asynchronous operations, ensuring that certain tasks are completed before others run.



What is promise in Javascript ?

A promise in javaScript object which is used to handle asynchronous operations. It represents a value that may be available now, in the future, or never. Promises are especially useful when dealing with tasks like API calls, file reading, or timers.

 States of a Promise:

1.      Pending: The initial state, neither fulfilled nor rejected.

2.      Fulfilled: The operation completed successfully.

3.      Rejected: The operation failed.


What is async and await in javascript ?

async and await are modern JavaScript features that make working with asynchronous code much simpler and more readable. They allow you to write asynchronous code in a way that looks and behaves like synchronous code, which is easier to understand and maintain.

async

  •          Used to declare a function as asynchronous.
  •          An async function always returns a Promise. If a value is returned, it is automatically wrapped in a resolved promise.

await

  •  Used inside async functions.

  • Pauses the execution of the async function until the Promise is resolved or rejected.


 How it works:

1.      fetchData simulates an asynchronous operation using a Promise and a setTimeout.

2.      The await keyword pauses execution of displayData until fetchData resolves.

3.      This makes the flow of code appear sequential, even though it's asynchronous.

If there's an error during the operation, you can handle it using try...catch:


     The key difference between a callback and a promise in JavaScript lies in how they handle asynchronous operations and manage flow control. Here's a breakdown to clarify:

1 1. Callback

  •    A callback is a function passed as an argument to another function. It is called when an operation completes, either successfully or with an error.

  •     The main downside of callbacks is that they can lead to callback hell (deeply nested callbacks), making the code harder to read and maintain

2. Promise  

A promise is an object that represents a future value. It provides cleaner and more structured ways to handle asynchronous tasks by chaining methods like .then() and .catch().

 

Promises help avoid callback hell, making the code easier to read and debug.

 

Example:



Here's a comparison table highlighting the differences between Promises and Callbacks in JavaScript:















No comments:

Post a Comment

Snow
Forest
Mountains
Snow
Forest
Mountains