What is the Deferred Object in jQuery for?

Question

I’m studying a little jQuery and I found that interesting.

The problem is I don’t quite understand.

What is the Deferred Object in jQuery for?

How this can become useful when using jQuery?

Answer 1

What good is?

It server for asynchronous processing treatment. For example:

   var timer;
(function process() {
$('#output').html('Estou carregando angula coisa…');
var deferred = $.Deferred();

/* Aqui vc define um tempo de notificacao no caso 1 segundo */
timer = setInterval(function() {
    deferred.notify();
}, 1000);

/* Esse timeout simula o tempo de resposta */
setTimeout(function() {
    clearInterval(timer);
    deferred.resolve();
}, 10000);

return deferred.promise();
})().then(function() { 
/* Esse cara é chamado quando termina o processamento assíncrono */
$('#output').html('Terminei de carregar. Agora vou fazer algo!!!'); 
}, null, function() { 
/* Esse cara é notificado a cada segundo enquanto o processamento não for finalizado */
$('#output').html($('#output').html() + '.'); 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="output" />

In this example we have a routine that is executed for a certain time. This routine can be compared to the loading of a page via js. Imagine that you need to download a json-shaped file from any page. When you finish you will need to run something. There is the possibility for you to perform synchronous processing, but the message below may occur that can change from browser to browser.

When to use?

You should always use any system routine that is treated asynchronously and you need the page returned to perform a specific treatment. For example, in the load of an image via js or even in the load of another js that needs to be asynchronous.