jQuery 1.5 Released: What is new?

As they promised, jQuery Team released a new version of jQuery today. It has come a long way from its initial version and has become one of the most used JavaScript frameworks in the world.

I will try to tell you the exciting news in the new version.

As the new version is released, the jQuery Team updated their jQuery 1.5 API Documentation which is very useful and handy.

The biggest news is jQuery.sub() which allows a developer to override native jQuery methods without actually affecting the methods that other users would interact with – or even create encapsulated APIs for your plugins that avoid namespace collision. There are more news like the complete rewrite of the Ajax module, Deferred Objects and many more.

New jQuery AJAX

The jQuery Team rewrote the whole jQuery AJAX module. This rewrite helps to fix a lot of gaps that existed in the old Ajax system along with providing a higher level of consistency across the API.

Perhaps the largest change is that a call to jQuery.ajax (or jQuery.get, jQuery.post, etc.) now returns a jXHR object that provides consistency to the XMLHttpRequest object across platforms (and allows you to perform previously-impossible tasks like aborting JSONP requests).

jQuery AJAX now returns a jXHR Object for backwards compatibility with old XMLHttpRequest

The jQuery XMLHttpRequest (jXHR) object returned by $.ajax(), as of jQuery 1.5, is a superset of the browser’s native XMLHttpRequest object. For example, it contains responseText and responseXML properties, as well as a getResponseHeader() method. When the transport mechanism is something other than XMLHttpRequest (for example, a script tag for a JSONP request) the jXHR object simulates native XHR functionality where possible.

There are three new functionalities for sending, receiving and managing AJAX requests:

Prefilters

A prefilter is a callback function that is called before each request is sent, and prior to any $.ajax() option handling.

Converters

A converter is a callback function that is called when a response of a certain dataType is received while another dataType is expected.

Transports

A transport is an object that provides two methods, send and abort, that are used internally by $.ajax() to issue requests. A transport is the most advanced way to enhance $.ajax() and should be used only as a last resort when prefilters and converters are insufficient.

Other significant thing is defining Custom Data Types. The jQuery Ajax implementation comes with a set of standard dataTypes, such as text, json, xml, and html. Use the converters option in $.ajaxSetup() to augment or modify the data type conversion strategies used by $.ajax().

Full AJAX documentation is available here.

Deferred Objects

This API allows you to work with return values that may not be immediately present (such as the return result from an asynchronous Ajax request). Additionally it gives you the ability to attach multiple event handlers (something that wasn’t previously possible in the Ajax API).

For example:

[code lang=”javascript”]
function doSomethingFancy(){
return $.get(‘somescript.php’);
}

function doSomethingMagical(){
return $.get(‘magical.php’);
}

$.when( doSomethingFancy(), doSomethingMagical() )
.then(function(){
// do something when both methods succeed
})
.fail(function(){
// do something when one or both methods fail
});
[/code]

This fancy piece of code works because jQuery AJAX now returns an object which contain a promise for tracking the asynchronous request.

To find out more go to Deferred Objects documentation.

Here you can find a comprehensive tutorial on Using Deferreds in jQuery

jQuery.sub()

jQuery Team made this possible to override native jQuery methods without compromising or destroying them and to provide encapsulation and basic namespacing for jQuery plugins.

The best thing to see it on work is this example taken from jQuery site:

[code lang=”javascript”]
(function() {
var myjQuery = jQuery.sub();

myjQuery.fn.remove = function() {
// New functionality: Trigger a remove event
this.trigger("remove");

// Be sure to call the original jQuery remove method
return jQuery.fn.remove.apply( this, arguments );
};

myjQuery(function($) {
$(".menu").click(function() {
$(this).find(".submenu").remove();
});

// A new remove event is now triggered from this copy of jQuery
$(document).bind("remove", function(e) {
$(e.target).parent().hide();
});
});
})();
[/code]

With jQuery.sub() the imagination is your limit. You can extend the framework even further without destroying its core.

This is really a significant release and I hope that developers around the world will use its benefits to build even more responsive applications.

What do you think about new release of jQuery? Express your opinion in comments below.