Apprenez les fonctions asynchrones et les objets Promise en JavaScript

Pour apprendre les fonctions asynchrones et les objets Promise en JavaScript, des exemples de code spécifiques sont nécessaires

Introduction :
Dans le développement JavaScript, la programmation asynchrone est une partie essentielle. Les fonctions asynchrones et les objets Promise sont des méthodes de programmation asynchrone couramment utilisées. Cet article présentera en détail les fonctions asynchrones et les objets Promise en JavaScript et fournira des exemples de code spécifiques.

1. Fonction asynchrone
1.1 Qu'est-ce qu'une fonction asynchrone
En JavaScript, les fonctions synchrones sont exécutées en séquence et chaque fonction doit attendre le résultat de l'exécution de la fonction précédente avant de continuer à s'exécuter. Les fonctions asynchrones n'ont pas besoin d'attendre la fin de l'exécution de la fonction précédente et peuvent exécuter plusieurs fonctions en même temps.

1.2 Caractéristiques des fonctions asynchrones

• Les fonctions asynchrones ne bloqueront pas l'exécution du code et peuvent améliorer l'efficacité d'exécution du code.
• Les fonctions asynchrones peuvent gérer des opérations fastidieuses, telles que les requêtes réseau, la lecture et l'écriture de fichiers, etc.
• Le résultat de l'exécution d'une fonction asynchrone est généralement renvoyé via une fonction de rappel, un écouteur d'événement ou une promesse.

1.3 Exemple de fonction asynchrone
Ce qui suit est un exemple de code qui utilise une fonction asynchrone pour gérer les requêtes réseau :

function fetchData(url, callback) {
  setTimeout(function() {
    const data = 'Hello, World!';
    callback(data);
  }, 2000); // 模拟网络请求延迟2秒
}

console.log('Start');
fetchData('https://example.com', function(response) {
  console.log(response);
});
console.log('End');

Exécutez le code ci-dessus, le résultat est le suivant :

Start
End
Hello, World!

Vous pouvez voir que l'exécution de la Le programme n'attendra pas la fin de la requête réseau. Au lieu de cela, l'exécution du code suivant continue. Lorsque la requête réseau est terminée, le résultat est transmis au programme via la fonction de rappel.

2. Objet Promise
2.1 Qu'est-ce qu'un objet Promise ? L'objet Promise est une nouvelle fonctionnalité de JavaScript qui gère les opérations asynchrones. Cela peut résoudre le problème de l’enfer des rappels et rendre le code plus lisible et maintenable.

2.2 Caractéristiques des objets Promise

Les objets Promise peuvent représenter l'achèvement final ou l'échec d'opérations asynchrones et renvoyer des résultats finaux ou des messages d'erreur.
Les objets Promise ont trois états : en attente (en cours), rempli (terminé) et rejeté (en échec).
L'objet Promise peut ajouter une fonction de rappel pour un traitement réussi via la méthode then() et une fonction de rappel pour un traitement échoué via la méthode catch().

2.3 Exemple d'objet Promise

Ce qui suit est un exemple de code qui utilise un objet Promise pour gérer les requêtes réseau :

function fetchData(url) {
  return new Promise((resolve, reject) => {
    setTimeout(function() {
      const data = 'Hello, World!';
      resolve(data);
    }, 2000); // 模拟网络请求延迟2秒
  });
}

console.log('Start');
fetchData('https://example.com')
  .then(response => {
    console.log(response);
  })
  .catch(error => {
    console.error(error);
  });
console.log('End');

Exécutez le code ci-dessus, le résultat est le suivant :

Start
End
Hello, World!

Vous pouvez voir que l'exécution de l'objet Promise Le programme n'attendra pas la fin de l'objet Promise. Au lieu de cela, l'exécution du code suivant continue. Lorsque l'objet Promise est terminé, la fonction de rappel correspondante est exécutée en fonction de son statut.

Conclusion : 

L'apprentissage des fonctions asynchrones et des objets Promise en JavaScript est la clé pour maîtriser la programmation asynchrone JavaScript. Grâce aux fonctions asynchrones et aux objets Promise, les opérations fastidieuses peuvent être mieux gérées, l'efficacité de l'exécution du code peut être améliorée et le code peut être rendu plus lisible et maintenable. J'espère que l'introduction et l'exemple de code de cet article pourront aider les lecteurs à mieux comprendre et appliquer les fonctions asynchrones et les objets Promise.

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!