Promise vs setTimeout
J'ai observé cela dans le code suivant:
setTimeout(function(){console.log('setTimeout')});
Promise.resolve(1).then(function(){console.log('promise resolve')})
Peu importe le nombre de fois que j'exécute cette opération, le rappel de promesse se connecte toujours avant setTimeout.
D'après ce que je comprends, les deux rappels doivent être exécutés au prochain tick et je ne comprends pas vraiment ce qui se passe et qui fait que la promesse est toujours prioritaire sur le délai d'attente.
Réponse courte Les promesses ont une meilleure priorité que la fonction de rappel setTimeout dans la pile de boucles d’événements (ou comment je la comprends).
Longue réponse à regarder cette vidéo. Très utile. J'espère que cela t'aides.
https://www.youtube.com/watch?v=8aGhZQkoFbQ
Merci à @MickJuice pour la nouvelle vidéo mise à jour de la boucle d'événement.
Promise.resolve planifie une microtâche et setTimeout planifie un macrotask. Et les microtasks sont exécutés avant d'exécuter le prochain macrotask.
setTimeout() a un délai minimum de 4 ms , de sorte que même si vous n'avez pas spécifié de délai dans votre code, le délai d'attente sera toujours retardé d'au moins 4 ms. La fonction .then() de votre promesse est appelée entre-temps.
Les délais et les promesses ont des objectifs différents.
setTimeout retarde l'exécution du bloc de code d'une durée spécifique. Les promesses sont une interface permettant l'exécution asynchrone du code.
Une promesse permet au code de continuer à s'exécuter pendant que vous attendez qu'une autre action soit terminée. Il s’agit généralement d’un appel réseau. Ainsi, tout ce qui se trouve dans votre appel then() sera exécuté une fois que l'appel réseau (ou la promesse attendue) sera terminé. La différence de temps entre le début de la promesse et la résolution de la promesse dépend entièrement de son exécution et peut changer à chaque exécution.
La raison pour laquelle la promesse est exécutée avant l'expiration de votre délai est qu'elle ne doit rien attendre, elle est donc résolue immédiatement.
Timeouts et Promises les deux servent à exécuter du code de manière asynchrone mais avec des caractéristiques et des objectifs différents:
setTimeout - Retarde l'exécution d'une fonction d'une durée spécifique .- Ne bloque pas le reste de l'exécution du code (comportement asynchrone) - Crée un Macrotask (opération interne du navigateur)
Promises - Ils encapsulent de manière à permettre l'exécution de code asynchrone (par exemple, un appel ajax). (Ne dépend pas de la durée spécifique) - Ils sont particulièrement utiles pour modifier différents appels asynchrones .- Ne bloque pas le reste de l'exécution du code (comportement asynchrone) à moins que vous n'utilisiez l'opérateur wait- Ils créent Microtask (fonctionnement interne du navigateur), qui ont priorité sur le Macrotask.
Recommandation
Utilisez setTimeout lorsque vous souhaitez retarder l’exécution d’une fonction d’une durée spécifique sans bloquer le reste de l’exécution du code dans le processus.
Utilisez Promises : Lorsque vous souhaitez exécuter du code asynchrone et éviter "l'enfer du rappel" (oui, vous pouvez effectuer des appels asynchrones ajax sans Promises mais la syntaxe est moins claire et plus sujette aux erreurs).