[go: up one dir, main page]
Scribd
Upload
101 views12 pages

4 Javascript Jquery Advanced Techniques m4 Slides

Deferred objects in jQuery allow grouping of multiple asynchronous processes, attaching multiple success and failure handlers, and delaying logic flow until all processes complete in any order. They implement JavaScript promises to handle asynchronous behavior like AJAX calls. Deferred objects can be used to load dynamic content and ensure processing only occurs once all content is retrieved. They enclose asynchronous processes into a single flow and allow specifying handlers for success, failure, and completion regardless of result.

Uploaded by

Daniel Fedeles
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
101 views12 pages

4 Javascript Jquery Advanced Techniques m4 Slides

Deferred objects in jQuery allow grouping of multiple asynchronous processes, attaching multiple success and failure handlers, and delaying logic flow until all processes complete in any order. They implement JavaScript promises to handle asynchronous behavior like AJAX calls. Deferred objects can be used to load dynamic content and ensure processing only occurs once all content is retrieved. They enclose asynchronous processes into a single flow and allow specifying handlers for success, failure, and completion regardless of result.

Uploaded by

Daniel Fedeles
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 12

Advanced Techniques in JavaScript and jQuery

Using jQuery Deferred Objects

Kevin Murray
murmeister@hotmail.com
jQuery Deferred Object

 jQuery provides an alternate to callbacks for asynchronous processing


– Deferred
 Deferreds allow for
 Grouping multiple asynchronous processes
 Attaching multiple success and failure handlers
 Postpone logic flow until all asynchronous processes complete – in any
order
 Integration of AJAX and custom functions into asynchronous processing
jQuery Deferred Processing

 Implements the JavaScript promise


 AJAX calls
 Open a connection to an external resource
 Begin transfer of the resource
 Upon completion, execute success or failure callbacks
 Resolve or reject a promise
 Many developers just pass success or failure callback functions
 The returned promise is mostly ignored
Dynamic Content – Using Deferred

 jQuery Deferred
 Use “get” method instead of “load”
 “get” uses Deferred, “load” does not

 When / Then pattern


 Can include as many gets as desired
 Then processing only occurs once all When methods complete
 Extensible, but readability could be improved
Dynamic Content – loadSection()

 Create a function to load content


 Load specified URL into specified element
 Return the results of a “get” method
 Needs two parameters – for now
Dynamic Content – Negative Testing

 Negative testing
 Check bad URL
 Check bad section element
 Alternate syntax for When / Then
Deferred Methods

 Some methods available on deferred objects


 Return deferred object for a process flow
 when
 promise
 Attach handler functions to deferred object
 then
 done
 fail
 progress
 always
 Change state of deferred object
 resolve
 reject
Static Content vs Dynamic Content

 Dynamic pages vs static pages


 Scripts execute on loaded page
 Loaded page also loads embedded elements
 Loaded page may wait for user interaction
Creating a Deferred Object

 A self-managed deferred object is useful when


 Writing long-running processes
 Loading content that contains embedded content
 Wrapping a process flow into a single process

 Current state of affairs


 Proceed button enabled before dynamic content is loaded
 Meaningful error messages
 Only one error message per process flow
Using Deferred Objects

 Use a Deferred object in a function we create


 Notify when dynamic content is loaded
 Resolve or Reject deferred object as appropriate

 Combining deferred objects with custom events give maximum


flexibility in process control
 Functions that don’t return a deferred object are resolved
immediately – when embedded in a WHEN block
 An embedded deferred object that is rejected will cause the
containing deferred object to be rejected, also
 Negative testing is very important
Summary

 Deferred objects enclose asynchronous processes into a single


process flow
 Order of completion is not important
 Deferred objects can be used in our own functions
 Return a “promise” instead of a full deferred object
 Attach handlers with “done”, “fail”, and “always”
 “then” is a shortcut method for attaching handlers
 Functions that don’t return a Deferred object are considered resolved
immediately
Advanced Techniques in JavaScript and jQuery
Kevin Murray
murmeister@hotmail.com

You might also like