callback hell – What is “callback hell”? – Callback Hell, Promises, and Async/Await

callback hell – Callback hell is subjective. A Callback is a function “First” that is passed to another function “Second” as a parameter.

We call that “callback-hell”, and it’s called “hell” for a reason.

callback hell

all the People affectionately call this pattern the callback hell. There’s even a site called callbackhell that explains this subject in information.

What is Callback Hell?

For Example:

allsum(2,function(addRes,err){
    if(!err){
         allminues(addRes,function(subRes,err){
          if(!err){
            everydouble(subRes,function(mulRes,err){
                console.log(mulRes);
                
               }); 
            }
         });
    }
});

function allsum(ans,callback){
  callback(ans+5,false);
}
function allminues(ans,callback){
    callback(ans-3,false);
  }
  function everydouble(ans,callback){
    callback(ans*5,false);
  }

This is what we call callback hell.

Read Also:  How to Open URL in New Window using jQuery?

In the above code, there is three operation allsum, allminues and everydouble.

Techniques for avoiding callback hell

Handling callbacks hell using promises

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

  promise.then(allsum).then(allminues).then(everydouble).then((msg)=>{
    console.log('Final results: '+msg );
  }).catch((err)=>{
console.log(err);
  });

  function allsum(ans){
    return (ans+5);
  }

  function allminues(ans){
    return (ans-3);
  }
  function everydouble(ans){
    return (ans*5);
  }

Don’t Miss : how to trigger an event in input text after i stop typing/writing react native?

I hope you get an idea about callback hell.
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.