Maison interface Web js tutoriel Quelles sont les méthodes de programmation asynchrone en javascript

Quelles sont les méthodes de programmation asynchrone en javascript

Apr 19, 2019 pm 01:07 PM
javascript 异步编程

Les méthodes JavaScript pour implémenter la programmation asynchrone incluent : des méthodes de rappel faciles à comprendre et à mettre en œuvre mais difficiles à maintenir, des méthodes de publication/abonnement, des méthodes d'écoute d'événements faciles à comprendre et pouvant lier plusieurs événements mais dont le flux de travail est déroutant, et Méthodes de promesses

Le mode asynchrone est très important, les opérations de longue durée côté navigateur doivent être exécutées de manière asynchrone pour éviter de ne pas répondre. Ensuite, je présenterai en détail l'implémentation de méthodes de programmation asynchrone en JavaScript dans l'article, qui a un certain effet de référence et j'espère que cela sera utile à tout le monde.

Quelles sont les méthodes de programmation asynchrone en javascript

[Cours recommandés : Tutoriel JavaScript]

Tout le monde sait que l'environnement d'exécution de JavaScript est monothread, ce qui signifie qu'une seule tâche peut être exécutée à la fois. Si vous rencontrez plusieurs tâches, vous devez attendre dans la file d'attente la fin de la tâche précédente. Par conséquent, cela prend beaucoup de temps. Le mode synchrone est similaire à ce mode monothread. Le mode asynchrone est complètement différent. Lorsqu'une tâche est terminée, elle exécutera la fonction de rappel, et les suivantes. les tâches peuvent être La tâche précédente s'exécute simultanément. L'ordre d'exécution des tâches est différent de la séquence des tâches dans la file d'attente.

Méthode 1 : Méthode de rappel

Cette méthode est la méthode de base de la programmation asynchrone Supposons qu'il y ait deux fonctions f1 et f2, cette dernière attendra la première fonction. résultat.

F1(); 
F2();
Copier après la connexion

Si f1 est une opération de longue durée, vous pouvez remplacer f1 et utiliser f2 comme fonction de rappel de f1.

function f1(callback){
setTimeout(function () {
 callback();
    }, 1000);
}
Copier après la connexion

En utilisant ce mode, les opérations synchrones peuvent être converties en opérations asynchrones. f1 ne bloquera pas l'exécution du programme, il exécutera d'abord la logique principale puis effectuera des opérations fastidieuses

rappel. L'avantage des fonctions est qu'elles sont faciles à comprendre et à mettre en œuvre. Les inconvénients sont que le code est illisible et maintenable, les différents composants sont fortement couplés, le flux de travail est très déroutant et chaque tâche ne peut avoir qu'une seule fonction de rappel.

Méthode 2 : Publier/Abonnez-vous

Cet événement peut être compris comme un signal En supposant qu'il existe un centre de signal, si une tâche est terminée, il publiera un. signal au centre de signalisation, et d'autres tâches peuvent recevoir des signaux spécifiés des centres de signalisation abonnés. Cette approche est appelée modèle de publication/abonnement ou modèle d'observateur.

Exemple : f2 s'abonne au centre de signal pour le signal de fin

jQuery.subscribe(“done”,f2);
Copier après la connexion

puis écrit f1 comme

function f1(){
    setTimeout(function () {
     jQuery.publish("done");
    }, 1000);
}
Copier après la connexion

jQuery.publish(“done”) pour indiquer qu'il enverra le signal à f1 une fois l'exécution terminée. Center envoie un signal d'achèvement, puis f2 commencera l'exécution.

Lorsque f2 termine son exécution, il peut se désinscrire.

jQuery.unsubscribe(“done”,f2);
Copier après la connexion

Troisième méthode : écoute d'événements

Une autre méthode est le modèle basé sur les événements. L'exécution d'une tâche ne dépend pas de la séquence de code. pour qu'un événement se produise. Toujours en utilisant f1 et f2 dans cet exemple, liez d'abord un événement à f1.

f1.on('done',f2);
Copier après la connexion

La signification du code ci-dessus est que si l'événement d'achèvement f1 se produit, f2 sera exécuté.

function f1(){
    setTimeout(function () {
      f1.trigger('done');
    }, 1000);
}
Copier après la connexion

