27

Let's create a simple Deferred object:

defer = $.Deferred( function ( defer ) {
    setTimeout( defer.resolve, 3000 );
});

The above Deferred object will be in the "pending" state for 3 seconds, and then switch to the "resolved" state (at which point all the callbacks bound to it will be invoked).

Let's also retrieve the promise of that Deferred object:

promise = defer.promise();

Now, to add callbacks which are going to be invoked once the Deferred object is resolved, we can use .done() or .then(). However, we can invoke this method both on the Deferred object itself or its own promise object.

defer.then( handler );

or 

promise.then( handler );

In both cases, the handler function will be invoked (after 3 seconds in this case).

If we use $.when, we can again pass the Deferred object itself or its promise object:

$.when( defer ).then( handler );

or 

$.when( promise ).then( handler );

Again, there is no difference between the above two lines of code.

Live demo: http://jsfiddle.net/G6Ad6/

So, my question is since we can invoke .then(), .done(), etc. on the Deferred object itself and since we can pass that Deferred object into $.when(), what's the point of .promise() and retrieving the promise object? What's the purpose of the promise object? Why is there this redundancy in functionality?

Šime Vidas
  • 182,163
  • 62
  • 281
  • 385

3 Answers3

25

It creates a "sealed" copy of the deferred value, without the .resolve() and .reject() methods. From the documentation:

The deferred.promise() method allows an asynchronous function to prevent other code from interfering with the progress or status of its internal request.

It's used when it doesn't make sense for the value to be modified. For example, when jQuery makes an AJAX request it returns a promise object. Internally it .resolve()s a value for the original Deferred object, which the user observes with the promise.

Jeremy
  • 1
  • 85
  • 340
  • 366
  • 1
    Ah it's a sealed copy *duh*... that explains it. – Šime Vidas Nov 10 '11 at 00:18
  • 1
    To add on to this which made it much clearer to me, from the [docs](http://api.jquery.com/Types/#Promise): "Promise Object - This object provides a subset of the methods of the Deferred object (then, done, fail, always, pipe, and state) to prevent users from changing the state of the Deferred." – Nick M Feb 09 '15 at 04:46
2

When using the "promise" of a Deferred object the observers (objects waiting for resolve for exemple) dont have direct access to the Deferred object itself, so they can't call, for exemple, the method "Resolve" of that Deferred. It is a way of protecting the original Deferred.

ElLocoCocoLoco
  • 387
  • 3
  • 11
0

With Deferred, you can control its state set.

When it comes to the Promise, you can read state and maybe attach callback. get

serkan
  • 6,885
  • 4
  • 41
  • 49