Comment attendre ou dormir l'exécution du code en javascript

Dormir est une fonction qui est présente dans la plupart des langages de programmation et est utilisée pour retarder l'exécution du code pendant une période spécifiée. JavaScript n'a pas cette fonction, nous utilisons donc le setTimeout () fonction pour effectuer la même tâche. Bien que cela ne fonctionne pas exactement comme nous nous attendons à la fonction de sommeil, nous l'utiliserons pour construire notre propre fonction de sommeil personnalisée en JavaScript, dans cet article.

Par exemple, si nous devons enregistrer trois messages à la console avec un retard d'une seconde, nous ne pouvons pas le faire en utilisant la fonction de sommeil en JavaScript car il n'est pas disponible. Mais nous pouvons contourner cela en utilisant le setTimeout () fonction.

Quelle est la méthode setTimeout ()?

Le setTimeout () La méthode est utilisée pour définir une minuterie pour retarder l'exécution du code. Il exécute le morceau de code spécifié après l'expiration du minuteur.

Beaucoup de développeurs qui ont travaillé avec le dormir() Fonction trouver setTimeout () être déroutant. C'est parce qu'ils confondent le setTimeout () fonction pour être une version du dormir() fonction dans javascript.

Malheureusement, le setTimeout () a ses propres règles et ne fonctionne pas comme le dormir() La fonction le fait le fait dormir() fonction.

Dans ce guide, nous examinerons plusieurs de ces solutions et expliquerons comment nous pouvons utiliser le setTimeout () fonction pour suspendre l'exécution du code source JavaScript et attendre entre les lignes de code consécutives.

Contrairement au dormir() fonction, si nous mettons juste un retard d'une seconde en utilisant le setTimeout () Méthode entre les lignes du code JavaScript, cela ne fonctionne pas:

setTimeout (1000)
console.Log ("Afficher après une seconde")
setTimeout (1000)
console.Log ("Afficher après une autre une seconde")

Le code de l'exemple ci-dessus s'exécutera sans aucun délai comme si le setTimeout () La fonction n'existe pas.

Le problème avec le code donné ci-dessus est que le setTimeout () La méthode retarde uniquement l'exécution de la fonction qui lui est transmise en fonction d'une fonction de rappel. Cependant, nous n'en avons donné qu'un "retard”Argument quand il est en fait censé obtenir deux arguments différents. Le premier argument est censé être une fonction de rappel, et le deuxième argument est censé être le «retard". Essayons maintenant de faire cela et voyons ce qui se passe:

setTimeout (() => console.Log ("Afficher après une seconde"), 1000)
setTimeout (() => console.Log ("Afficher après une autre une seconde"), 1000)

Cette fois le setTimeout () La fonction fonctionnera mais pas comme elle est censée le faire, car les deux messages de journal de la console seront affichés en même temps au lieu d'avoir un délai de 1000 millisecondes entre eux.

Alors pourquoi setTimeout () a-t-il échoué?

La raison pour laquelle setTimeout () échoue dans l'exemple ci-dessus setTimeout () La fonction elle-même fonctionne de manière synchrone dans le code JavaScript, mais la fonction de rappel à l'intérieur de la fonction setTimeout () crée une nouvelle entrée dans la file d'attente de tâche asynchrone qui est exécutée après l'heure spécifiée.

Depuis l'heure spécifiée dans les deux setTimeout () La fonction était la même et ils ont été exécutés en même temps en raison de l'exécution du code synchrone si JavaScript (avec un retard de quelques millisecondes), toutes les entrées de la file d'attente de tâche asynchrones s'exécutent simultanément.

Comme tu peux le voir, setTimeout () n'est pas une copie exacte du dormir() Fonction, il fait plutôt la file d'attente du code pour une exécution ultérieure. La question se pose donc, comment le faire fonctionner comme un dormir() fonction. Nous pouvons le faire en utilisant des délais d'attente croissants lorsque vous appelez le setTimeout () fonction:

setTimeout (() => console.Log ("Afficher après une seconde"), 1000)
setTimeout (() => console.Log ("Afficher après une autre une seconde"), 2000)

Cela fonctionne parce que la nouvelle entrée dans la file d'attente est créée à peu près au même moment, mais ces entrées doivent attendre que des différents temps soient exécutés.

La méthode indiquée ci-dessus est la méthode utilisée pour retarder l'exécution de certaines parties de code tandis que les autres parties s'exécutent de manière synchrone. Cependant, si vous souhaitez arrêter l'exécution de l'ensemble du code JavaScript tout en exécutant de manière asynchrone d'autres parties, vous devrez créer une personnalité dormir() fonction.

Comment écrire une fonction de sommeil

Dans JavaScript, nous pouvons créer une personnalité dormir() fonction en utilisant des promesses, asynchrones et attendre. Cela fonctionne exactement comme un dormir() La fonction serait dans n'importe quelle autre langue.

Cependant, cette coutume dormir() La fonction doit être utilisée avec le mot-clé Await et doit être appelée à partir des fonctions asynchrones.

Var Sleep = (Delay) => Nouvelle promesse ((Resolve) => setTimeout (Resolve, Delay))
var repeatMessage = async () =>
AWAIT SEMPHER (1000)
console.Log ("Afficher après une seconde")
AWAIT SEMPHER (1000)
console.Log ("Afficher après une autre une seconde")

RepeatMessage ();

Maintenant, en utilisant cette méthode de sommeil de construction personnalisée, vous pouvez arrêter l'exécution du code JavaScript pendant la durée souhaitée.

Conclusion

JavaScript n'a pas le dormir() fonction par défaut pour retarder l'exécution du code, mais sa nature asynchrone peut être utilisée pour atteindre la même tâche. L'intégration setTimeout () La méthode peut être utilisée pour retarder l'exécution du code mais pour vraiment rendre le code asynchrone en javascript et le faire fonctionner comme le dormir() Fonction Nous devons utiliser les fonctions promesses, attendre et asynchrones. Dans cet article, nous avons appris à créer une coutume dormir() fonctions en javascript.