Objetos y Funciones Diferidas en jQuery

Las funciones diferidas en jQuery de Javascript

Los objetos diferidos son aquellos que permiten administrar procesos que no existen en el presente pero que se cuentan con ellos en un instante futuro.

A partir de la versión 1.5 de jQuery se incrementan las posibilidades (success y error) que ya existían para gestionar las situaciones que se plantean con las consultas AJAX asíncronas.

Dentro de este contexto las mejoras consisten en tener la posibilidad de sacar fuera de la consulta las funciones que se precisan ejecutar. La consulta AJAX, mediante la consulta,  delega a cada función la ejecución sin necesidad de estar pendiente de la finalización.

Hay que tener presente que estos objetos diferidos no se limitan a las consultas AJAX. Pueden utilizarse en otros contextos.

Ejemplo del uso de los objetos y funciones diferidas.


Ejecución de una función diferida después de la ejecución de otras dos funciones (función 1 y función 2) que no se ejecutan en un contexto de consultas asíncronas. El ejemplo incluirá un temporizador setTimeout que nos va a permitir separar la ejecución de la función 1 y la función 2. Los distintos procesos se muestran en un panel que actúa de consola. En este enlace puede ver el código completo, y en este otro, ejecutar el resultado final: Ejemplo funciones diferidas

Ilustración del resultado solicitado.

JQuery Funciones Diferidas

En la figura podemos ver como el script principal, comienza , crea dos objetos diferidos y finaliza. Según muestra todo lo realiza en el mismo segundo: 11:45:43. Esto lo estudiamos en la siguiente función implementada.

Análisis del script principal

function run( ) {
   log("El script empieza");
   $.when(funcion1(), funcion2()).then (
      function() {log("<b>La función diferida se ha realizado<b>");},
      function() {log("<i>La función diferida no se ha realizado</i>");}
    );
    log("El script termina<br /n>");
}

En esta función cuando (when) las funciones 1 y 2 se completan, entonces (then) se mostrará uno de los dos textos, en función de si se han realizado o no las funciones.

Análisis de la función diferida 1: ¡función1′

function funcion1 () {
   var deferred = $.Deferred (log ("Creación del objeto diferido 1"));
   setTimeout ( function () {
    log ("La función 1 se ha realizado");
   deferred.resolve (log ("El objeto diferido 1 tiene el estado resuelto"));
      }, 1000);
   return deferred;
}

Comienza la función creando un objeto diferido con var deferred= $.Deferred notificando con log a la consola. A continuación, nos encontramos con el temporizador que ejecutará las instrucciones de la función anónima una vez transcurrido 1000 milisegundos. Consiste en mostrar el texto «La función 1 se ha realizado» y  con deferred.resolve () se da al objeto diferido el estado resuelto.

Análisis de la función diferida 2: ‘funcion2’

function funcion2(){
   var deferred = $.Deferred (log ("Creación del objeto diferido 2"));
   setTimeout (function (){
      log ("La función 2 se ha realizado");
      deferred.resolve (log ("El objeto diferido 2 tiene el estado resuelto"));
   },
   2000);
   return deferred;
}

Principales funcionalidades de los objetos diferidos

 

 

 

 

 

 

Deja una respuesta