es8 fonction asynchrone async / wait

---

Fonction asynchrone

async / await sont deux nouveaux mots-clés de fonction ajoutés à ES8, permettant au code écrit de manière synchrone d'être exécuté de manière asynchrone

1. asynchrone

Le mot clé async est utilisé pour déclarer des fonctions asynchrones. Ce mot clé peut être utilisé avant les déclarations de fonction, les expressions de fonction, les fonctions fléchées et les méthodes.

    async function f() {
    
    
        return 1;
    }

Si la fonction asynchrone renvoie une valeur avec retour (s'il n'y a pas de retour, elle retournera indéfini), cette valeur sera automatiquement enveloppée dans une promesse résolue, et le résultat est la valeur

    async function f() {
    
    
        return 1;
    }
    f().then(console.log); // 1

async garantit que la fonction renvoie une promesse et y englobe également les valeurs non promises

2. attendre

Wait ne fonctionne que dans la fonction asynchrone. Ce mot clé peut suspendre l'exécution du code de la fonction asynchrone et attendre que la promesse soit résolue.

    async function f() {
    
    

        let promise = new Promise((resolve, reject) => {
    
    
            setTimeout(() => resolve("done!"), 1000)
        });
        let p = await promise;  // 暂停
        console.log(p); // 一秒后 "done!";
    }
    f();

La fonction est mise en pause dans la ligne d'attente jusqu'à ce que la valeur de p
soit obtenue lorsque la promesse s'installe et continue de s'exécuter. Par rapport à promise, c'est juste une syntaxe plus élégante pour obtenir le résultat de la promesse, et c'est aussi plus facile lire et écrire.
La fonction ci-dessus peut être réécrite comme:

    let promise = new Promise((resolve,reject)=>{
    
    
        setTimeout(()=> resolve("done!"),1000)
    });
    promise.then(console.log);

ps. Await ne peut pas être utilisé dans des fonctions ordinaires et ne peut pas être utilisé dans des contextes de niveau supérieur tels que les <script>balises M , mais les fonctions asynchrones peuvent être définies et exécutées immédiatement

    (async function f(){
    
    
        console.log(await Promise.resolve(1));
    })();

Pour bien comprendre le mot clé await, vous devez savoir qu'il n'attend pas seulement qu'une valeur soit disponible. Lorsque le moteur d'exécution JavaScript rencontre le mot-clé await, il enregistre l'endroit où l'exécution est suspendue. Lorsque la valeur à droite de wait est disponible, le moteur d'exécution JavaScript pousse une tâche vers la file d'attente de messages et cette tâche reprend l'exécution de la fonction asynchrone.

    async function foo() {
    
    
        console.log(2);
        await null;
        console.log(4);
    }
    console.log(1);
    foo();
    console.log(3);
    // 1
    // 2
    // 3
    // 4

Même si await est suivi d'une valeur immédiatement disponible, la dernière partie de la fonction sera évaluée de manière asynchrone

Pour résumer

Une fonction asynchrone est le résultat de l'application d'un contrat à une fonction JavaScript. Les fonctions asynchrones peuvent suspendre l'exécution sans bloquer le thread principal.

Le mot-clé async avant la fonction a deux effets:

1. Cette fonction renvoie toujours une promesse.
2. Il est permis d'utiliser wait dans cette fonction.

Le mot-clé attendre avant que la promesse ne fasse attendre le moteur JavaScript pour que la promesse se concrétise, puis:

1. S'il y a une erreur, une exception sera levée - tout comme throw error y a été appelée.
2. Sinon, le résultat est renvoyé.