Mémento jQuery

Objets Promise

Un objet Promise permet d'effectuer des traitements suite à des synchronisations d'actions, par exemple :

• un traitement sur l'ensemble des éléments retournés par $ (selector) ;


• un traitement à la fin de plusieurs appels Ajax simultanés.

Un objet Promise est créé par l'appel à la méthode promise () définie sur les objets de classe Jouery retournés par $ (selector). Par exemple :

$ (« p »). promise () Retourne un objet Promise associé aux éléments <p>, sur lesquels on pourra immédiatement effectuer un traitement.

$ (« p ») . fadeIn () . promise () Retourne un objet Promise associé aux mêmes éléments <p>, mais le traitement devra attendre que l'effet soit terminé.

Un objet Promise est également créé par l'appel à la méthode $ . ajax () permettant d'effectuer un appel Ajax. Par exemple :

$ . ajax ([ url : « action.php »]) Retourne un objet Promise associé à l'appel Ajax. Le traitement sera effectué à la fin de l'appel Ajax.

Le traitement à effectuer est indiqué au moyen de la méthode done (callback) qui est chaînée à la suite de l'appel à la méthode promise () ou de l'appel Ajax.

Utiliser la méthode promise ()

L'exemple ci-dessous permet de changer la couleur des paragraphes à la fin de l'effet sur ces derniers.

À la fin du deuxième effet, on exécute la fonction de callback définie dans la méthode done (), ce qui permet de changer la couleur des paragraphes uniquement lorsque l'effet est terminé. La valeur this dans la fonction de callback représente l'objet de classe JQuery sur lequel la méthode done () s'applique (ici, les paragraphes).

Si on avait écrit :

sans créer l'objet Promise, la couleur du texte serait immédiatement modifiée dès le démarrage de l'effet, et non pas à la fin de celui-ci comme précédemment.