Resolving JS Promises Transparently

1 minute read Published:

We finally have support for promises in all modern browsers. They give us a nice abstraction to escape callback hell.

Usually you see promises used like this:

return slizeBread()

But, if you resolve the promise inside the consuming function you can write code that looks like old fashioned procedural code, but actually works asynchronously thanks to promises.

const takeSlize = (slizedBreadPromise) => {
  slizedBreadPromise.then(slizedBread => {
    // do something

// more function definitions

const slizedBread = slizeBread();
const slize = takeSlize(slizedBread);
const butteredBread = addButter(slize);
return addCheese(butteredBread);

The chained style saves you some code and emphasizes that you just work on the results from the previous function.

But if you have resources being used by more than one function and functions taking more than one argument I find the alternative more readable and easier to work with.