JavaScript Async

"async and await make promises easier to write"

async uczynić funkcję zwracającą Promise

await uczynić funkcję czekającą na Promise

gramatyka Async

kluczowe słowa przed funkcją async uczynić funkcję zwracającą promise:

przykład

async function myFunction() {
  return "Hello";
}

jest to równe:

async function myFunction() {
  return Promise.resolve("Hello");
}

Oto metody użycia Promise:

myFunction().then(
  function(value) { /* Kody w przypadku sukcesu */ },
  function(error) { /* Kody w przypadku błędów */ }
);

przykład

async function myFunction() {
  return "Hello";
}
myFunction().then(
  function(value) {myDisplayer(value);},
  function(error) {myDisplayer(error);}
);

Spróbuj sam

albo bardziej prosto, ponieważ oczekujesz normalnej wartości (normalny odpowiedź, a nie błąd):

przykład

async function myFunction() {
  return "Hello";
}
myFunction().then(
  function(value) {myDisplayer(value);}
);

Spróbuj sam

gramatyka Await

kluczowe słowa przed funkcją await uczynić funkcję czekającą na promise:

let value = await promise;

await kluczowe słowa mogą być używane tylko w async w funkcji

przykład

pojďmy to uczyć się powoli, jak go używać.

podstawowa gramatyka

async function myDisplay() {
  let myPromise = new Promise(function(myResolve, myReject) {
    myResolve("I love You !!");
  });
  document.getElementById("demo").innerHTML = await myPromise;
}
myDisplay();

Spróbuj sam

czekaj na wygaśnięcie czasu

async function myDisplay() {
  let myPromise = new Promise(function(myResolve, myReject) {
    setTimeout(function() { myResolve("I love You !!"); }, 3000);
  });
  document.getElementById("demo").innerHTML = await myPromise;
}
myDisplay();

Spróbuj sam

czekaj na plik

async function getFile() {
  let myPromise = new Promise(function(myResolve, myReject) {
    let req = new XMLHttpRequest();
    req.open('GET', "mycar.html");
    req.onload = function() {
      if (req.status == 200) {myResolve(req.response);}
      else {myResolve("Nie znaleziono pliku");}
    };
    req.send();
  });
  document.getElementById("demo").innerHTML = await myPromise;
}
getFile();

Spróbuj sam

Wsparcie przeglądarek

ECMAScript 2017 wprowadził kluczowe słowa JavaScript async i await.

Poniższa tabela wskazuje pierwsze wersje przeglądarek, które w pełni obsługiwały obie

Chrome IE Firefox Safari Opera
Chrome 55 Edge 15 Firefox 52 Safari 11 Opera 42
Listopad 2016 Kwiecień 2017 Marzec 2017 Wrzesień 2017 Listopad 2016