Quick Left

This is a blog

GIFs, tech and stuff.

jQuery 1.5 Hotness PART 1


jQuery 1.5 just came out, which means it's time to learn up!

Every time a library version gets bumped, I look through release notes and relate what all these new changes really mean, and how they are going to change the way I code. The most exciting part of web development is that technology changes so often. This allows developers to change the way they write code frequently. It never gets boring!

jQuery 1.5 brings us three new methods: hasData, parseXML, and sub. Along with these new methods and several edits to existing methods, jQuery 1.5 also brings us a rewrite of the Ajax module by Julian Aubourg and an entire set of wonderful methods used to manage jQuery's new deferred system.

I set up some Fiddles for these new methods so you can jump in and play:

jQuery.hasData() - Determine whether an element has any jQuery data associated with it.

Will return true/false depending on whether or not data has been assigned via jQuery.data(). Before, you could eval by grabbing the data object and evaluating it's length, but this creates a new object to evaluate against, even if there is no data associated with that object. The cool thing about jQuery.hasData() is that it doesn't create / associate an object with that element if it doesn't have any. Less time, less malloc, more awesome.

Example:

Play with me on jsFiddle!

jQuery.parseXML() - Parses a string into an XML document.

Before: Get some XML and throw it through an XML parsing method that iterates through the XML, building a new object I can play with.

After: Pass my XML data object into jQuery.parseXML() and it's ready to play with. Using this new method will probably save me several glorious minutes that I can spend playing with unicorns instead. (Note: make sure you throw that parsed object into a jQuery obj: var xml = $(parsedXML) )

Play with me on jsFiddle!

jQuery.sub() - Creates a new copy of jQuery whose properties and methods can be modified without affecting the original jQuery object.

As stated in the documentation, there are two primary reasons for jQuery.sub(): overriding jQuery methods without destroying the original methods and performing encapsulation and namespacing for plugins. I've been using sub to attach actions to jQuery core methods on a view level. Here's a really basic example of using jQuery.sub() for debugging in closure scope:

Example:

Play with me on jsFiddle!

Now, on to the really cool stuff: Julian Aubourg's AJAX module rewrite. There's lots of new features here with how jQuery.ajax() is called and what it returns (out with XMLHTTPRequest, in with jqXHR), but I'm most interested in the built-in deferred/promise system. (Check out Episode 21 of yayquery http://yayquery.com/ to hear more about the jqXHR object)

deferred.done() - Add handlers to be called when the Deferred object is resolved.

deferred.fail() - Add handlers to be called when the Deferred object is rejected.

deferred.isRejected() - Determine whether a Deferred object has been rejected.

deferred.isResolved() - Determine whether a Deferred object has been resolved.

deferred.promise() - Return a Deferred's Promise object.

deferred.reject() - Reject a Deferred object and call any failCallbacks with the given args.

deferred.rejectWith() - Reject a Deferred object and call any failCallbacks with the given context and args.

deferred.resolve() - Resolve a Deferred object and call any doneCallbacks with the given args.

deferred.resolveWith() - Resolve a Deferred object and call any doneCallbacks with the given context and args.

deferred.then() - Add handlers to be called when the Deferred object is resolved or rejected.

jQuery.when() - Provides a way to execute callback functions based on one or more objects, usually Deferred objects that represent asynchronous events.

You didn't think I was going to spill it all in PART 1 did you? Stay tuned for some really cool uses for jQuery deferreds / promises in jQuery 1.5 Hotness PART 2!