Async JavaScript odnosi się do mechanizmów umożliwiających wykonywanie operacji asynchronicznych w JavaScript bez blokowania głównego wątku aplikacji.
Dzięki asynchroniczności aplikacje webowe mogą reagować na działania użytkownika, jednocześnie wykonując operacje takie jak pobieranie danych z serwera, obsługa timerów czy praca z plikami.
JavaScript działa w modelu single-thread, co oznacza, że posiada jeden główny wątek. Asynchroniczność realizowana jest przez:
Callback to funkcja przekazywana jako argument, wywoływana po zakończeniu operacji asynchronicznej.
fetchData(function(result) {
console.log(result);
});
Wadą callbacków jest tzw. callback hell, czyli trudny do czytania, zagnieżdżony kod.
Promise reprezentuje wartość, która będzie dostępna w przyszłości.
fetch(url) .then(response => response.json()) .then(data => console.log(data)) .catch(error => console.error(error));
Promise może być w stanie:
async / await to nowoczesna i czytelna składnia upraszczająca pracę z Promise.
async function loadData() {
try {
const response = await fetch(url);
const data = await response.json();
console.log(data);
} catch (error) {
console.error(error);
}
}
Async JavaScript jest fundamentem nowoczesnych aplikacji webowych. Pozwala tworzyć responsywne, szybkie i przyjazne dla użytkownika interfejsy, upraszczając obsługę operacji wykonywanych w tle.
1