f1.trigger('done') signifie qu'il déclenchera l'événement done, puis exécutera f2 une fois l'exécution terminée.

L'avantage est qu'il est facile à comprendre et peut lier plusieurs événements, chaque événement peut avoir de nombreuses fonctions de rappel, et il peut se découpler, ce qui est bon pour la modularité. L'inconvénient est que l'ensemble du programme sera piloté par des événements et que le flux de travail n'est pas très clair.

Méthode 4 : Méthode Promises

L'objet Promises est un standard proposé par CommonJS pour fournir une interface commune pour la programmation asynchrone. Chaque tâche asynchrone renvoie un objet Promises, qui possède une méthode then qui permet de définir une fonction de rappel. Par exemple, la fonction de rappel f2 de f1 :

F1().then(F2)
Copier après la connexion

f1 doit s'écrire comme :

function f1(){
    var dfd = $.Deferred();
    setTimeout(function () {
        dfd.resolve();
    }, 500);
    return dfd.promise;
}
Copier après la connexion

L'avantage est que les fonctions de rappel sont liées et le flux de travail du programme est très clair et dispose d'un ensemble complet de méthodes de liaison qui peuvent être utilisées pour implémenter des fonctionnalités puissantes.

Par exemple, définissez plusieurs fonctions de rappel :

f1().then(f2).then(f3);
Copier après la connexion

Il existe également un exemple, s'il y a une erreur :

f1().then(f2).fail(f3);
Copier après la connexion

Un avantage que les trois autres les méthodes n'ont pas Une fois qu'une tâche est terminée, si vous ajoutez plus de fonctions de rappel, elles seront exécutées immédiatement. L’inconvénient est que ce n’est pas facile à comprendre.

Résumé : Ce qui précède représente l'intégralité du contenu de cet article, j'espère qu'il sera utile à tout le monde.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

Video Face Swap

Video Face Swap

Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Comment implémenter la programmation asynchrone avec les fonctions C++ ? Comment implémenter la programmation asynchrone avec les fonctions C++ ? Apr 27, 2024 pm 09:09 PM

Résumé : La programmation asynchrone en C++ permet d'effectuer plusieurs tâches sans attendre des opérations fastidieuses. Utilisez des pointeurs de fonction pour créer des pointeurs vers des fonctions. La fonction de rappel est appelée lorsque l'opération asynchrone est terminée. Les bibliothèques telles que boost::asio fournissent un support de programmation asynchrone. Le cas pratique montre comment utiliser les pointeurs de fonction et boost::asio pour implémenter des requêtes réseau asynchrones.

Tutoriel JavaScript simple : Comment obtenir le code d'état HTTP Tutoriel JavaScript simple : Comment obtenir le code d'état HTTP Jan 05, 2024 pm 06:08 PM

Tutoriel JavaScript : Comment obtenir le code d'état HTTP, des exemples de code spécifiques sont requis Préface : Dans le développement Web, l'interaction des données avec le serveur est souvent impliquée. Lors de la communication avec le serveur, nous devons souvent obtenir le code d'état HTTP renvoyé pour déterminer si l'opération a réussi et effectuer le traitement correspondant en fonction de différents codes d'état. Cet article vous apprendra comment utiliser JavaScript pour obtenir des codes d'état HTTP et fournira quelques exemples de codes pratiques. Utilisation de XMLHttpRequest

Problèmes courants et solutions dans la programmation asynchrone dans le framework Java Problèmes courants et solutions dans la programmation asynchrone dans le framework Java Jun 04, 2024 pm 05:09 PM

3 problèmes et solutions courants dans la programmation asynchrone dans les frameworks Java : Callback Hell : utilisez Promise ou CompletableFuture pour gérer les rappels dans un style plus intuitif. Conflit de ressources : utilisez des primitives de synchronisation (telles que des verrous) pour protéger les ressources partagées et envisagez d'utiliser des collections thread-safe (telles que ConcurrentHashMap). Exceptions non gérées : gérez explicitement les exceptions dans les tâches et utilisez un cadre de gestion des exceptions (tel que CompletableFuture.exceptionally()) pour gérer les exceptions.

Comment le framework Golang gère-t-il la concurrence et la programmation asynchrone ? Comment le framework Golang gère-t-il la concurrence et la programmation asynchrone ? Jun 02, 2024 pm 07:49 PM

