JavaScript Async

"async and await make promises easier to write"

async να κάνει τη λειτουργία να επιστρέφει Promise

await να κάνει τη λειτουργία να περιμένει Promise

Γραμματική Async

ο λέξη-κλειδί πριν από τη λειτουργία async να κάνει τη λειτουργία να επιστρέφει promise:

παράδειγμα

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

είναι ίσο με:

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

Ακολουθεί η χρήση του Promise:

myFunction().then(
  function(value) { /* κώδικας όταν είναι επιτυχία */ },
  function(error) { /* κώδικας όταν υπάρχει σφάλμα */ }
);

παράδειγμα

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

Δοκιμάστε το προσωπικά

ή πιο απλά, επειδή αναμένετε κανονική τιμή (κανονική απάντηση, όχι σφάλμα):

παράδειγμα

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

Δοκιμάστε το προσωπικά

Γραμματική Await

ο λέξη-κλειδί πριν από τη λειτουργία await να κάνει τη λειτουργία να περιμένει την promise:

let value = await promise;

await οι λέξεις-κλειδιά μπορούν να είναι μόνο async στον σώμα της λειτουργίας.

παράδειγμα

ας μάθουμε αργά πώς να το χρησιμοποιούμε.

βασική γραμματική

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

Δοκιμάστε το προσωπικά

ожидание таймаута

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

Δοκιμάστε το προσωπικά

انتظράμε αρχείο

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("File not Found");}
    };
    req.send();
  });
  document.getElementById("demo").innerHTML = await myPromise;
}
getFile();

Δοκιμάστε το προσωπικά

Υποστήριξη των προγραμματιστών

Το ECMAScript 2017 εισήγαγε το κλειδί JavaScript async και await.

Το παρακάτω πίνακας αναφέρει την πρώτη έκδοση των προγραμματιστών που υποστηρίζουν και τα δύο:

Chrome IE Firefox Safari Opera
Chrome 55 Edge 15 Firefox 52 Safari 11 Opera 42
Νοέμβριος 2016 Απρίλιος 2017 Μάρτιος 2017 Σεπτέμβριος 2017 Νοέμβριος 2016