Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
JS Promises
to callback hell and back
by Adam Winick
email: dev@adamwinick.com
github.com/sinelanguage/
soundcloud.com/sin...
Pleased to meet you
• Electronic musician, passionate developer, devoted father
• Sr Web Developer at Real Matters
• Curre...
Why another presentation on
promises?
• This is the intro to promises I wish I had before reading all the currently
availa...
What are Promises?
• As a programming concept : 

A promise represents the eventual result of an asynchronous operation
• ...
Why do we need Promises in Javascript?

Why should we care?
• JS functions at their core are synchronous

They execute log...
Demonstrate what you mean using code :
We now have behaviour formally reserved for synchronous logic :



1. Flattened callbacks
2. Return values from asynchrono...
Differences between callbacks and promises
1. Callbacks are functions, promises are objects
Callbacks are just blocks of co...
Promise you will show me a promise (object)
asynchronous fn returning a promise instead of relying on a cb
but what if my cb based fn doesn’t return a promise and I can’t modify it
Let’s see that again with a core node function like fs.readFile()
callback hell example tbt
solved with promises example tbt
Upcoming SlideShare
Loading in …5
×

Avoiding callback hell with promises

734 views

Published on

Adam Winick presents at the Fall 2015 Toronto Node.js meetup.

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Avoiding callback hell with promises

  1. 1. JS Promises to callback hell and back by Adam Winick email: dev@adamwinick.com github.com/sinelanguage/ soundcloud.com/sinelanguage
  2. 2. Pleased to meet you • Electronic musician, passionate developer, devoted father • Sr Web Developer at Real Matters • Current project is a realtime web app using jHipster (Angular/ SpringMVC/Node with a dash of D3) in production and currently supporting a migration to React • UI Designer • Front End Developer / JavaScript SPAs • iOS • NodeJS
  3. 3. Why another presentation on promises? • This is the intro to promises I wish I had before reading all the currently available intro to promises • Not enough focus on the core promise concept, a library (and a library specific API) is introduced before all the concepts are explained: except for this article:
 
 http://robotlolita.me/2015/11/15/how-do-promises-work.html • Now that we have a Promise Spec, we can start writing promises lean and native without a library specific API
  4. 4. What are Promises? • As a programming concept : 
 A promise represents the eventual result of an asynchronous operation • They are there to help manage complexity in the order of execution of our functions in our apps. • As a ECMA Specification :
 We finally have a Promise Specification and several implementations
 ES6’s native promise have adopted the Promise/A+ Spec:
 https://promisesaplus.com/
 
 In these implementations, at their core they give developers use of a “promise” object or function with a then method whose behaviour conforms to the Promise Specification.
  5. 5. Why do we need Promises in Javascript?
 Why should we care? • JS functions at their core are synchronous
 They execute logic, return values, and throw exceptions • Modern JS in 2015 ( Node, consuming API’s, data fetching ) is mostly asynchronous
 You can’t return values if they aren’t ready. 
 You can’t throw exceptions, if nobody’s there to catch them.
 So we use callback functions to manage the order of execution.
 In complex situations this can result in “callback hell”. • How do JS promises save me from hell ?
 The point of promises is to give us back functional composition and error bubbling in the async world. They do this by saying that your functions should return a promise(an eventual result), which can do one of two things:
 
 Become fulfilled by a value
 Become rejected with an exception

  6. 6. Demonstrate what you mean using code :
  7. 7. We now have behaviour formally reserved for synchronous logic :
 
 1. Flattened callbacks 2. Return values from asynchronous function 3. Throw and Catch exceptions
 
 For a Promise to make (2) and (3) work, the asynchronous function itself should return a Promise Object. This Promise object has two methods, then and catch. The methods will later be called depending on the state (fulflled || rejected) of the Promise Object.
 
 The next question is: How do we convert an asynchronous function to return a Promise Object?
  8. 8. Differences between callbacks and promises 1. Callbacks are functions, promises are objects Callbacks are just blocks of code which can be run in response to events such as as timers going off or messages being received from the server. Any function can be a callback, and every callback is a function. Promises are objects which store information about whether or not those events have happened yet, and if they have, what their outcome is. 2. Callbacks are passed as arguments, promises are returned Callbacks are defined independently of the functions they are called from – they are passed in as arguments. These functions then store the callback, and call it when the event actually happens. Promises are created inside of asynchronous functions (those which might not return a response until later), and then returned. When an event happens, the asynchronous function will update the promise to notify the outside world. 3. Callbacks handle success and failure, promises don’t handle anything Callbacks are generally called with information on whether an operation succeeded or failed, and must be able to handle both scenarios. Promises don’t handle anything by default, but success and failure handlers are attached later. 4. Callbacks can represent multiple events, promises represent at most one Callbacks can be called multiple times by the functions they are passed to. Promises can only represent one event – they are either successful once, or failed once
  9. 9. Promise you will show me a promise (object)
  10. 10. asynchronous fn returning a promise instead of relying on a cb
  11. 11. but what if my cb based fn doesn’t return a promise and I can’t modify it
  12. 12. Let’s see that again with a core node function like fs.readFile()
  13. 13. callback hell example tbt
  14. 14. solved with promises example tbt

×