U ovom ćete tutorijalu uz primjere naučiti o ključnim riječima async / await JavaScript.
Koristite async
ključnu riječ s funkcijom da predstavite da je funkcija asinkrona funkcija. Funkcija asinkronizacije vraća obećanje.
Sintaksa async
funkcije je:
async function name(parameter1, parameter2,… paramaterN) ( // statements )
Ovdje,
- ime - naziv funkcije
- parametri - parametri koji se prosljeđuju funkciji
Primjer: Async funkcija
// async function example async function f() ( console.log('Async function.'); return Promise.resolve(1); ) f();
Izlaz
Async funkcija.
U gore navedenom programu async
ključna riječ koristi se prije funkcije da bi prikazala da je funkcija asinkrona.
Budući da ova funkcija vraća obećanje, možete koristiti metodu ulančavanja then()
poput ove:
async function f() ( console.log('Async function.'); return Promise.resolve(1); ) f().then(function(result) ( console.log(result) ));
Izlaz
Funkcija asinkronizacije 1
U gore navedenom programu f()
funkcija je riješena i then()
metoda se izvršava.
JavaScript čeka ključnu riječ
await
Ključna riječ se koristi unutar async
funkcije čekati za asinkroni rad.
Sintaksa koju treba koristiti await je:
let result = await promise;
Korištenje await
zaustavlja funkciju asinkronizacije sve dok obećanje ne vrati vrijednost rezultata (razriješi ili odbaci). Na primjer,
// 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();
Izlaz
Obećanje riješeno pozdrav
U gore navedenom programu stvara se Promise
objekt koji se rješava nakon 4000 milisekundi. Ovdje je asyncFunc()
funkcija napisana pomoću async
funkcije.
Na await
čeka ključne riječi za obećanje da se kompletna (odlučnost ili odbiti).
let result = await promise;
Dakle, pozdrav se prikazuje tek nakon što je vrijednost obećanja dostupna varijabli rezultata.
U gornjem programu, ako await
se ne koristi, prikazuje se zdravo prije nego što je Promise riješeno.
![](https://cdn.wiki-base.com/5118073/javscript_asyncawait.png.webp)
Napomena : Možete koristiti await
samo unutar async funkcija.
Funkcija asinkronizacije omogućuje izvršavanje asinkrone metode na naizgled sinkroni način. Iako je operacija asinkrona, čini se da se operacija izvršava sinkrono.
To može biti korisno ako u programu postoji više obećanja. Na primjer,
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); )
U gore navedenom programu await
čeka da se svako obećanje ispuni.
Rukovanje pogreškama
Dok koristite async
funkciju, kôd pišete sinkrono. A također možete koristiti catch()
metodu za hvatanje pogreške. Na primjer,
asyncFunc().catch( // catch error and do something )
Drugi način na koji možete riješiti pogrešku je pomoću try/catch
bloka. Na primjer,
// 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
U gore navedenom programu koristili smo try/catch
blok za rukovanje pogreškama. Ako se program uspješno izvodi, preći će na try
blok. A ako program baci pogrešku, preći će na catch
blok.
Da biste saznali više o try/catch
detaljima, posjetite JavaScript JavaScript try / catch.
Prednosti upotrebe funkcije asinkronizacije
- Kôd je čitljiviji od korištenja povratnog poziva ili obećanja.
- Rukovanje pogreškama je jednostavnije.
- Otklanjanje pogrešaka je lakše.
Napomena : Ove dvije ključne riječi async/await
predstavljene su u novijoj verziji JavaScript-a (ES8). Neki stariji preglednici možda ne podržavaju upotrebu async / await. Da biste saznali više, posjetite podršku za preglednik async / await JavaScript.