Kurs JavaScript - Błędy  

Autor: Mateusz Mikulski

Opublikowano: 2011-12-20

Każda aplikacja, która wymaga od użytkownika wprowadzenia danych, może wygenerować błąd. W większości przypadków komunikat w przeglądarce, mówiący o wystąpieniu błędów (Rys. 1.) na stronie, zniechęci potencjalnego użytkownika. Aby ustrzec się przed taką sytuacją i ukryć błędy przed użytkownikiem, lub użyć ich jako swego rodzaju atutu aplikacji (np. informacja o źle wypełnionych polach), należy posłużyć się instrukcją Try Catch. W tym samouczku nauczysz się, jak wychwytywać błędy w języku JavaScript, przy użyciu instrukcji Try Catch.

Rys. 1. Przykładowy komunikat błędu na stronie.

Przed wykonaniem zadań powinieneś wiedzieć:

1. jak umieszczać skrypty,
2. jak wyświetlić komunikat,
3. jak tworzyć instrukcje warunkowe w języku JavaScript,
4. jak pobierać dane od użytkownika.

Po wykonaniu zadań nauczysz się:

• jak używać instrukcji Try Catch w języku JavaScript.

Implementacja

W Visual Studio otwórz plik bledyJS.htm, znajdujący się w pliku JavaScript.zip. Strona w widoku Source powinna wyglądać tak, jak zaprezentowano to na Rys. 2.

Rys. 2. Przygotowana strona otwarta w Visual Studio.

Przygotowana aplikacja to prosty kalkulator, wykonujący podstawowe działania matematyczne (+ - * /). Wygląd kalkulatora w przeglądarce przedstawiono na Rys 3.

Rys. 3. Przygotowana strona WWW.

Twoim zadaniem będzie dodanie instrukcji Try Catch, wychwytujących błąd w działaniu przygotowanego kalkulatora.

Dodanie metody Try Catch do skryptu

Metoda wychwytywania błędówTry Catch składa się z dwóch elementów:

Try
{
//Kod, w którym może wystąpić błąd
}

Try wykonuje kod w elemencie, po czym w momencie wystąpienia błędu przekazuje go do elementu Catch:

Catch()
{
//Kod w przypadku wystąpienia błędu w elemencie Try
}

Catch wykonuje odpowiednią akcję w przypadku wystąpienia błędu w elemencie Try.

1. Sprawdź działanie strony bledyJS.htm w przeglądarce.

• Otwórz stronę bledyJS.htm w przeglądarce.
• Wpisz działanie i wciśnij przycisk „=”.
• Wpisz ciąg znaków, np. ala, i wciśnij przycisk „=”.

2. Do skryptu dodaj metodę Try Catch:

• Istniejący skrypt zmodyfikuj w następujący sposób:

<script type="text/javascript">
    function calc() 
{
    str = document.getElementById('query').value;

    try
    {
        document.getElementById('query').value = eval(str);
    }

    catch (err)
    {
        alert("Pamiętaj, że możesz wprowadzić tylko liczby, oraz znaki specjalne: () . *  / + -");
        document.getElementById('query').value = str + "=błąd";
    }
}
</script>

3. Zapisz stronę i otwórz ją w przeglądarce.

• Wprowadź działanie zawierające niedozwolone znaki i kliknij przycisk "="
• Przeglądarka powinna pokazać wcześniej przygotowany komunikat tak, jak pokazano to na Rys. 3.

Rys. 4. Komunikat błędu w przypadku wprowadzenia niedozwolonych znaków do działania.

Podsumowanie

W tym samouczku nauczyłeś się, jak wychwytywać wystąpienie wyjątków w języku JavaScript, przy użyciu instrukcji Try Catch.

W kolejnym samouczku nauczysz się wykonywać działania co określony interwał czasowy.

 

---