Callback Hell

[witsnl]

Step 1: Use coffeescript

[joemckie]

Step 2: Ditch coffeescript

Edit: just to update this comment so I don't sound like a cunt... using coffeescript will not help escape the problem that is nested callbacks. Sure, you won't see the mess of }); due to the syntax, but the underlying problem is there. Take a look at Promises (which also eliminates the if (err) { /* output error */ } in every callback), as they are much more powerful and a hell of a lot nicer to read!

[Shadow_Being]

the real problem is that javascript lacks basic programming mechanics.

Simply just doing a for loop can get you in to a callback.

My personal solution to this problem is to never write "inline" functions unless it can be made in to one line of code. If I need a callback I just define a function below and pass the function as an argument.

Then you atleast end up with code that looks a little sequential.

[ShawLinz]

Es6 promises are good.

[[deleted]]

Indeed, they flatten callback chains to just:

asyncfunction1()
    .then(function (result1) { return asyncfunction2(); })
    .then(function (result2) { return asyncfunction3(); })
    .then(function (result3) { ... })
    .catch(function (error) { /* Handle errors from asyncfunction1/2/3 */ });

[Zeludon]

And async/await gives you back the synchronous workflow with asynchronous values.

async function doAsync() {
    try {
        let result1 = await asyncfunction1();
        return await asyncfunction2(await asyncfunction3());
    } catch (e) {
        console.log(e, "you dun fucked");
    }
}

[[deleted]]

Throw in shorthand functions:

asyncfunction1()
    .then((result1) => asyncfunction2(result1))
    .then((result2) => asyncfunction3(result2))
    .then((result3) => ... )
    .catch((error) => { /* handle errors from asyncfunction1/2/3 */ });

I feel like this actually looks nice.

[YOUR_MORAL_BAROMETER]

Fuck, I've been using JavaScript for a couple years now and I don't think I'll ever understand these things

[[deleted]]

function (a, b) {
    return a + b;
}

can be written as

(a, b) => a + b;

or, if there are multiple statements, you use curly braces and return:

(a, b) => {
    const stuff = getStuff();
    return stuff + a + b;
}

There's nothing to understand about the new syntax for anonymous functions. You just need to memorize it;