async function
Deklaruje funkcję asynchroniczną, która zawsze zwraca obietnicę i może używać w środku słowa await.
- Zwraca
- Obietnicę (
Promise), która spełnia się wartością zreturnalbo zostaje odrzucona rzuconym błędem.
Przykład
#const wait = (ms) => new Promise((resolve) => setTimeout(resolve, ms))
async function loadProfile(name) {
await wait(300)
return { name, level: 7 }
}
const promise = loadProfile('Ania')
console.log(promise)
const profile = await promise
console.log(profile)Definicja i zastosowanie
#Słowo async przed funkcją zmienia ją w funkcję asynchroniczną. Taka funkcja zawsze zwraca obietnicę: wartość z return staje się wartością spełnionej obietnicy, a rzucony wyjątek powoduje jej odrzucenie.
Wewnątrz funkcji async możesz używać await, żeby poczekać na wynik innej obietnicy. Kod wygląda wtedy jak zwykły, wykonywany z góry na dół, a błędy łapiesz znanym blokiem try...catch zamiast metodą catch().
async działa z każdą formą funkcji: deklaracją, wyrażeniem, funkcją strzałkową (async () => {}) i metodą w obiekcie lub klasie. Wywołanie funkcji async nie blokuje programu. Kod zapisany po wywołaniu wykona się od razu, zanim funkcja skończy pracę.
Składnia
#async function name(param1, param2) {
…
}
const name = async (param) => {
…
}Więcej przykładów
#async function buyCourse(price, balance) {
if (balance < price) throw new Error('Za mało monet')
return balance - price
}
buyCourse(50, 80).then((rest) => console.log('Zostało:', rest))
buyCourse(90, 80).catch((error) => console.log('Błąd:', error.message))const getPoints = async () => 120
const shop = {
async buy(item) {
const points = await getPoints()
return `${item}: zostało ${points - 100} punktów`
}
}
console.log(await shop.buy('Nowy avatar'))Obsługa przeglądarek
#Szeroko dostępne
Działa we wszystkich nowoczesnych przeglądarkach, także na telefonach. Możesz używać bez obaw.
- Chrome
- Edge
- Firefox
- Safari
Dobre praktyki
#- Samo wywołanie funkcji
asyncdaje obiektPromise. Żeby dostać wynik, użyjawaitalbothen(). - Nie oznaczaj funkcji jako
async, jeśli nie robi nic asynchronicznego. Niepotrzebnie zamienisz jej wynik w obietnicę. - Obsługuj błędy funkcji
asyncprzeztry...catchw jej wnętrzu albocatch()przy wywołaniu.
Powiązane hasła
#- awaitWstrzymuje funkcję async do czasu rozstrzygnięcia obietnicy i zwraca jej wartość albo rzuca jej błąd.
- PromiseObiekt reprezentujący wynik operacji, który pojawi się w przyszłości: wartość przy sukcesie albo błąd.
- try...catchPrzechwytuje błędy rzucone w bloku try i obsługuje je w catch. Opcjonalny finally wykona się zawsze.
- functionDeklaruje nazwaną funkcję: blok kodu z parametrami, który można wywoływać wiele razy i który może zwrócić wynik.
- () => {}Funkcja strzałkowa (arrow function): krótszy zapis funkcji, bez własnego this, z niejawnym return dla jednego wyrażenia.
- fetch()Wysyła zapytanie HTTP i zwraca obietnicę z odpowiedzią serwera (obiektem Response).
Widzisz błąd albo brakuje przykładu? Napisz do nas.