Mi trabajo ha sido un poco más fácil recientemente. Recordé una promesa de palabra que siempre vi antes, así que fui a estudiarla pacientemente.
1: ¿Qué es una promesa? ¿Por qué está esto ahí?
En primer lugar, Promise se crea para resolver el problema de la redacción de código durante la programación asincrónica de JavaScript.
Con el desarrollo de JavaScript, hay más y más escenarios asincrónicos. La parte delantera tiene AJAX, SetTimeOut, etc., y el nodo de backend es asíncrono. Según la práctica tradicional, es incrustar las devoluciones de llamada en varias devoluciones de llamada. El código puede marear a las personas.
En este momento, la comunidad CommonJS propuso una especificación llamada Promise/A+, que define cómo escribir código asíncrono, incluido el uso de cuándo/luego/resolución, etc. para organizar el código asíncrono.
Debido a que esta especificación es muy elegante, muchas personas han implementado esta especificación una tras otra, incluida la promesa de soporte nativo del navegador (), diferido en jQuery, When.js, etc.
Debido a que estas bibliotecas cumplen con esta especificación, solo aprende una. Principalmente aprendí diferido de jQuery, por lo que este artículo habla principalmente de esta implementación.
Dos: JQuery's Difered
En primer lugar, sobre el objeto diferido, el Sr. Ruan Yifeng escribió un artículo en detalle, haga clic aquí. Se recomienda que lea primero su artículo y luego continúe leyendo.
Como se mencionó anteriormente, las promesas están diseñadas para resolver asíncrono (como Ajax), así que comparemos sus diferencias.
El clásico jQuery Ajax está escrito como
La copia del código es la siguiente:
$ .AJAX ({
Tipo: "Obtener",
URL: "",
éxito: function () {},
error; función () {}
});
Los parámetros de éxito y error son funciones de devolución de llamada cuando el éxito/falla.
Ahora el método de escritura AJAX de JQuery se ha convertido
La copia del código es la siguiente:
$ .AJAX ({
tipo; "conseguir",
URL: ""
}). Done (function () {}). fail (function () {});
Después del éxito, se llamará a la función en la información, y si se llama a la función en fallas, se llamará a la función en fallas.
Después de ver esto, puede tener preguntas, ¿qué objeto se realizan/fallan estos métodos? ¿Qué objeto devuelve $ .AJAX () y por qué hay estos dos métodos?
La respuesta está en el objeto diferido que se introduce a continuación.
JQuery proporciona un nuevo tipo de diferido. Genere con $ .deferred (). Por ejemplo
La copia del código es la siguiente:
var def = $ .deferred ();
Esta definición hereda muchos métodos, incluidos los lados/fallas/resueltos/rechazar, etc.
Así que aquí sabemos que el anterior $ .AJAX () realmente devuelve este objeto.
Existen muchos métodos para objetos diferidos. Aquí hay varios usados comúnmente. Para obtener más información, consulte la API.
Lo primero es generar naturalmente un objeto DEF. Hay muchas maneras aquí, como:
La copia del código es la siguiente:
var def = $ .deferred (); // Generarlo tú mismo
$ .AJAX ({}); // El método AJAX devuelve también un objeto DEF
$ .When (); // Cuando el método también devolverá un objeto DEF
Aquí, $ .When () se puede hablar por separado. Este método generalmente recibe uno o más objetos diferidos, y luego determina el estado del objeto devuelto por $ .When () en función del estado de estos objetos diferidos. Uno de los escenarios de uso son múltiples solicitudes de AJAX. Si uno de ellos falla, se considera un fracaso. Luego puede pasar múltiples métodos AJAX a $ .When (), como $ .When ($. AJAX (), $ .AJAX ()). Entonces $. Cuando devolverá un objeto DEF (juzgado en función de los resultados de estas dos solicitudes).
Luego obtienes el objeto DEF, y hay una serie de métodos para cambiar el estado de este objeto.
La copia del código es la siguiente:
def.resolve (); // Establezca el objeto DEF para completarse, y luego la función unida a def.done () se ejecutará de inmediato.
def.reject (); // Establecer el objeto DEF para haber fallado, y luego la función vinculada a def.fail () se ejecutará de inmediato.
def.notify (); // Durante la ejecución del objeto DEF, la devolución de llamada correspondiente es def.progress ().
El siguiente es el método para establecer la devolución de llamada, el pedido corresponde a lo anterior, es decir, qué estado llamará a qué devolución de llamada
La copia del código es la siguiente:
def.done (); // correspondiente a def.resolve ();
def.fail (); // correspondiente a def.reject ();
def.progress (); // correspondiente a def.notify ();
// Especial
def.always (); // llamado si tiene éxito o fallido
def.then (); // aceptar múltiples funciones, en orden, éxito, fracaso y progreso
De hecho, en este punto, el uso del objeto diferido es casi el mismo. Sin embargo, JQuery también proporciona varias API
La copia del código es la siguiente:
// Verifique la clase de estado actual
def.isrejed ();
def.isResolved ();
def.state ();
Como su nombre indica, estas API no se discutirán en detalle. Para más detalles, puede consultar la documentación de la API JQuery dada anteriormente.
Hay otro método, que a veces queremos dar un objeto DEF externo, y luego este objeto puede establecer devoluciones de llamada para varios estados, pero no podemos cambiar su estado, para que podamos usarlo.
La copia del código es la siguiente:
def.promise ();
Devuelve un objeto prometido, que es un subconjunto del objeto diferido. Puede usar/fallas y otros métodos, sin resolver/rechazar y otros métodos. Es principalmente para proteger el estado del objeto DEF de ser modificado desde el exterior.
En este punto, se han discutido todas las promesas. Ahora puede usarlos en sus proyectos. Además, les deseo un feliz año de anticipación. Les deseo a todos un feliz año de las ovejas ^^.