Javscript async / αναμονή

Σε αυτό το σεμινάριο, θα μάθετε για το JavaScript async / αναμονή λέξεων-κλειδιών με τη βοήθεια παραδειγμάτων.

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

Η σύνταξη της asyncσυνάρτησης είναι:

 async function name(parameter1, parameter2,… paramaterN) ( // statements )

Εδώ,

  • όνομα - όνομα της συνάρτησης
  • παράμετροι - παράμετροι που μεταβιβάζονται στη συνάρτηση

Παράδειγμα: Λειτουργία Async

 // async function example async function f() ( console.log('Async function.'); return Promise.resolve(1); ) f(); 

Παραγωγή

 Λειτουργία Async.

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

Δεδομένου ότι αυτή η συνάρτηση επιστρέφει μια υπόσχεση, μπορείτε να χρησιμοποιήσετε τη μέθοδο αλυσίδας then()ως εξής:

 async function f() ( console.log('Async function.'); return Promise.resolve(1); ) f().then(function(result) ( console.log(result) ));

Παραγωγή

 Λειτουργία Async 1

Στο παραπάνω πρόγραμμα, η f()συνάρτηση επιλύεται και η then()μέθοδος εκτελείται.

Η JavaScript περιμένει τη λέξη-κλειδί

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

Η σύνταξη που πρέπει να περιμένετε είναι:

 let result = await promise;

Η χρήση awaitδιακόπτει τη συνάρτηση async έως ότου η υπόσχεση επιστρέψει μια τιμή (επίλυση ή απόρριψη). Για παράδειγμα,

 // a promise let promise = new Promise(function (resolve, reject) ( setTimeout(function () ( resolve('Promise resolved')), 4000); )); // async function async function asyncFunc() ( // wait until the promise resolves let result = await promise; console.log(result); console.log('hello'); ) // calling the async function asyncFunc();

Παραγωγή

 Η υπόσχεση λύθηκε γεια

Στο παραπάνω πρόγραμμα, δημιουργείται ένα Promiseαντικείμενο και επιλύεται μετά από 4000 χιλιοστά του δευτερολέπτου. Εδώ, η asyncFunc()συνάρτηση γράφεται χρησιμοποιώντας τη asyncσυνάρτηση.

Η awaitλέξη-κλειδί περιμένει την υπόσχεση να ολοκληρωθεί (επίλυση ή απόρριψη).

 let result = await promise;

Ως εκ τούτου, το γεια εμφανίζεται μόνο αφού η τιμή υπόσχεσης είναι διαθέσιμη στη μεταβλητή αποτελέσματος.

Στο παραπάνω πρόγραμμα, εάν awaitδεν χρησιμοποιείται, το γεια εμφανίζεται πριν επιλυθεί η υπόσχεση.

Λειτουργία της λειτουργίας ασύγχρονης / αναμονής

Σημείωση : Μπορείτε να χρησιμοποιήσετε awaitμόνο μέσα σε λειτουργίες ασύγχρονης.

Η συνάρτηση async επιτρέπει την εκτέλεση της ασύγχρονης μεθόδου με φαινομενικά σύγχρονο τρόπο. Αν και η λειτουργία είναι ασύγχρονη, φαίνεται ότι η λειτουργία εκτελείται με σύγχρονο τρόπο.

Αυτό μπορεί να είναι χρήσιμο εάν υπάρχουν πολλές υποσχέσεις στο πρόγραμμα. Για παράδειγμα,

 let promise1; let promise2; let promise3; async function asyncFunc() ( let result1 = await promise1; let result2 = await promise2; let result3 = await promise3; console.log(result1); console.log(result1); console.log(result1); )

Στο παραπάνω πρόγραμμα, awaitπεριμένει κάθε υπόσχεση να ολοκληρωθεί.

Σφάλμα χειρισμού

Κατά τη χρήση της asyncσυνάρτησης, γράφετε τον κώδικα με σύγχρονο τρόπο. Και μπορείτε επίσης να χρησιμοποιήσετε τη catch()μέθοδο για να εντοπίσετε το σφάλμα. Για παράδειγμα,

 asyncFunc().catch( // catch error and do something )

Ο άλλος τρόπος με τον οποίο μπορείτε να χειριστείτε ένα σφάλμα είναι χρησιμοποιώντας το try/catchμπλοκ. Για παράδειγμα,

 // a promise let promise = new Promise(function (resolve, reject) ( setTimeout(function () ( resolve('Promise resolved')), 4000); )); // async function async function asyncFunc() ( try ( // wait until the promise resolves let result = await promise; console.log(result); ) catch(error) ( console.log(error); ) ) // calling the async function asyncFunc(); // Promise resolved

Στο παραπάνω πρόγραμμα, χρησιμοποιήσαμε το try/catchμπλοκ για να χειριστούμε τα σφάλματα. Εάν το πρόγραμμα εκτελεστεί με επιτυχία, θα μεταβεί στο tryμπλοκ. Και εάν το πρόγραμμα ρίξει ένα σφάλμα, θα μεταβεί στο catchμπλοκ.

Για να μάθετε περισσότερα σχετικά try/catchμε τις λεπτομέρειες, επισκεφθείτε τη JavaScript JavaScript δοκιμάστε / πιάστε.

Οφέλη από τη χρήση της λειτουργίας async

  • Ο κωδικός είναι πιο αναγνώσιμος από τη χρήση επιστροφής κλήσης ή υπόσχεσης.
  • Ο χειρισμός σφαλμάτων είναι απλούστερος.
  • Ο εντοπισμός σφαλμάτων είναι ευκολότερος.

Σημείωση : Αυτές οι δύο λέξεις-κλειδιά async/awaitεισήχθησαν στη νεότερη έκδοση του JavaScript (ES8). Ορισμένα παλαιότερα προγράμματα περιήγησης ενδέχεται να μην υποστηρίζουν τη χρήση του async / waiting. Για να μάθετε περισσότερα, επισκεφθείτε το JavaScript async / περιμένετε την υποστήριξη του προγράμματος περιήγησης.

ενδιαφέροντα άρθρα...