Le framework Go utilise les fonctionnalités de concurrence et asynchrones de Go pour fournir un mécanisme permettant de gérer efficacement les tâches simultanées et asynchrones : 1. La concurrence est obtenue via Goroutine, permettant d'exécuter plusieurs tâches en même temps. 2. La programmation asynchrone est implémentée via des canaux, qui peut être exécuté sans bloquer le thread principal;3. Convient aux scénarios pratiques, tels que le traitement simultané des requêtes HTTP, l'acquisition asynchrone des données de base de données, etc.

Comment obtenir facilement le code d'état HTTP en JavaScript Comment obtenir facilement le code d'état HTTP en JavaScript Jan 05, 2024 pm 01:37 PM

Introduction à la méthode d'obtention du code d'état HTTP en JavaScript : Dans le développement front-end, nous devons souvent gérer l'interaction avec l'interface back-end, et le code d'état HTTP en est une partie très importante. Comprendre et obtenir les codes d'état HTTP nous aide à mieux gérer les données renvoyées par l'interface. Cet article explique comment utiliser JavaScript pour obtenir des codes d'état HTTP et fournit des exemples de code spécifiques. 1. Qu'est-ce que le code d'état HTTP ? Le code d'état HTTP signifie que lorsque le navigateur lance une requête au serveur, le service

Programmation asynchrone Python : un moyen d'obtenir une concurrence efficace dans le code asynchrone Programmation asynchrone Python : un moyen d'obtenir une concurrence efficace dans le code asynchrone Feb 26, 2024 am 10:00 AM

1. Pourquoi utiliser la programmation asynchrone ? La programmation traditionnelle utilise le blocage des E/S, ce qui signifie que le programme attend la fin d'une opération avant de continuer. Cela peut bien fonctionner pour une seule tâche, mais peut entraîner un ralentissement du programme lors du traitement d'un grand nombre de tâches. La programmation asynchrone brise les limitations des E/S bloquantes traditionnelles et utilise des E/S non bloquantes, ce qui signifie que le programme peut distribuer des tâches à différents threads ou boucles d'événements pour exécution sans attendre la fin de la tâche. Cela permet au programme de gérer plusieurs tâches simultanément, améliorant ainsi ses performances et son efficacité. 2. La base de la programmation asynchrone Python La base de la programmation asynchrone Python est constituée de coroutines et de boucles d'événements. Les coroutines sont des fonctions qui permettent à une fonction de basculer entre la suspension et la reprise. La boucle événementielle est responsable de la planification

Quels sont les avantages et les inconvénients de la programmation asynchrone en PHP ? Quels sont les avantages et les inconvénients de la programmation asynchrone en PHP ? May 06, 2024 pm 10:00 PM

Les avantages de la programmation asynchrone en PHP incluent un débit plus élevé, une latence plus faible, une meilleure utilisation des ressources et une évolutivité. Les inconvénients incluent la complexité, la difficulté de débogage et la prise en charge limitée des bibliothèques. Dans le cas réel, ReactPHP est utilisé pour gérer les connexions WebSocket, démontrant l'application pratique de la programmation asynchrone.

Les avantages et les défis de la programmation asynchrone dans Golang : tout ce qu'il faut savoir ! Les avantages et les défis de la programmation asynchrone dans Golang : tout ce qu'il faut savoir ! Apr 03, 2024 pm 03:06 PM

Avantages : Amélioration des performances : exécution de tâches parallèles, utilisant pleinement les processeurs multicœurs. Évolutivité : évoluez facilement pour gérer des charges de travail plus importantes. Réactivité : le thread principal ne bloque pas, ce qui permet à l'application de rester réactive. Optimisation des ressources : évitez le besoin de structures de verrouillage et de synchronisation. Défi : Complexité du code : Gestion de plusieurs tâches indépendantes. Difficulté de débogage : les tâches sont exécutées dans différents threads ou coroutines. Gestion des erreurs : la gestion des erreurs dans un environnement simultané est complexe et nécessite des mesures supplémentaires. Cas pratique : télécharger des fichiers en parallèle, utiliser Goroutine pour télécharger plusieurs fichiers en même temps, montrant comment la programmation asynchrone peut améliorer les performances.

See all articles