Promisy

Promisy w JavaScript są używane do obsługi operacji asynchronicznych. Umożliwiają one obsługę zdarzeń, które mogą zająć nieokreślony czas do zakończenia, takich jak pobieranie danych z serwera. Promisy mogą znajdować się w jednym z trzech stanów: oczekujący (pending), spełniony (fulfilled), lub odrzucony (rejected). Dzięki promisom, kod jest bardziej czytelny i łatwiejszy w obsłudze, w porównaniu do tradycyjnych metod asynchronicznych, takich jak callbacki.

Przykłady użycia promisów

Poniżej przedstawiono kompletny plik HTML z JavaScript, który ilustruje różne przypadki użycia promisów, w tym tworzenie prostego promisa, obsługę sukcesów i błędów oraz łączenie promisów.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Przykłady użycia promisów w JavaScript</title>
</head>
<body>
    <h3>Przykłady użycia promisów w JavaScript</h3>
    <script>
        // Przykład 1: Tworzenie i rozwiązywanie prostego promisa
        // Opis: Tworzenie promisa, który natychmiast zostaje spełniony.
        let promise = new Promise((resolve, reject) => {
            // Symulacja operacji asynchronicznej
            setTimeout(() => resolve("Operacja zakończona sukcesem!"), 1000);
        });

        promise.then(
            result => console.log(result), // Wyświetla "Operacja zakończona sukcesem!"
            error => console.log(error)    // Nie zostanie wywołane
        );

        // Przykład 2: Obsługa odrzucenia promisa
        // Opis: Tworzenie promisa, który jest odrzucany.
        let rejectedPromise = new Promise((resolve, reject) => {
            // Symulacja operacji asynchronicznej kończącej się błędem
            setTimeout(() => reject(new Error("Operacja nie powiodła się")), 1000);
        });

        rejectedPromise.then(
            result => console.log(result),
            error => console.log(error)    // Wyświetla błąd: "Operacja nie powiodła się"
        );

        // Przykład 3: Łączenie promisów z użyciem Promise.all
        // Opis: Wykonanie wielu promisów równolegle i czekanie na ich zakończenie.
        let promise1 = Promise.resolve(3);
        let promise2 = 42;
        let promise3 = new Promise((resolve, reject) => {
            setTimeout(resolve, 1000, "foo");
        });

        Promise.all([promise1, promise2, promise3]).then(values => {
            console.log(values);  // Wyświetla: [3, 42, "foo"]
        });
    </script>
</body>
</html>

Podsumowanie

Promisy są kluczowym elementem obsługi asynchroniczności w JavaScript, pozwalając na czysty i zrozumiały kod, łatwy do debugowania i utrzymania. Ich elastyczność pozwala na obsługę pojedynczych operacji asynchronicznych, jak również skomplikowanych przepływów danych poprzez łączenie wielu promisów. Zrozumienie i skuteczne wykorzystanie promisów jest fundamentalne dla nowoczesnego programowania webowego.

Jeżeli chcesz przyśpieszyć swoją naukę tworzenia stron chciałbym polecić mój kurs JavaScript od podstaw w którym nauczysz się tego języka od podstaw do zaawansowanych jego aspektów.

Poprzedni
Następny
Scroll to Top