Programowanie webowe | 05. JavaScript potrzebny do egzaminu

Tutorial video, wersja MP3

Mirosław Zelent

W poprzednim odcinku kursu dokonaliśmy starannego przeglądu właściwości CSS, zaś w tym epizodzie przepracujemy wszystko co na pewno trzeba do egzaminu wiedzieć, jeśli chodzi o język JavaScript. HTML i CSS to jedynie języki opisowe, podczas gdy JavaScript, to już pełnoprawny język programowania. Czyli język, w którym podejmujemy decyzje, obsługujemy tzw. zdarzenia, tworzymy pętle, funkcje, a nawet klasy, metody i obiekty. A zatem mimo, że na egzaminie zawodowym sprawdzone zostaną jedynie absolutne fundamenty użycia JS, to i tak nauczenie się tego wymaga dużo więcej wysiłku, logicznego myślenia, i cierpliwości w debugowaniu, czyli znajdowaniu i usuwaniu błędów, aniżeli HTML i CSS kiedykolwiek będą od Ciebie wymagały.

Znajdź w filmie

Nasze tutoriale posiadają tzw. timestamps (chwile czasowe) - dzięki nim łatwo odnajdziesz interesujące fragmenty wiedzy. Wystarczy kliknąć na podane w nawiasach kwadratowych momenty filmu, by przewinąć tutorial dokładnie do interesującego Cię miejsca w odcinku.

[ 00:00:14 ] Tytułem wstępu
[ 00:01:48 ] Próg egzaminacyjny w technikum dla JavaScriptu
[ 00:02:34 ] Język opisowy vs. język programowania
[ 00:05:55 ] Omówienie plików projektu
[ 00:07:38 ] Pierwszy skrypt do wykonania - treść zadania
[ 00:09:35 ] Zbudowanie interfejsu HTML dla pierwszego zadania
[ 00:13:32 ] Sposoby osadzania skryptów JS w kodzie HTML
[ 00:15:10 ] Zmienne. Tworzenie zmiennych
[ 00:16:17 ] Uchwycenie elementu HTML w JavaScript
[ 00:19:00 ] Okno dialogowe alert
[ 00:19:53 ] Używanie konsoli przeglądarki (debugowanie skryptu)
[ 00:21:38 ] Programowanie zdarzeniowe
[ 00:22:32 ] Tworzenie własnej funkcji
[ 00:23:40 ] Po co tworzyć własne funkcje?
[ 00:24:51 ] Obsługa zdarzenia click przez własną funkcję
[ 00:26:25 ] Niewrażliwość funkcji na miejsce podpięcia skryptu
[ 00:28:26 ] Atrybut onclick czy addEventListener?
[ 00:29:00 ] Wyprowadzenie wartości zmiennej w console.log
[ 00:29:22 ] Komentarze w JavaScript
[ 00:30:47 ] Wyprowadzenie wartości zmiennej w innerHTML diva
[ 00:33:16 ] Czy wczytano liczbę? Instrukcja warunkowa if
[ 00:35:15 ] Spójniki logiczne: OR, AND
[ 00:39:04 ] Klauzula else w instrukcji warunkowej
[ 00:40:37 ] Klejenie napisów (konkatenacja łańcuchów)
[ 00:42:22 ] Parsowanie liczb metodami parseFloat, parseInt
[ 00:47:50 ] Przygotowanie funkcji dla odejmowania i mnożenia
[ 00:50:00 ] Przygotowanie funkcji dla dzielenia
[ 00:52:07 ] Pominięcie klamer w instrukcji warunkowej
[ 00:53:20 ] Uniknięcie redundancji, refaktoryzacja kodu
[ 00:53:38 ] Pojedyncza funkcja, ale korzystająca z parametru
[ 00:56:43 ] Instrukcja wyboru switch
[ 01:02:34 ] Drugi skrypt do wykonania - treść zadania
[ 01:04:05 ] Opis interfejsu HTML dla drugiego zadania
[ 01:05:28 ] Osadzenie skryptu z zewnętrznego pliku
[ 01:06:05 ] Własna funkcja weryfikująca, wczytanie danych
[ 01:07:56 ] Czy hasło jest puste?
[ 01:09:40 ] Klauzula else if w instrukcji warunkowej
[ 01:10:16 ] Odczytanie długości length łańcucha
[ 01:11:35 ] Jak sprawdzić czy łańcuch zawiera cyfrę?
[ 01:14:01 ] Przekazywanie kopii parametru do podprogramu
[ 01:17:50 ] Budowa łańcucha, indeks pojedynczego znaku
[ 01:18:28 ] Algorytm sprawdzania znaków w pętli
[ 01:20:43 ] Pętla for, iterator, warunek zerwania
[ 01:22:50 ] Dostęp do pojedynczego znaku łańcucha
[ 01:23:50 ] Metoda charAt(i), bezpieczny odczyt znaku
[ 01:25:45 ] Zwrócenie wartości funkcji, klauzula return
[ 01:30:53 ] Refaktoryzacja kodu, użycie tablicy ASCII
[ 01:32:27 ] Metoda charCodeAt(i), odczyt kodu znaku
[ 01:33:32 ] Jak odtworzyć z pamięci tablicę ASCII?
[ 01:36:23 ] Kilka porad końcowych
[ 01:38:16 ] Podsumowanie odcinka na slajdach

Pobierz wersję MP3

Dobrym rozwiązaniem w czasie przygotowań do egzaminu jest pobrać sobie odcinki w formacie mp3, aby w wolnej chwili (kiedy np. ćwiczysz fizycznie, podróżujesz) wrzucić sobie tutorial na słuchawki i odtworzyć w umiarkowanym skupieniu, aby osłuchać się wstępnie z nowym tematem. Natomiast jeśli tutorial zawiera momenty, w których prowadzący wykonuje jakieś konkretne działania na pulpicie komputera, to spróbuj następującego ćwiczenia: postaraj się zwizualizować sobie co dzieje się na video, mimo iż tylko słyszysz co prowadzący zapisuje, klika, zaznacza, zmienia.

A następnie, po powrocie do domu, zajrzyj na ile to czego się spodziewasz, odbiegać będzie od rzeczywistej czynności ukazanej na filmie. Przypomina to trening szachistów, którzy rozgrywają partie na wirtualnej szachownicy w swojej głowie - to fantastyczne ćwiczenie, gdyż pozwala głębiej zapamiętać oraz zrozumieć co i dlaczego zostało wykonane.