callback vs promise (async/await vs callback performance)

callback vs promise vs async/await – A callback is a function that is to be executed after another function has finished executing. Promises try to fix this nesting problem.

Callbacks and Promises are two common ways to handle asynchronous code in JavaScript.

callback vs promise

Callbacks, Promises, and Async – Await is basically syntactic sugar for Promises. Promises have some similarities to native-style callbacks. also here we learn to difference between callback and promise in javascript.

What is difference between Callback and Promise with example?

Callback:

Callbacks are functions that are passed as arguments to other functions, and are executed when the parent function completes. For example, when making an AJAX request, a callback function can be passed as an argument to handle the response once it is received. Callbacks can make code difficult to read and maintain when dealing with multiple levels of nested callbacks, commonly referred to as “callback hell.”

setInterval(function() {
  console.log('Welcome to Pakainfo!');
}, 1000);

Example:

function sum(data)
{
    return data+1;
}
 
function answers(callback)
{    
 
    return callback(2);
}
 
console.log(answers(sum)); // Result: 3

In the above best example, sum() is a function as well as here it is passed to function answers() as a callback.

Promise:

Promises, on the other hand, provide a cleaner and more maintainable way to handle asynchronous code. Promises represent a value that may not be available yet, but will be resolved in the future. Promises can have a “then” method attached to them, which takes two callbacks as arguments: one for when the promise is resolved successfully, and one for when it is rejected with an error. Promises can also be chained together to simplify code, and have additional methods like “catch” for error handling.

let promise = new Promise(function(resolve, reject) {
   // promise description
});

Promise Example

var temp=true
var promise = new Promise(function(resolve, reject) {
  // do a thing, possibly async, then…
 
  if (temp) { 
  /* Good Luck, everything worked successfully */
    resolve("Welcome to Pakainfo");
  }
  else {
    reject(new Error("sorry, oopsss Failure"));
  }
});
 
promise
  .then(function(res) {
    // the data main content from the resolve() is here - Welcome to Pakainfo
  })
  .catch(function(err) {
    // the error object from the reject() is here - Failure
  });

Overall, Promises are generally preferred over Callbacks for handling asynchronous code in JavaScript, as they provide a cleaner and more readable code structure, and help avoid the problem of “callback hell.” However, it’s important to note that both approaches have their uses and limitations, and it’s ultimately up to the developer to decide which approach is most appropriate for their specific use case.

Basic Difference Between Callback and Promise

Callback:

function finalAnswer(x)
{
    return x+2;
}

function genrateData(y)
{
    //run y

    return y(5);
}

console.log(genrateData(finalAnswer)); // Result: 7

Here finalAnswer() is a javascript function. I am passing it as a callback to function genrateData(). Function genrateData() may or may not run it asynchronously.

Here callback is executed asynchronously.

Promise:

var promise = new Promise(function(resolve, reject) {
  // do a thing, possibly async, then…

  if () { 
  /* everything turned out fine */
    resolve("Complecated Idea!");
  }
  else {
    reject(Error("oopss, Sorry Dear"));
  }
});

promise.then(function(result) {
  console.log(result); // "Complecated Idea!"
}, function(err) {
  console.log(err); // Error: "oopss, Sorry Dear"
});

var promise = new Promise(function(resolve, reject) {

  if () { 
  /* Good Luck, everything turned out fine */
    resolve("Complecated Idea!");
  }
  else {
    reject(Error("oopss, Sorry Dear"));
  }
});

promise.then(function(result) {
  console.log(result); // "Complecated Idea!"
}).catch(function(err) {
  console.log(err); // Error: "oopss, Sorry Dear")
});

Don’t Miss : how to return value from ajax success: function in jquery?

I hope you get an idea about callback vs promise.
I would like to have feedback on my infinityknow.com.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.