Objet de promesse dans Angular ($q introduction)_AngularJS

Quand j'utilisais JQuery, je savais que cette promesse est un modèle de programmation asynchrone JS, mais je n'ai pas bien compris la différence entre celle-ci et l'objet différé de JQuery. Au fur et à mesure que le projet de l'entreprise avançait, nous avions besoin de recevoir des données du backend, nous avons donc décidé de le faire.

Promesse

Promise est un mode qui gère les événements asynchrones sous la forme d'un processus d'opération synchrone, évitant les couches d'imbrication, et peut gérer des événements asynchrones dans une chaîne.

Nous savons que lors de l'écriture de code asynchrone JavaScript, le rappel est le mécanisme le plus simple. Cependant, l'utilisation de ce mécanisme doit sacrifier le flux de contrôle, la gestion des exceptions et la sémantique des fonctions, et peut même nous faire tomber dans le piège du rappel. la promesse résout ce problème.

Promise dans ES6, AngularJS Q intégré à angulaireJS, et lors de l'adoption de la spécification Promises/A, comme suit :

Chaque tâche a trois statuts : en attente, exécutée et rejetée.

1.statut en attente : peut passer au statut d'exécution ou de rejet.
2. État réalisé : il ne peut pas être modifié en un autre état, et l'état ne peut pas être modifié. Il doit avoir une valeur.
3. État rejeté : il ne peut pas être modifié vers un autre état, et l'état ne peut pas être modifié. Il doit y avoir une raison.

Le transfert d'état est unique. Une fois que l'état est rempli (terminé) ou échoué (échec/rejeté), il ne peut plus être modifié.

Copier le code Le code est le suivant :

fonction okToGreet(nom){
Nom de retour === 'Robin des Bois';
>

fonction asyncGreet(nom) {
var différé = $q.defer();

setTimeout(fonction() {
// Parce que cette fonction asynchrone fn sera exécutée de manière asynchrone à l'avenir, nous enveloppons le code dans l'appel $apply tout en observant correctement les changements de modèle
$scope.$apply(function() {
              deferred.notify('Sur le point de saluer ' nom '.');

                 if (okToGreet(name)) {
                   deferred.resolve('Bonjour, 'nom'!');
               } autre {
                    deferred.reject('Le message d'accueil ' nom ' n'est pas autorisé.');
            }
        });
}, 1000);

Retour différé.promise;
>

var promise = asyncGreet('Robin des Bois');
promesse.then(fonction(salutation) {
alert('Succès : ' salutation);
}, fonction(raison) {
alert('Échec : 'raison);
}, fonction (mise à jour) {
alert('Notification reçue : ' mise à jour);
});

Utilisation de base de Q Promise

Le code ci-dessus montre le rôle de plusieurs méthodes de l'instance différée construite par $q.defer(). Si l'opération asynchrone réussit, utilisez la méthode de résolution pour modifier le statut de l'objet Promise en « succès » (c'est-à-dire de en attente à résolu) ; si l'opération asynchrone échoue, utilisez la méthode de rejet pour modifier le statut en « échec » ; (c'est-à-dire de en attente à résolu). Enfin, deferred.promise est renvoyé et nous pouvons appeler la méthode then dans une chaîne.

JS aura Promise native, ES6 a déjà des objets Promise, les versions bêta de Firefox et Chrome 32 ont implémenté l'API Promise de base

$q.defferd dans AngularJs

Appelez $q.defferd pour renvoyer l'objet différé pour chaîner les appels. Cet objet associe les trois états de tâche dans la spécification Promises/A via l'API.

API différée

Méthodes d'objets différés

1.resolve(value) : lors de la déclaration de solve(), cela indique que l'objet de promesse passe de l'état en attente à la résolution.
2.reject(reason) : lors de la déclaration de solve(), cela indique que l'objet de promesse passe de l'état en attente à rejeté.
3.notify(value) : lorsque notify() est déclaré, il indique l'état non rempli de l'objet de promesse et peut être appelé plusieurs fois avant d'être résolu ou rejeté.

Propriétés des objets différées

promesse : ce qui est finalement renvoyé est un nouvel attribut de promesse d'objet différé, et non l'objet différé d'origine. Ce nouvel objet Promise ne peut observer que l'état de l'objet Promise d'origine et ne peut pas modifier l'état interne de l'objet différé pour empêcher l'état de la tâche d'être modifié en externe.

API Promesse

Lorsqu'une instance différée est créée, un nouvel objet de promesse est créé et la référence peut être obtenue via deferred.promise.

Le but de l'objet de promesse est de permettre à la partie intéressée d'obtenir ses résultats d'exécution lorsque la tâche différée est terminée.

Méthodes d'objet de promesse

1.then(errorHandler,filledHandler, progressHandler) : La méthode then est utilisée pour surveiller les différents états d'une promesse. Le errorHandler surveille le statut d'échec, lefilledHandler surveille le statut rempli et le progressHandler surveille le statut non rempli (incomplet). De plus, le rappel de notification peut être appelé de zéro à plusieurs fois, fournissant une indication de la progression avant la résolution ou le rejet (résolution et rejet).
2.catch(errorCallback) - raccourci pour promise.then(null, errorCallback)
3.finally(callback) - vous permet d'observer si une promesse est exécutée ou rejetée, mais sans modifier la valeur finale. Cela peut être utilisé pour effectuer un travail de libération de ressources ou de nettoyage d'objets inutilisés, que la promesse soit rejetée ou résolue. Pour plus d'informations, consultez la spécification complète de la documentation.

Les appels de chaîne de promesses peuvent être implémentés via la méthode then().

Copier le code Le code est le suivant :

promiseB = promiseA.then(function(result) {
Renvoie le résultat 1 ;
});

// promiseB sera traité immédiatement après le traitement de promiseA,
// Et sa valeur valeur est le résultat de promiseA augmenté de 1

Autres méthodes de $q

$q.when(value) : transmettez la valeur de la variable, promise.then() exécute un rappel réussi
$q.all(promises) : plusieurs promesses doivent être exécutées avec succès avant que le rappel de réussite puisse être exécuté. La valeur transmise est un tableau ou une valeur de hachage. Chaque valeur du tableau est un objet de promesse correspondant à l'Index
.