jQuery Deferreds and Promises

My introduction slides from the Omaha Front-end Web and jQuery meetup on November 1, 2011.

Transcript

1. jQuery Deferreds & Promises Eli Perelman @eliperelman
2. What are deferreds?
3. Provide a system to register callbacks into neatly managed queues DEFERREDS
4. WITHOUT DEFERREDS var  validateUser  =  function  (  username,  password,  callback  )  {          if  (  username  ===  ‘bob’  &&  password  ===  ‘123’  )  {                  callback(  ‘success’  );          }  else  {                  callback(  ‘failure’  );          }   };   validateUser(  ‘bob’,  ‘123’,  function  (  result  )  {          if  (  result  ===  ‘success’  )  {                  location  =  ‘/dashboard’;          }  else  {                  showError(  ‘Invalid  login.’  );          }   });    
5. WITH DEFERREDS var  validateUser  =  function  (  username,  password  )  {          var  deferred  =  $.Deferred();          if  (  username  ===  ‘bob’  &&  password  ===  ‘123’  )  {                  deferred.resolve();          }  else  {                  deferred.reject();          }          return  deferred.promise();   };   validateUser(  ‘bob’,  ‘123’  )          .done(  function  ()  {                  location  =  ‘/dashboard’;          })          .fail(  function  ()  {                  showError(  ‘Invalid  login.’  );          });    
6. Deferreds work with synchronous AND asynchronous functions.
7. Since jQuery 1.5, the $.ajax module uses deferreds.
8. What are promises?
9. Provide a common API for consuming code to register callbacks, sync or async. PROMISES
10. Deferreds Promises .then .then .done .done .fail .fail .always .always .reject .resolve .pipe .pipe .promise .promise .isResolved .isRejected
11. Coding time!