Head First JavaScript [Edycja polska]
9788324660483 [PDF]
Dziś statyczne witryny WWW giną w ogromnej masie podobnych sobie stron, przy braku zainteresowania współczesnych użytkow
146
41
34MB
Polish
Pages [617]
Year 2009
Report DMCA / Copyright
DOWNLOAD PDF FILE
Table of contents :
Spis treści
Wprowadzenie
Dla kogo jest ta książka?
Wiemy, co sobie myślisz
Metapoznanie — myślenie o myśleniu
Oto, co możesz zrobić, aby zmusić swój mózg do posłuszeństwa
Przeczytaj to
Zespół recenzentów
Podziękowania
Rozdział 1. W odpowiedzi na wirtualny świat
Użytkownicy (WWW) mają swoje potrzeby
To jakby rozmowa ze ścianą — całkowity brak reakcji
A JavaScript odpowiada
Światła, kamera, akcja!
Użyj znacznika , by dać przeglądarce znać, że piszesz kod JavaScript
Twoja przeglądarka WWW poradzi sobie z kodem HTML, CSS i JavaScript
Najlepszy wirtualny przyjaciel mężczyzny… potrzebuje TWOJEJ pomocy
Zapewnianie interaktywności iGłazowi
Utworzenie strony WWW iGłazu
Test
Zdarzenia JavaScript: udzielamy głosu iGłazowi
Informowanie użytkownika przy wykorzystaniu funkcji
Dodanie powitania
A teraz zadbamy o to, by iGłaz stał się naprawdę interaktywny
Interakcja jest komunikacją DWUstronną
Dodajemy funkcję do pobrania imienia użytkownika
Błyskawiczna powtórka: co się przed chwilą stało?
Testujemy iGłaz w wersji 1.0
Rozdział 2. Wszystko ma swoje miejsce
Twoje skrypty mogą przechowywać dane
Skrypty myślą w oparciu o typy danych
Stałe zostają TAKIE SAME, wartości zmiennych mogą się ZMIENIAĆ
Zmienne początkowo nie mają wartości
Inicjalizacja zmiennej przy użyciu znaku =
Stałe są odporne na zmiany
A jak wyglądają nazwy?
Dozwolone i niedozwolone nazwy zmiennych oraz stałych
Nazwy zmiennych często są zapisywane według notacji CamelCase
Planujemy stronę zamówienia dla Donalda
Pierwsze podejście do obliczeń w formularzu zamówienia
Inicjuj swoje dane albo…
NaN NIE jest liczbą
Nie tylko liczby można dodawać
parseInt() oraz parseFloat() — konwersja łańcuchów znaków na liczby
Dlaczego w zamówieniu pojawiają się dodatkowe pączki?
Donald odkrywa „szpiegostwo ciastkarskie”
Użyj metody getElementById(), by pobrać dane z formularza
Weryfikacja danych w formularzu
Staraj się, by interfejs użytkownika był intuicyjny
Rozdział 3. W głąb przeglądarki
Klienty, serwery i JavaScript
Co przeglądarka może zrobić dla Ciebie?
iGłaz musi reagować bardziej wyraziście
Liczniki czasu kojarzą akcje z upływającym czasem
Przerywanie działania licznika
Tworzenie licznika czasu przy użyciu funkcji setTimeout()
W zbliżeniu — funkcja setTimeout()
Wiele rozmiarów ekranu, wiele skarg
Użyj obiektu document, by określić szerokość okna przeglądarki
Skorzystaj z obiektu document, by odczytać szerokość okna klienta
Określanie wymiarów obrazka iGłazu
Wielkość iGłazu należy dostosować do strony
W momencie zmiany wielkości okna zgłaszane jest zdarzenie onresize
Zdarzenie onresize skaluje obrazek iGłazu
Czy myśmy się już spotkali? Rozpoznawanie użytkownika
Każdy skrypt ma swój cykl życiowy
Ciasteczka mogą istnieć dłużej niż cykl życia skryptu
Ciasteczka mają nazwę i przechowują wartość… poza tym mogą wygasnąć
Twój kod JavaScript może istnieć POZA Twoją stroną WWW
Przywitaj użytkownika ciasteczkiem
Teraz funkcja greetUser bazuje na ciasteczkach
Nie zapomnij o zapisaniu ciasteczka
Ciasteczka mają wpływ na bezpieczeństwo przeglądarek
Świat bez ciasteczek
Porozmawiaj z użytkownikiem, to lepsze niż nic…
Rozdział 4. Jeśli droga się rozwidla, nie wahaj się skręcić
Szczęśliwy uczestniku, prosimy na scenę!
„Jeśli” to prawda, to coś zrób
Instrukcja if przetwarza warunek, a następnie wykonuje operację
Użyj instrukcji if, by wybrać jedną z dwóch opcji
Instrukcja if pozwala wybierać spośród wielu opcji
Dodawanie klauzuli else do instrukcji if
Przebiegiem zdarzeń sterują zmienne
Brakuje jednak części historii
Składanie operacji w JavaScripcie
Męczy Cię podejmowanie decyzji przy użyciu instrukcji if/else?
Instrukcję if można umieścić wewnątrz innej instrukcji if
Twoje funkcje kontrolują działanie stron
Pseudokod pozwala naszkicować ogólny obraz przygody
Nierówność kreskowego ludzika
!= Ech, nie mam ci nic do powiedzenia…
Podejmowanie decyzji z wykorzystaniem operatorów porównania
Komentarze, puste miejsca i dokumentacja
Komentarze w JavaScripcie zaczynają się od znaków //
Zakres i kontekst — gdzie „żyją” dane
Sprawdź, gdzie są rozmieszczone zmienne w naszej przygodzie
Gdzie żyją moje dane?
Jedna z pięciu
Zagnieżdżanie instrukcji if/else może się stać skomplikowane
Instrukcje switch udostępniają wiele opcji
Poznajemy szczegóły instrukcji switch
Testowanie nowej wersji Przygody kreskowego ludzika
Rozdział 5. Ryzykując powtórzeniem
„X” wskazuje miejsce
Cały czas déja vu — pętle for
Poszukiwanie skarbów z pętlą for
Anatomia pętli for
Mandango — wyszukiwarka miejsc dla prawdziwych macho
Najpierw sprawdzamy dostępność miejsc
Pętle, HTML i dostępność miejsc
Fotele są zmiennymi
Tablice gromadzą wiele danych
Wartości tablicy są zapisywane wraz z kluczami
Od JavaScriptu do HTML-a
Wizualizacja miejsc na stronie Mandango
Niezupełnie trywialne wyszukiwanie miejsc
Test: odnajdywanie pojedynczych wolnych miejsc
Co za dużo, to niezdrowo — pętle nieskończone
Pętle zawsze muszą mieć warunek zakończenia (albo nawet dwa!)
Przerwa w działaniu
Odkrywamy operatory logiczne
Powtórzenia do skutku… dopóki warunek jest spełniony
Analiza pętli while
Zastosowanie odpowiedniej pętli do konkretnego zadania
Modelowanie danych reprezentujących miejsca w kinie
Tablica tablic — tablice dwuwymiarowe
Dwa klucze zapewniają dostęp do tablicy dwuwymiarowej
Dwuwymiarowe Mandango
Cała sala miejsc dla prawdziwych macho
Rozdział 6. Redukuj i używaj wielokrotnie
Matka wszystkich problemów
Funkcje jako narzędzia do rozwiązywania problemów
Tworzenie funkcji w praktyce
Funkcje, które już poznałeś
Lepsza klimatyzacja dzięki większej ilości danych
Przekazywanie informacji do funkcji
Argumenty funkcji jako dane
Funkcje eliminują powtarzający się kod
Tworzenie funkcji określającej status miejsc
Funkcja setSeat() jeszcze bardziej poprawia kod aplikacji Mandango
Znaczenie informacji zwrotnych
Zwracanie danych z funkcji
Wiele szczęśliwych wartości wynikowych
Odczyt statusu miejsca
Prezentacja statusu miejsca
Możemy połączyć funkcję z obrazkiem
Powielanie kodu nigdy nie jest dobre
Separacja funkcjonalności od zawartości
Funkcje są zwykłymi danymi
Wywołania i odwołania do funkcji
Zdarzenia, funkcje zwrotne i atrybuty HTML
Określanie procedur obsługi zdarzeń przy użyciu odwołań do funkcji
Literały funkcyjne spieszą z odsieczą
Czym jest kojarzenie?
Struktura strony HTML
Rozdział 7. Aby użytkownik powiedział nam wszystko
Formularz rejestracyjny Banerolotu
Kiedy HTML nie wystarcza
Dostęp do danych formularzy
Weryfikacja danych podąża za ciągiem zdarzeń
Zdarzenia onblur — tracimy ostrość
Możesz używać okienka informacyjnego do wyświetlania komunikatów o błędach
Weryfikacja pól w celu sprawdzenia, czy mamy coś więcej niż „nic”
Weryfikacja bez wkurzających okienek dialogowych
Subtelniejsze metody weryfikacji danych
Wielkość ma znaczenie…
Weryfikacja długości danych
Weryfikacja kodu pocztowego
Weryfikacja daty
Niezwykłe wyrażenia regularne
Wyrażenia regularne definiują poszukiwane wzorce
Metaznaki reprezentują więcej niż jeden znak
Tajniki wyrażeń regularnych — kwantyfikatory
Weryfikacja danych przy użyciu wyrażeń regularnych
Dopasowywanie określonej liczby powtórzeń
Eliminacja trzycyfrowego roku przy użyciu tego… lub tamtego…
Niczego nie zostawiajmy przypadkowi
Czy teraz mnie słyszysz? Weryfikacja numeru telefonu
Masz wiadomość — weryfikacja adresów e-mail
Wyjątek jest regułą
Dopasowywanie opcjonalnych znaków ze zbioru
Tworzenie funkcji weryfikującej adres e-mail
Rozdział 8. Krojenie i przyprawianie HTML-a przy użyciu DOM
Funkcjonalny, lecz niezgrabny — interfejs użytkownika ma znaczenie
Opisy scen bez okienek dialogowych
Dostęp do elementów HTML
Bliższe spotkanie z wewnętrznym HTML-em
Aby zobaczyć lasy i drzewa — obiektowy model dokumentu (DOM)
Twoja strona jest kolekcją węzłów DOM
Poruszanie się po drzewie DOM przy użyciu właściwości
Modyfikowanie węzła tekstowego przy wykorzystaniu DOM
Przygoda standaryzowana
Projektujemy większe i lepsze opcje
Rozważania nad zastępowaniem węzłów tekstowych
Funkcja zastępująca tekst w węźle
Dynamiczne opcje nawigacyjne to świetna rzecz
Interaktywne opcje decyzyjne są jeszcze lepsze
Kwestia stylu: CSS i DOM
Podmienianie stylów
Klasowe opcje
Test stylizowanych opcji decyzyjnych
Problemy z opcjami — pusty przycisk
Modyfikacja stylów wedle zamówienia
Żadnych niepotrzebnych opcji
Więcej opcji, większa złożoność
Śledzenie drzewa decyzyjnego
Przekształć historię swoich decyzji na kod HTML
Produkcja kodu HTML
Śledzenie przebiegu przygody
Rozdział 9. Obiekty jako Frankendane
JavaScriptowa impreza
Dane + akcje = obiekt
Obiekt jest właścicielem danych
W odwołaniach do składowych obiektów używamy kropki
Niestandardowe obiekty rozszerzają język JavaScript
Tworzenie własnego niestandardowego obiektu
Co jest w konstruktorze?
Powołujemy do życia obiekty blogu
Potrzeba sortowania
Obiekt daty w JavaScripcie
Wyliczanie czasu
Ponowna analiza zagadnienia dat w blogu
Obiekt w obiekcie
Konwersja obiektów na łańcuchy znaków
Pobieranie konkretnych informacji o dacie
Tablice jak obiekty
Sortowanie tablic wedle własnych potrzeb
Łatwiejsze sortowanie dzięki literałom funkcyjnym
Przeszukiwanie wpisów w blogu
Przeszukiwanie zawartości łańcucha znaków indexOf()
Przeszukiwanie tablicy blogu
Teraz działa także wyszukiwanie!
Obiekt Math jest obiektem organizacyjnym
Generowanie liczb losowych przy użyciu metody Math.random()
Zamiana funkcji na metodę
Przedstawiamy piękny nowy obiekt Blog
Jakie są korzyści użycia obiektów na stronie MagicznaKostka?
Rozdział 10. Zrób to po swojemu, używając własnych obiektów
Ponowna analiza metod obiektu Blog
Przeciążanie metod
Klasy i instancje
Instancje są tworzone na podstawie klasy
Słowo kluczowe this zapewnia dostęp do właściwości obiektów
Należą do jednej, działają we wszystkich — metody należące do klasy
Korzystaj z prototypu, by operować na poziomie klasy
Klasy, prototypy i MagicznaKostka
Także właściwości klasowe są współdzielone
Tworzenie właściwości klasowych przy użyciu prototypu
Podpisane i dostarczone
Metoda formatująca daty
Rozszerzanie standardowych obiektów
Zmodyfikowany obiekt daty = lepsza strona Reni
Klasa może mieć swoją własną metodę
Analiza funkcji porównującej wpisy
Wywoływanie metody klasowej
Jeden obraz jest wart tysiąca słów w blogu
Dodawanie obrazków do blogu
Dodawanie obrazków do strony MagicznaKostka
Obiektowa strona blogu
Rozdział 11. Dobre skrypty na złej drodze
Debugowanie w praktyce
Przypadek wadliwego kalkulatora IQ
Wypróbuj kod w różnych przeglądarkach
Proste sposoby usuwania błędów
Dzikie niezdefiniowane zmienne
Przetwarzając wartości IQ
Przypadek błędów w połączeniach z radiem
Otwieranie dochodzenia
Problem weryfikacji błędów składniowych (pluskwa nr 1)
Uwaga na te łańcuchy znaków
Cudzysłowy, apostrofy i konsekwencja
Kiedy apostrof nie jest apostrofem, użyj odwrotnego ukośnika
Nie tylko zmienne mogą być niezdefiniowane (pluskwa nr 2)
Każdy jest zwycięzcą (pluskwa nr 3)
Testowanie przy użyciu okienka dialogowego
Obserwowanie zmiennych przy użyciu okienek dialogowych
Zła logika może być przyczyną błędów
Nikt nie wygrywa! (pluskwa nr 4)
Przytłoczony ilością denerwujących okienek dialogowych
Tworzymy własną konsolę do testowania skryptów
Błędy najgorsze ze wszystkich: błędy czasu wykonywania programu
Bestiariusz JavaScriptu
Komentarze jako chwilowe wyłączniki kodu
Niebezpieczeństwa związane ze zmiennymi-cieniami
Rozdział 12. Szybkie i wrażliwe aplikacje internetowe
Pożądając dynamicznych danych
MagicznaKostka sterowana danymi
Ajax oznacza komunikację
XML — HTML na każdą okazję
XML + HTML = XHTML
XML i dane blogu Reni
Ajax wzmacnia stronę MagicznaKostka
XMLHttpRequest — JavaScript spieszy z pomocą
GET czy POST? Użycie obiektu XMLHttpRequest
Aby zrozumieć ajaksowe żądania
Interaktywne strony zaczynają się od obiektu żądania
Zawołaj mnie, kiedy skończysz
Obsługa żądania… bezproblemowa
DOM spieszy z pomocą
Teraz strona MagicznaKostka jest w pełni zależna od swoich danych
Niedziałające przyciski
Przyciski potrzebują danych
Usprawnienia oszczędzające czas blogera
Zapisywanie danych blogu
Także PHP ma swoje potrzeby
Przekazywanie danych do skryptu PHP
Do rzeczy — przesyłanie danych wpisu na serwer
Ułatwienie korzystania ze strony blogu
W ramach ułatwienia automatycznie wypełniaj pola formularzy
Wielokrotnie wykonywane zadanie? Może by tak jakaś funkcja pomogła?
Skorowidz