Cómo utilizar el método then de jquery
Usar el método then de jquery
1.Deferred.then() es equivalente a la combinación de Deferred.done(), Deferred.fail() y Deferred.progress(), que Le permite registrar funciones de devolución de llamada para los tres estados al mismo tiempo.
[javascript]?ver plano?copiar
función?éxito(datos)?
{?
alerta("¿éxito? ¿datos?=?" ? +?datos);?
}?
función?fail(datos)?
{?
alerta("fail?data?=?") ?+?data);?
}?
función?
{?
alerta("progreso?datos?=?" ) +?datos);?
}?
var?$.Deferred();?
//?¿Registrar devolución de llamada juntos?
deferred.then(success,?fail,?progress);?
//?¿Registrar devoluciones de llamada por separado?
diferido.hecho(éxito);?
diferido.fail(fallo);?
diferido.progreso(progreso);?
deferred.notify("10%");?
deferred.resolve("ok"); Por supuesto, también podemos llamar a then() varias veces para registrar una función de devolución de llamada, tal como se hizo. () Mismo.
Antes de JQuery 1.8, then() se usaba para registrar funciones de devolución de llamada.
2.Deferred.then() resuelve el problema de que múltiples operaciones asincrónicas dependan entre sí. En este caso, then() realmente tiene sentido. Después de JQuery 1.8, then() reemplazó el método obsoleto pipe(). En este caso, necesitamos usar el nuevo objeto Promise devuelto por Deferred.then(). En el primer uso anterior, ignoramos el valor de retorno de Deferred.then().
[javascript]?view Plain?copy
var?deferred?=?$.Deferred();?
//?Usar then() Registrarse ¿Función de devolución de llamada para estado resuelto y promesa filtrada de devolución?
//? ¿El objeto filtrado devuelto ya no es el objeto Delay o Promise original?
var?filtered?=?deferred.then(function(?value?)?{
alert("trigger?Deferred?filter.value="+value);// 5?
return?value?*?2;?
});?
//?Utilice la Promesa filtrada para registrar la función de devolución de llamada nuevamente
p>filtered.done(function(?value?)?{
alert("filtered?value="? +?value);//10?
} );?
deferred.resolve(?5?);?
Usamos deferred.then() para registrar una función de devolución de llamada en el estado de finalización, y el resultado el valor es 5; luego se registra una nueva función de devolución de llamada de Promesa mediante filtrado y el valor obtenido es 10 (el resultado de la primera función de devolución de llamada). Ahora echemos un vistazo a la explicación oficial de JQuery:
Estas funciones de filtro pueden devolver un nuevo valor y pasarlo a la función de devolución de llamada .done() o .fail() de la promesa, así como también puede devuelve otro Observable (Diferido, Promesa, etc.) y pasa su estado y valor de resolución/rechazo a la función de devolución de llamada de la promesa.
Sabemos que deferred.resolve(), deferred.reject() y deferred.notify() pueden especificar los valores de los parámetros pasados a la función de devolución de llamada en el estado correspondiente. Si usamos funciones de devolución de llamada registradas con done(), fail(), Progress(), entonces todas las funciones de devolución de llamada en un estado específico obtendrán los mismos parámetros. Pero si usamos then() para registrar una función de devolución de llamada, entonces el valor de retorno de la primera función de devolución de llamada se usará como parámetro de la segunda función de devolución de llamada. De manera similar, el valor de retorno de la segunda función también es un parámetro de la tercera. función de devolución de llamada. Puede comparar los siguientes dos fragmentos de código para comprender la diferencia entre done() y luego.
[javascript]?view Plain?copy
var?deferred?=?$.Deferred();?
//?done() todavía devuelve ¿Objeto diferido original?
var?done_ret?=?deferred.done(function(data){?
alert("data="+data);//5?
¿regresar?
}});?
alert(deferred?==?done_ret);//true
done_ret.done(function(data) ){?
alerta("data="+data);//5?
});?
deferred.resolve(?5?) ;?
[javascript]?$.Deferred();?
//?then() devuelve un nuevo objeto Promise.
//¿Entonces el valor de retorno de la función de devolución de llamada registrada se utilizará como parámetro de esta nueva Promesa?
var?then_ret?=?deferred.then(function(data){?
alert("data="+data);//5?
return?2?*?data;?
}});?
alert(then_ret?==?deferred);//false
then_ret.done(function(data){?
alert("data="+data);//10?
});?
diferido .resolve(?5?);?
Del mismo modo, Deferred.then habilita el filtrado de funciones de devolución de llamada para estados rechazados y pendientes.
[javascript]?Ver texto sin formato
var?defer?=?$.Deferred();?
var?filtered?=?defer.then (?nulo,?función(?valor?)?{
retorno?
}});?
defer.reject(?6?); ?
filtrado.fail(función(?valor?)?{
alerta(?" );?
filtrado.fail(función(?valor? )?Value?is?(?3*6?=?) ?18:?" ?+?value?);?
});?
El siguiente código implementa Se resuelven las tareas encadenadas y se resuelve el problema de las devoluciones de llamada difíciles en operaciones asincrónicas.
[javascript]?vista simple?copia
var?defered?=?$.Deferred();?
var?promise1?=?difered. entonces(función(datos){?
alerta(datos);//?
return?data+="1";?
});?
var?promise2?=?promise1.then(function(data){?
alert(data);//1?
return?data+= "2";?
});?
var?promise3?=?promise2.then(función(datos){?
alerta(datos) ;//12?
return?data+="3";?
});?
promise3.done(función(datos){?
alert(data);//123?
});?
defered.resolve("");?
Verdadero Gracias a la función then(), podemos cambiar el complejo anidamiento AJAX anterior a la siguiente forma:
[javascript]?view Plain?copy
var?promise1?=?$ .ajax(url1);?
var?promise2?=?promise1.then(function(data){?
return?$.ajax(url2, {?"data" :?datos?});?
});?
var?promise3?=?promise2.then(función(datos){?
return ?$.ajax(url3,? {?" data":?data?});?
});?
promise3.done(function(data){?
//?datos?recuperados?de?url3?
});?