Programmeerimise maailmas on oluline, et asünkroonseid toiminguid tõhusalt käsitleda, et tagada meeldiv kasutajakogemus. Eriti JavaScriptis on mitmeid võimalusi selleks. Üks populaarsemaid meetodeid asünkroonsete toimingutega töötamiseks on async/await konstruktsioon. See sisaldab süntaktilist lihtsustust, mis võimaldab sul asünkroneid programmeerimist selgemaks ja loetavamaks muuta. Tutvume selles juhendis async'i ja await'i põhialustega ning kuidas need saavad parandada sinu koodimist.
Olulisemad järeldused
- async/await võimaldab selgemat ja lihtsamat süntaksit asünkroonsete toimingute käsitsemiseks.
- Iga funktsioon, mis kasutab märksõna await, peab olema deklareeritud kui async.
- await ootab tõhusalt ära lubaduse täitmise, enne kui kood jätkub.
- Vigade käsitlemine saab elegantset lahendust try/catch plokkide abil.
Üksikasjalik juhend
Esimese asjana peaksid sa veenduma, et mõistad lubaduste aluseid, kuna async/await põhineb nendel. Kui oled lubadustega tuttav, saame nüüd arutada async/await kasutamist.
1. samm: viivituse funktsiooni loomine
Alusta lihtsast funktsioonist, mis tagastab lubaduse, mis simuleerib viivitust. Siin on näide funktsioonist nimega delay.
See on põhiteostus. Selle funktsiooniga saad määrata viivituse millisekundites.

2. samm: Async ja Await kasutuselevõtt
Nüüd soovid sa kasutada async/await eeliseid. Alusta funktsiooni loomisega, mis kasutab async-märksõna.
Antud koodilõigus kasutab funktsioon runDelay async-märksõna, mis võimaldab tal kasutada await'i. See tähendab, et funktsiooni täitmine peatub, kuni lubadus, mille tagastab delay-funktsioon, on täidetud.
3. samm: Asünkroonse funktsiooni testimine
Funtsionaalsuse testimiseks kutsu esile runDelay funktsioon.
Kui jooksutad skripti, näed, et konsool kuvab "Alustan viivitust...", siis pausib 2 sekundiks ja lõpuks kuvab "Viivitus lõppenud."
4. samm: Vigade käsitlemine try/catch abil
See juhtub sageli programmeerimises – vead võivad tekkida igal hetkel. Async/await abil saad vigu try/catch abil lihtsamalt käsitleda.
Kui soovid vigu püüdma hakata, saad runDelay funktsiooni järgmises suunas kohandada:
Try/catch'i kasutamisel saavad kõik vead, mis tekivad await delay(2000) täitmise ajal, kinni püüda ja kuvada.

5. samm: fetchi kasutamine async/await abil
Ohtlikult tihti esinev kasutusjuht on andmete hankimine fetch-API abil.
Selles näites teeme fetchiga võrgu päringu. Jälle saame await'i abil tagada, et ootame vastust, enne kui edasi liigume.
Kokkuvõte - Async ja Await: Üksikasjalik juhend
Selles juhendis oled õppinud, kuidas async/await konstruktsiooni abil JavaScriptis asünkroonseid toiminguid selgemalt käsitleda. Sa oled näinud, kuidas luua viivituse funktsiooni, kuidas käsitleda vigu ja kuidas tõhusalt andmeid fetch-API abil hankida.
Kasu sa sellest süntaksist oma tulevastes projektides, et muuta oma kood loetavamaks ja hooldatavamaks!
Korduma kippuvad küsimused
Mis on vahe async ja await vahel?async märgib funktsiooni asünkroonsena, mis tähendab, et see tagastab lubadusi. await'i kasutatakse, et oodata lubaduse tulemuse saamist.
Millal peaksid sa kasutama async/await?Kasutage seda, kui töötate asünkroonsete toimingutega ja soovite, et teie kood oleks selge ja loetav.
Kas ma saaksin async/await kasutada igas brauseris?Jah, kuid veendu, et kasutatav brauser toetab kaasaegset JavaScripti süntaksit. Vajadusel saab kasutada transpilereid nagu Babel.
Kas ma saan await'i kasutada tavafunktsioonis?Ei, et kasutada await'i, peab funktsioon, kus see kasutusel on, olema deklareeritud kui async.
Mis juhtub, kui lubadus ebaõnnestub?Kui lubadus ebaõnnestub, vallandatakse vea sõnum, mida saab käsitleda try/catch abil.