Pourquoi await ne fonctionne que dans les fonctions asynchrones en javascript ?

Question

Je passe juste par là tutoriel et je n'arrive pas à comprendre pourquoi. await ne fonctionne que dans async fonction.

Du tutoriel :

Comme indiqué, await ne fonctionne qu'à l'intérieur d'une fonction asynchrone.

D'après ce que j'ai compris, async enveloppe l'objet de retour de la fonction dans une Promise, afin que l'appelant puisse utiliser .then()

async function f() {
  return 1;
}

f().then(alert); // 1

Et await attend juste que la promesse s'installe dans le cadre de la async fonction.

async function f() {

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

  let result = await promise; // wait till the promise resolves (*)

  alert(result); // "done!"
}

f();

Il me semble que leurs usages ne sont pas liés, quelqu'un pourrait-il m'expliquer ?

Answer 1

async y await sont tous deux des méta-mots-clés qui permettent d'écrire du code asynchrone de façon à ce que regarde synchrone. Un site async indique au compilateur, à l'avance, que la fonction retournera un fichier Promise et n'auront pas une valeur résolue tout de suite. Pour utiliser await et ne pas bloquer le fil async doit être utilisé.

async function f() {
    return await fetch('/api/endpoint');
}

est équivalent à

function f() {
    return new Promise((resolve,reject) => {
        return fetch('/api/endpoint')
        .then(resolve);
    });
}