tytuł oryginału: pro javascript techniques, second edition · referencje oraz wartości ......

24

Upload: others

Post on 09-Aug-2020

1 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej
Page 2: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej

Tytuł oryginału: Pro JavaScript Techniques, Second Edition

Tłumaczenie: Rafał Szpoton

ISBN: 978-83-283-2086-4

Original edition copyright 2015 by John Resig, Russ Ferguson, and John Paxton.All rights reserved.

Polish edition copyright © 2016 by HELION SA.All rights reserved.

All rights reserved. No part of this book may be reproduced or transmitted in any form or by any means, electronic or mechanical, including photocopying, recording or by any information storage retrieval system, without permission from the Publisher.

Wszelkie prawa zastrzeżone. Nieautoryzowane rozpowszechnianie całości lub fragmentu niniejszej publikacji w jakiejkolwiek postaci jest zabronione. Wykonywanie kopii metodą kserograficzną, fotograficzną, a także kopiowanie książki na nośniku filmowym, magnetycznym lub innym powoduje naruszenie praw autorskich niniejszej publikacji.

Wszystkie znaki występujące w tekście są zastrzeżonymi znakami firmowymi bądź towarowymi ich właścicieli.

Autor oraz Wydawnictwo HELION dołożyli wszelkich starań, by zawarte w tej książce informacje były kompletne i rzetelne. Nie biorą jednak żadnej odpowiedzialności ani za ich wykorzystanie, ani za związane z tym ewentualne naruszenie praw patentowych lub autorskich. Autor oraz Wydawnictwo HELION nie ponoszą również żadnej odpowiedzialności za ewentualne szkody wynikłe z wykorzystania informacji zawartych w książce.

Wydawnictwo HELIONul. Kościuszki 1c, 44-100 GLIWICEtel. 32 231 22 19, 32 230 98 63e-mail: [email protected]: http://helion.pl (księgarnia internetowa, katalog książek)

Pliki z przykładami omawianymi w książce można znaleźć pod adresem: ftp://ftp.helion.pl/przyklady/ztejs2.zip

Drogi Czytelniku!Jeżeli chcesz ocenić tę książkę, zajrzyj pod adres http://helion.pl/user/opinie/ztejs2Możesz tam wpisać swoje uwagi, spostrzeżenia, recenzję.

Printed in Poland.

• Kup książkę• Poleć książkę • Oceń książkę

• Księgarnia internetowa• Lubię to! » Nasza społeczność

Page 3: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej

Spis tre ci

O autorach ...................................................................................................... 11

O recenzentach technicznych .......................................................................... 13

Podzi kowania ................................................................................................ 15

Rozdzia 1. Profesjonalne techniki w JavaScript ................................................................ 17Jak tu dotarliśmy? ....................................................................................................................... 18Współczesny JavaScript ............................................................................................................. 19

Rozkwit bibliotek ................................................................................................................. 20Więcej niż wzmianka o rozwiązaniach mobilnych ......................................................... 21Dokąd zmierzamy? .............................................................................................................. 22

Co nas czeka wkrótce? ............................................................................................................... 22Podsumowanie ............................................................................................................................ 23

Rozdzia 2. Funkcje, cechy i obiekty .................................................................................. 25Cechy języka ................................................................................................................................ 25

Referencje oraz wartości ..................................................................................................... 25Zakres .................................................................................................................................... 27Kontekst ................................................................................................................................ 29Domknięcia ........................................................................................................................... 30Przeciążenie funkcji oraz sprawdzanie typów ................................................................. 33

Nowe narzędzia obiektowe ....................................................................................................... 35Obiekty .................................................................................................................................. 35Modyfikacja obiektów ......................................................................................................... 36

Podsumowanie ............................................................................................................................ 38

Rozdzia 3. Tworzenie kodu do wielokrotnego u ytku ...................................................... 39Obiektowy JavaScript ................................................................................................................. 39

Dziedziczenie ........................................................................................................................ 43Widoczność składowych obiektu ...................................................................................... 47Przyszłość obiektowego JavaScript .................................................................................... 49

Poleć książkęKup książkę

Page 4: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej

SPIS TRE CI

6

Opakowanie kodu w JavaScript ................................................................................................ 49Przestrzenie nazw ................................................................................................................. 49Wzorzec modułowy ............................................................................................................. 50Wyrażenia funkcyjne wywoływane natychmiast ............................................................ 51

Podsumowanie ............................................................................................................................ 54

Rozdzia 4. Usuwanie b dów z kodu JavaScript ............................................................... 55Narzędzia testujące ..................................................................................................................... 55

Konsola .................................................................................................................................. 56Wykorzystanie funkcji konsoli .......................................................................................... 58

Debugger ...................................................................................................................................... 60Inspektor DOM .................................................................................................................... 60Analizator sieci ..................................................................................................................... 60Oś czasu ................................................................................................................................. 61Profiler ................................................................................................................................... 62

Podsumowanie ............................................................................................................................ 63

Rozdzia 5. Obiektowy model dokumentu ......................................................................... 65Wprowadzenie do obiektowego modelu dokumentu ........................................................... 65

Struktura DOM .................................................................................................................... 67Relacje w modelu DOM ...................................................................................................... 68

Dostęp do elementów DOM ..................................................................................................... 70Odnajdywanie elementów za pomocą selektora CSS ..................................................... 72

Oczekiwanie na wczytanie modelu DOM strony HTML ..................................................... 73Oczekiwanie na wczytanie strony ...................................................................................... 73Oczekiwanie na właściwe zdarzenie .................................................................................. 74

Pobieranie zawartości Elementu .............................................................................................. 74Pobieranie tekstu Elementu ................................................................................................ 74Pobieranie kodu HTML elementu .................................................................................... 76

Praca z atrybutami elementu .................................................................................................... 77Pobieranie i ustawianie wartości atrybutu ....................................................................... 77

Modyfikacja modelu DOM ....................................................................................................... 80Tworzenie węzłów za pomocą DOM ................................................................................ 80Wstawianie do drzewa DOM ............................................................................................. 81

Wstawianie HTML do drzewa DOM ...................................................................................... 82Usuwanie węzłów z drzewa DOM ..................................................................................... 83Obsługa znaków niewidocznych w DOM ........................................................................ 84Proste przeglądanie drzewa DOM ..................................................................................... 85

Podsumowanie ............................................................................................................................ 87

Rozdzia 6. Zdarzenia ........................................................................................................ 89Wprowadzenie do zdarzeń JavaScript ..................................................................................... 89

Stos, kolejka oraz pętla zdarzeń ......................................................................................... 90Fazy zdarzeń ......................................................................................................................... 90

Podłączanie procedur nasłuchu zdarzeń ................................................................................. 92Dowiązywanie tradycyjne ................................................................................................... 92Dowiązywanie DOM: rekomendacja W3C ...................................................................... 96Odwiązywanie zdarzeń ....................................................................................................... 97

Poleć książkęKup książkę

Page 5: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej

SPIS TRE CI

7

Wspólne cechy zdarzeń ............................................................................................................. 98Obiekt zdarzenia .................................................................................................................. 98Wyłączenie bąbelkowania zdarzeń .................................................................................... 98Zmiana domyślnych akcji przeglądarki ............................................................................ 99Delegacja zdarzeń .............................................................................................................. 101

Obiekt zdarzenia ....................................................................................................................... 102Właściwości ogólne ........................................................................................................... 102Właściwości związane z myszką ...................................................................................... 103Właściwości związane z klawiaturą ................................................................................. 104

Rodzaje zdarzeń ........................................................................................................................ 105Zdarzenia związane ze stroną ........................................................................................... 106Zdarzenia interfejsu użytkownika ................................................................................... 107Zdarzenia myszy ................................................................................................................ 107Zdarzenia klawiatury ......................................................................................................... 109Zdarzenia formularzy ........................................................................................................ 109Dostępność zdarzeń ........................................................................................................... 110

Podsumowanie .......................................................................................................................... 110

Rozdzia 7. JavaScript a walidacja formularzy ................................................................. 111Walidacja formularzy w HTML oraz CSS ............................................................................ 111

CSS ....................................................................................................................................... 113Walidacja formularzy za pomocą JavaScript ........................................................................ 114

Walidacja a użytkownicy .................................................................................................. 117Zdarzenia walidacji ............................................................................................................ 118

Dostosowywanie walidacji ...................................................................................................... 120Zapobieganie walidacji formularzy ................................................................................. 120

Podsumowanie .......................................................................................................................... 121

Rozdzia 8. Wprowadzenie do Ajaksa ............................................................................. 123Używanie Ajaksa ....................................................................................................................... 124

Żądania HTTP .................................................................................................................... 124Odpowiedź HTTP .............................................................................................................. 129

Podsumowanie .......................................................................................................................... 131

Rozdzia 9. Narz dzia do tworzenia aplikacji internetowych .......................................... 133Tworzenie rusztowania projektu ............................................................................................ 134NPM jest podstawą wszystkich narzędzi ............................................................................... 134Generatory ................................................................................................................................. 134

Kontrola wersji ................................................................................................................... 135Dodawanie plików, ich modyfikacje oraz pierwsze zatwierdzenie zmian ....................... 136

Podsumowanie .......................................................................................................................... 139

Rozdzia 10. AngularJS oraz testowanie ............................................................................ 141Widoki oraz kontrolery ........................................................................................................... 143Zdalne źródła danych ............................................................................................................... 145Trasy ........................................................................................................................................... 146Parametry tras ........................................................................................................................... 148Testowanie aplikacji ................................................................................................................. 149

Poleć książkęKup książkę

Page 6: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej

SPIS TRE CI

8

Testy jednostkowe .............................................................................................................. 150Dodawanie nowych testów ............................................................................................... 151Testowanie żądań HTTP za pomocą $httpBackend ..................................................... 152Testowanie integracyjne z Protractorem ........................................................................ 153

Podsumowanie .......................................................................................................................... 156

Rozdzia 11. Przysz o JavaScript ..................................................................................... 157Teraźniejszość i przyszłość ECMAScript .............................................................................. 158Użycie ECMAScript Harmony ............................................................................................... 158

Zasoby Harmony ............................................................................................................... 159Używanie Harmony ........................................................................................................... 159

Funkcje języka ECMAScript Harmony ................................................................................. 163Funkcje strzałkowe ............................................................................................................ 164Klasy ..................................................................................................................................... 166Obietnice ............................................................................................................................. 166Moduły ................................................................................................................................ 168Rozszerzenia typów ........................................................................................................... 170Nowe typy kolekcji ............................................................................................................ 173

Podsumowanie .......................................................................................................................... 175

Dodatek A Dokumentacja DOM ...................................................................................... 177Zasoby ........................................................................................................................................ 177Terminologia ............................................................................................................................. 177Zmienne globalne ..................................................................................................................... 179

document ............................................................................................................................ 179HTMLElement ................................................................................................................... 179

Nawigacja DOM ....................................................................................................................... 180body ..................................................................................................................................... 180childNodes .......................................................................................................................... 180documentElement .............................................................................................................. 181firstChild ............................................................................................................................. 181getElementById( elementID ) .......................................................................................... 181getElementsByTagName( nazwaZnacznika ) ................................................................ 181lastChild .............................................................................................................................. 182nextSibling .......................................................................................................................... 182parentNode ......................................................................................................................... 183previousSibling ................................................................................................................... 183

Informacje o węźle ................................................................................................................... 183innerText ............................................................................................................................. 183nodeName ........................................................................................................................... 184nodeType ............................................................................................................................. 184nodeValue ........................................................................................................................... 185

Attributes ................................................................................................................................... 185className ............................................................................................................................ 185getAttribute( nazwaAtrybutu ) ........................................................................................ 186

Poleć książkęKup książkę

Page 7: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej

SPIS TRE CI

9

removeAttribute( nazwaAtrybutu ) ................................................................................ 186setAttribute( nazwaAtrybutu, wartośćAtrybutu ) ......................................................... 187

Modyfikacje modelu DOM ..................................................................................................... 187appendChild( węzełDoDodania ) .................................................................................... 187cloneNode( true|false ) ...................................................................................................... 188createElement( nazwaWęzła ) .......................................................................................... 188createElementNS( przestrzeńNazw, nazwaZnacznika ) ............................................... 188createTextNode( łańcuchZnakowy ) ............................................................................... 189innerHTML ........................................................................................................................ 189insertBefore( węzełDoWstawienia, węzełPrzedKtórymWstawić ) ............................. 190removeChild( węzełDoUsunięcia ) ................................................................................. 190replaceChild( węzełDoWstawienia, węzełDoZastąpienia ) ......................................... 190

Skorowidz .................................................................................................... 193

Poleć książkęKup książkę

Page 8: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej

SPIS TRE CI

10

Poleć książkęKup książkę

Page 9: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej

R O Z D Z I A 1

Profesjonalne technikiw JavaScript

Zapraszamy do lektury książki pt. Zaawansowane techniki języka JavaScript. Wydanie II. Zawiera onaprzegląd obecnego stanu technologii języka JavaScript do wykorzystania przez zawodowych programistów.A kim jest zawodowy programista? Jest nim ktoś, kto dobrze rozumie podstawy języka JavaScript(a także prawdopodobnie kilku innych języków) oraz jest zainteresowany jego wszechstronnością.Chciałby poznać dokładniej Obiektowy Model Dokumentu DOM (ang. Document Object Model),a także zapoznać się z tym całym zamieszaniem wokół dyskusji na temat wzorca Model-Widok-Kontroler(ang. Model-View-Controller, MVC) po stronie klienta. W książce tej znajdzie również uaktualnioneinformacje na temat interfejsów API, nowe funkcjonalności, a także kreatywne zastosowaniazaprezentowanego kodu.

To już drugie wydanie tej książki. Od czasu jej pierwszego wydania w 2006 r. wiele rzeczy uległozmianie. W tamtym czasie język JavaScript przechodził nieco bolesną metamorfozę od nieprofesjonalnegojęzyka skryptowego używanego dla zabawy do postaci wydajnej i przydatnej do wielu różnych zadań.W sumie możesz ten etap uznać za wiek dojrzewania tego języka. Obecnie język JavaScript znajduje siępodczas kolejnej transformacji, a używając naszej metafory, przechodzi od wieku dojrzewania dodojrzałości. Zastosowanie języka JavaScript jest niemalże powszechne. Na swojej głównej stronie używago (w zależności od statystyk) od 85 do 95 procent stron internetowych. Wielu ludzi uznaje językJavaScript za najbardziej popularny na świecie język programowania (biorąc pod uwagę liczbę osób,które używają go regularnie). Jednak zdecydowanie bardziej istotne od wskaźników użycia są jegoefektywność oraz możliwości.

JavaScript przebył drogę od języka służącego do celów zabawowych (przewijanie obrazków, modyfikacjatekstu na pasku stanu), poprzez etap efektywnego, jednak ograniczonego narzędzia (przypomnij sobiewalidację formularzy po stronie klienta), aż do swojej obecnej postaci jako powszechnie wykorzystywanegojęzyka programowania nieograniczonego już dłużej ciasnymi granicami. Używając JavaScriptu,programiści tworzą narzędzia udostępniające funkcjonalności wzorca MVC, co przez długi czas byłodomeną oprogramowania po stronie serwera. Tworzą również złożone wizualizacje danych, bibliotekiszablonów itp. Lista zastosowań zwiększa się cały czas. Aby udostępnić w pełni funkcjonalne bogateinterfejsy, które korzystają z danych po stronie serwera, programiści musieli dawniej polegać na języku.Net lub też klientach napisanych w Java Swing, a obecnie można to samo osiągnąć, korzystając z językaJavaScript w przeglądarce. Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnejdziałającej w JavaScript, w której można uruchomić wiele różnych aplikacji napisanych w tym językui żadna z nich nie będzie wymagać do działania przeglądarki.

W tym rozdziale opiszemy zarówno drogę, która doprowadziła nas do obecnego etapu w rozwojutego języka, jak i to, dokąd on zmierza. Poznamy wiele różnych usprawnień wprowadzonych do technologiiprzeglądarek (a także przyczyny ich popularności), które mają wpływ na rewolucję w języku JavaScript.

Poleć książkęKup książkę

Page 10: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej

ZAAWANSOWANE TECHNIKI J ZYKA JAVASCRIPT

18

Konieczne będzie również przyjrzenie się samemu stanowi tego języka, ponieważ zanim spojrzymyw przyszłość, chcielibyśmy wiedzieć, gdzie znajdujemy się obecnie. W kolejnych rozdziałach dowiemysię, czego potrzebuje zawodowy programista JavaScript, aby móc w pełni używać swojego tytułu.

Jak tu dotarli my?Gdy powstawało pierwsze wydanie tej książki, przeglądarki Google Chrome oraz Mozilla Firefox byłyjeszcze stosunkowo młode. Wśród przeglądarek panowały niepodzielnie Internet Explorer 6 orazInternet Explorer 7, a jego wersja 8 dopiero zaczynała zdobywać pewną popularność. Na szybki rozwójprogramowania w JavaScript wpływ miało kilka czynników.

Od momentu swego powstania JavaScript był zależny od przeglądarki. To właśnie przeglądarka byłaśrodowiskiem uruchomieniowym dla programów w tym języku, a dostęp programisty do funkcjonalnościJavaScriptu był ściśle uzależniony od rodzaju oraz wersji przeglądarki używanej do wyświetleniatworzonej przez niego strony. Wojna przeglądarek — zapoczątkowana w latach dziewięćdziesiątychubiegłego wieku i ciągnąca się aż do połowy pierwszej dekady XXI wieku — została w łatwy sposóbwygrana przez Internet Explorera, co spowodowało zastój w rozwoju innych przeglądarek. Jedynie dwiez nich potrafiły utrzymać się na rynku, a mianowicie: Mozilla Firefox oraz Google Chrome. Pierwszaz nich była potomkiem Netscape’a, który był jedną z najwcześniejszych przeglądarek internetowych.Chrome miał za to wsparcie firmy Google, co wystarczyło mu do błyskawicznego zaistnienia na scenie.

Najważniejsze jednak było to, że obie te przeglądarki zawierały kilka decyzji projektowychułatwiających rozwój języka JavaScipt. Pierwszą z nich była decyzja o wsparciu implementacji różnychstandardów zalecanych przez konsorcjum World Wide Web (W3C). Niezależnie od tego, czy mieliśmydo czynienia z modelem DOM, obsługą zdarzeń czy Ajaksem, zarówno Chrome, jak i Firefox w dużymstopniu uwzględniały specyfikację W3C oraz starały się implementować ją najlepiej, jak to było możliwe.Dla programistów oznaczało to, że nie musieli tworzyć oddzielnego kodu dla Firefoxa i oddzielnegodla Chrome’a. Już wcześniej przywykliśmy do tworzenia oddzielnego kodu dla IE oraz oddzielnegodla wszystkich innych przeglądarek, co sprawiało, że rozgałęzianie kodu nie było samo w sobie niczymnowym. Jednak to, że nie musiało być ono zbyt złożone, zdecydowanie ułatwiało pracę.

Twórcy zarówno Firefoksa, jak i Chrome’a przyczynili się w dużym stopniu do rozwojuEuropejskiego Stowarzyszenia Wytwórców Komputerów (European Computer ManufacturerAssociation, w skrócie ECMA1). ECMA jest ciałem standaryzującym, które nadzoruje rozwój językaJavaScript (będąc skrupulatnym, należy wspomnieć, że ECMA nadzoruje język ECMAScript, ponieważJavaScript jest znakiem handlowym firmy Oracle i… no cóż, tak naprawdę nie przejmujemy się takimiszczegółami, nieprawdaż? Dlatego w momencie odwoływania się do języka będziemy używać określeniaJavaScript, zaś ECMAScript będzie używany do odwoływania się do specyfikacji, którą spełnia JavaScript).Wcześniej rozwój standardu ECMAScript popadł w marazm, podobnie jak miało to miejsce z rozwojemprzeglądarki IE. Gdy rozpoczęła się prawdziwa rywalizacja przeglądarek, zaczęto również ponownie rozwijaćstandard ECMAScript. Wersja piąta tego standardu (z roku 2009) zatwierdzała wiele zmian, które powstaływ ciągu dziesięciu poprzednich lat (!), czyli od czasu opublikowania poprzedniej wersji standardu. Samagrupa również nabrała sił, czego efektem było powstanie wersji 5.1 już w roku 2011. Zabezpieczonazostała również przyszłość standardu, ponieważ trwają już zaawansowane prace nad wersjami 6 oraz 7.

Twórcy Chrome’a również przyczynili się do uaktualnienia JavaScriptu. Silnik tego języka o nazwieV8 używany przez przeglądarkę Chrome stanowił istotną część debiutu tej przeglądarki w roku 2008.Zespół pracujący nad przeglądarką stworzył silnik zdecydowanie szybszy od większości innych silnikówjęzyka JavaScript i postanowił utrzymać się na szczycie rankingu również w przypadku kolejnych wersji.Okazało się wkrótce, że silnik V8 był tak imponujący, że stał się podstawą narzędzia Node.js, którejest interpreterem języka JavaScript niezależnym od przeglądarki. Początkowo Node.js zaprojektowany

1 Obecnie European Association for Standardizing Information and Communication Systems — przyp. tłum.

Poleć książkęKup książkę

Page 11: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej

ROZDZIA 1. PROFESJONALNE TECHNIKI W JAVASCRIPT

19

był jako serwer, który miał używać JavaScriptu jako swojego podstawowego języka aplikacji. Stał sięjednak uniwersalną platformą do uruchamiania wielu aplikacji stworzonych w JavaScripcie.

Google Chrome wprowadził również inną dużą innowację do świata przeglądarek. Był to pomysłwiecznie aktualnej aplikacji. Zamiast zmuszać użytkownika do pobierania oddzielnego instalatoraprzeglądarki w celu jej uaktualnienia, Chrome domyślnie uaktualnia się sam w sposób zupełnieautomatyczny. Chociaż takie podejście może sprawiać niekiedy problemy w świecie korporacji, to dlaniezawodowego użytkownika przeglądarki stanowi prawdziwe dobrodziejstwo. Przeglądarka Chrome(a w ostatnich latach również Firefox) nadal uaktualnia się sama bez żadnego wysiłku ze strony użytkownika.Chociaż podobne podejście w przypadku uaktualnień Windows Update stosowała już od dłuższegoczasu również firma Microsoft, to jednak nie wprowadzała w ten sposób żadnych nowych funkcjonalnościprzeglądarki Internet Explorer (chyba że było to związane z opublikowaniem nowej wersji systemu Windows).Inaczej mówiąc, uaktualnienia do przeglądarki IE nie pojawiają się zbyt często. To Chrome wraz z Firefoksemzawsze miały najnowsze i najlepsze funkcjonalności, a także były całkiem dobrze zabezpieczone.

Gdy firma Google zaczęła wprowadzać coraz więcej nowych funkcjonalności Chrome’a, twórcyinnych przeglądarek też nie próżnowali. Niekiedy wynikały z tego zabawne sytuacje, np. wtedy gdyFirefox przyjął sposób numeracji używany przez Chrome’a. Firmy Mozilla oraz Microsoft przyjrzały siędokładnie silnikom języka JavaScript i stwierdziły, że choć przewaga Chrome’a wciąż jeszcze robiwrażenie, to jednak nie jest on nie do pokonania.

Ostatecznie firma Microsoft (w większości) porzuciła swoją filozofię „obejmij i rozszerz”, przynajmniejw zakresie języka JavaScript. Równocześnie z wersją 9 przeglądarki IE także Microsoft zaimplementowałobsługę zdarzeń rekomendowaną przez konsorcjum World Wide Web (W3C), a także ustandaryzowałswoje interfejsy DOM i API Ajaksa. W przypadku większości standardowych funkcjonalności językaJavaScript nie ma już konieczności implementacji dwóch wersji tego samego kodu (pewnym problememjest jeszcze tylko utrzymywanie starego kodu dla starych przeglądarek).

Wszystko to razem wygląda prawie na cudowne panaceum. JavaScript jest szybszy niż kiedykolwiekwcześniej. Zdecydowanie łatwiej jest tworzyć kod dla szeregu różnych przeglądarek. Dokumentystandaryzujące zarówno opisują rzeczywisty stan rzeczy, jak i wskazują wygodną drogę do kolejnychprzyszłych funkcjonalności. Większość naszych przeglądarek jest w pełni aktualnych. Czym więcmusimy się teraz martwić i dokąd będziemy zmierzać w przyszłości?

Wspó czesny JavaScriptNigdy jeszcze tworzenie poważnych aplikacji za pomocą JavaScriptu nie było takie proste jak obecnie.Teraz można już zapomnieć o złych starych czasach, kiedy to konieczne było tworzenie oddzielnegokodu dla różnych przeglądarek, gdy w słaby sposób zaimplementowane były słabe standardy, a silnikiJavaScript nie potrafiły szybko pracować. Przyjrzyjmy się obecnemu stanowi nowoczesnych środowiskJavaScript. W szczególności popatrzmy na dwa obszary: na nowoczesne przeglądarki oraz nowoczesnezestawy narzędzi.

Nowoczesny JavaScript opiera się na pomyśle nowoczesnej przeglądarki. Czym jest więc nowoczesnaprzeglądarka? Różne organizacje opisują to na różne sposoby. Google twierdzi, że jego aplikacje wspieranesą przez obecne oraz poprzednie główne wersje przeglądarek (wiele wskazuje na to, że Gmail wciążdziała na IE9). Osoby reprezentujące firmę tworzącą stronę BBC (British Broadcasting Company)ujawniły w bardzo ciekawym artykule, że definiują następujące funkcjonalności reprezentującenowoczesną przeglądarkę:

1. document.querySelector() / document.querySelectorAll() 2. window.addEventListener() 3. API dla składowania danych (localStorage and sessionStorage)

Poleć książkęKup książkę

Page 12: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej

ZAAWANSOWANE TECHNIKI J ZYKA JAVASCRIPT

20

Najpopularniejszą biblioteką JavaScript w sieci jest biblioteka jQuery, która rozróżnia dwie wersjerozwojowe: serię 1.x wspierającą przeglądarki IE 6 oraz późniejsze oraz serię 2.x wspierającą „nowoczesne”przeglądarki takie jak IE 9 oraz wersje późniejsze. Niech Cię nie zmyli, drogi czytelniku, że IE jest granicąpomiędzy nowoczesnością a przeszłością. Pozostałe dwie główne linie przeglądarek są zawsze aktualne.Wprawdzie Safari oraz Opera nie mają aż tak dużego udziału w rynku co IE i nie są uaktualniane nabieżąco, ale jednak dzieje się to częściej niż w przypadku IE.

Gdzie więc leży granica oddzielająca nowoczesne przeglądarki od starszych typów? Płynna granicamiędzy nimi wydaje się znajdować pomiędzy dziewiątą a jedenastą wersją Internet Explorera. InternetExplorer w wersji 9 jest zdecydowanie przeglądarką starego typu. Nie wspiera on większości nowychfunkcjonalności ECMAScript 5. Nie dysponuje również API do obsługi zdarzeń zgodnej z zaleceniamiW3C. Ta lista może stale się wydłużać. Podczas omawiania nowoczesnych przeglądarek będziemy więcodwoływać się do Internet Explorera przynajmniej w wersji 9 i nie będziemy starać się wspierać starszychprzeglądarek. Wszędzie tam, gdzie będzie to istotne i proste, postaramy się wskazać adaptację dla starszychwersji IE, jednak w ogólnym założeniu naszą granicą w tym zakresie będzie Internet Explorer 9.

Rozkwit bibliotekOprócz tematu nowoczesnych przeglądarek jest jeszcze jeden ważny aspekt obecnego środowiskadla języka JavaScript, o którym musimy wspomnieć: biblioteki. W ciągu ostatnich ośmiu lat nastąpiłaeksplozja bibliotek JavaScript pod względem ich liczby oraz różnorodności. Na serwerze GitHub istniejeponad 800 000 repozytoriów dla JavaScriptu. Spośród nich prawie 900 dysponuje tysiącem gwiazdek.Od czasu swoich skromnych początków jako zbioru funkcji narzędziowych ekosystem bibliotekJavaScript bardzo (choć nieco chaotycznie) się rozwinął.

W jaki sposób wpływa to na programistów JavaScriptu? Istnieje oczywiście model „bibliotekiw charakterze rozszerzenia”, w którym biblioteka udostępnia dodatkowe funkcjonalności. Są bibliotekiMVC w rodzaju Backbone lub Angular (któremu przyjrzymy się w kolejnym rozdziale), biblioteki dowizualizacji danych jak d3 oraz Highcharts. Biblioteki JavaScriptu mogą również udostępniać pewieninterfejs do funkcjonalności, które w niektórych przeglądarkach są standardowe, a w innych w ogólenie występują.

Przez długi czas standardowym przykładem inaczej zaimplementowanej funkcjonalności JavaScriptubyła obsługa zdarzeń. Internet Explorer dysponuje własnym API do obsługi zdarzeń. Inne przeglądarkizazwyczaj podążały za API rekomendowanym przez W3C. Wiele bibliotek udostępniało ujednoliconeimplementacje obsługi zdarzeń, które łączyły najlepsze cechy z obu światów. Niektóre z nich się nierozwinęły, jednak te najbardziej popularne ujednoliciły funkcjonalność dla Ajaksa, modelu DOMoraz szeregu innych cech, które były w odmienny sposób zaimplementowane w różnych przeglądarkach.

Do najbardziej popularnych należała biblioteka jQuery. Od czasu swojego powstania biblioteka tabyła słusznym wyborem w przypadku korzystania z nowych funkcjonalności JavaScriptu, gdyż nie trzebabyło się martwić o to, czy będą one wspierane przez przeglądarkę. Dlatego zamiast używać obsługi zdarzeńw stylu IE lub W3C, można było skorzystać po prostu z funkcji jQuery .on(), która obsługiwała różnice,udostępniając ujednolicony interfejs. Kilka innych bibliotek również udostępniało podobną funkcjonalność.Wspomnieć należy o Dojo, Ext JS, Prototype, YUI, MooTools i wielu innych. Celem tych biblioteknarzędziowych było ujednolicenie API dla programistów.

Standaryzacja wykroczyła nawet poza udostępnianie prostego kodu działającego na różnych platformach.Wspomniane biblioteki bardzo często ukrywały nawet błędnie działające implementacje. Oficjalne APIdla funkcji pomiędzy różnymi wersjami przeglądarki może nawet się nie zmienić w dużym stopniu, alexi tak zawsze będą występować w nim błędy. Niekiedy błędy te zostaną naprawione, innym razem nie,a niekiedy poprawki spowodują wprowadzenie nowych błędów. Wszędzie tam, gdzie możliwe byłonaprawienie lub obejście tych błędów, biblioteki robiły to. Na przykład biblioteka jQuery 1.11 zawieraponad pół tuzina poprawek dla problemów z API obsługi zdarzeń.

Niektóre biblioteki (w szczególności jQuery) udostępniały również nowe lub inne implementacjepewnych właściwości. Na przykład funkcja selektora jQuery (tworząca rdzeń biblioteki) wyprzedzała

Poleć książkęKup książkę

Page 13: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej

ROZDZIA 1. PROFESJONALNE TECHNIKI W JAVASCRIPT

21

będące obecnie standardem funkcje querySelector() oraz querySelectorAll(). Stanowiła równieżpowód dołączenia tych funkcji do języka JavaScript. Inne biblioteki udostępniały różne funkcjonalnościpomimo ich bardzo różnych implementacji. W dalszej części tej książki przyjrzymy się nowemu protokołowiAjaksa o nazwie CORS (Cross Origin Resource Sharing). Pozwala on Ajaksowi wysyłać żądania doinnych serwerów niż te, z których obsługiwana była strona. Niektóre biblioteki zaimplementowały jużtaką funkcjonalność, jednak wszędzie tam, gdzie było to konieczne, korzystały z protokołu JSON-P.

Z powodu swojej przydatności niektóre biblioteki stały się częścią składową standardowego zestawunarzędzi zawodowego programisty JavaScript. Ich funkcje nie muszą być jeszcze ustandaryzowanew JavaScripcie, stanowią jednak zbiór wiedzy oraz funkcjonalności, które w prosty sposób ułatwiają szybkąrealizację niektórych wzorców. Okazało się, że jQuery (lub inna podobna biblioteka) jest właściwieniezbędna do stworzenia nowoczesnej przeglądarki, dzięki czemu w ubiegłych latach można było zwiększyćpopularność swojego bloga. Wróćmy do wymagań BBC — z pewnością można by było zrealizować dużączęść funkcjonalności udostępnianej przez jQuery, gdyby dostępne były trzy wymienione wtedy metody.Biblioteka jQuery oferuje również uproszczony (ale wciąż jeszcze rozszerzony) interfejs DOM, poprawiającbłędy dla wielu różnego rodzaju przypadków brzegowych. Jeżeli potrzebujesz wsparcia przeglądarki IE8 lubwcześniejszej, jQuery będzie Twoim podstawowym wyborem. Jednocześnie zawodowy programistaJavaScript musi przyjrzeć się wymaganiom projektu i zastanowić się, czy podejmie ryzyko odkrywaniaponownie czegoś, co już udostępnia jQuery (lub podobna biblioteka).

Wi cej ni wzmianka o rozwi zaniach mobilnychW starszych książkach na temat JavaScriptu lub programowania stron internetowych ujrzałbyśprawdopodobnie sekcję, a być może i cały rozdział dotyczący postępowania w przypadku przeglądaniastron w trybie mobilnym. Udostępnianie stron w tym trybie stanowiło jedynie mały fragment całkowitegoprzeglądania sieci. Rynek był tak podzielony, że wydawało się, iż jedynie specjaliści mogliby byćzainteresowani tworzeniem rozwiązań mobilnych. Nie jest to już na szczęście prawdą. Od czasu pierwszegowydania tej książki rynek usług mobilnych eksplodował. Różni się on też zdecydowanie od programowaniana komputery stacjonarne. Rozważmy pewne statystyki: według wielu różnych źródeł przeglądanie stronz urządzeń mobilnych stanowi 20 – 30 procent wszystkich odwołań. Gdy będziesz, drogi Czytelniku,czytać te słowa, zapewne procent ten już się zwiększy, ponieważ od czasu debiutu iPhone’a ten udziałulega stałemu zwiększeniu. Znacznie ponad 40 procent odwołań do stron z urządzeń mobilnychpochodzi z przeglądarki Safari pod systemem iOS, chociaż przeglądarka Androida oraz Chrome dla tegosystemu również umacniają swoją pozycję (i w zależności od tego, jakim danym statystycznym wierzysz,mogły już nawet przegonić Safari). Przeglądarka Safari w systemie iOS nie jest tym samym, co Safari nakomputerze stacjonarnym i taka sama różnica występuje pomiędzy przeglądarkami Chrome orazFirefox na urządzeniach mobilnych i stacjonarnych. Urządzenia mobilne dominują.

Przeglądarki na urządzenia mobilne wyznaczają zupełnie nowy zestaw wyzwań oraz możliwości.Urządzenia mobilne są często o wiele bardziej ograniczone niż stacjonarne (chociaż jest to kolejnaróżnica, która w szybkim tempie maleje). Z drugiej strony urządzenia mobilne oferują nowefunkcjonalności (zdarzenia przeciągnięcia, bardziej dokładne dane geolokacyjne itp.) oraz nowe sposobyinterakcji (wykorzystanie dłoni zamiast myszki, przeciąganie w celu przewinięcia stron). W zależnościod wymagań w stosunku do programu możesz utworzyć aplikację wyglądającą równie dobrze naurządzeniu mobilnym, co na stacjonarnym lub też zaimplementować ponownie istniejący zakresfunkcjonalności na platformie mobilnej.

Scena języka JavaScript w ciągu ostatnich lat uległa zdecydowanej zmianie. Poza pewnymielementami standaryzacji API powstało wiele nowych wyzwań. W jaki sposób to wszystko możedotykać nas, czyli zawodowych programistów JavaScript?

Poleć książkęKup książkę

Page 14: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej

ZAAWANSOWANE TECHNIKI J ZYKA JAVASCRIPT

22

Dok d zmierzamy?Powinniśmy ustanowić dla siebie samych pewne standardy. Jednym z nich jest to, że IE 9 to dolnagranica dla nowoczesnych przeglądarek. Inne przeglądarki są zawsze aktualne i nie musimy się o nicmartwić. A co w takim razie z przeglądarkami mobilnymi? No cóż, jest to bardziej złożone zagadnienie.Uogólniając, minimalne wersje to systemy iOS 6 oraz Android 4.1 (Jelly Bean). Wersje mobilnezazwyczaj są uaktualniane szybciej i częściej niż ich odpowiedniki stacjonarne, dlatego też możemyużywać nowszych wersji mobilnych systemów operacyjnych z większym przekonaniem.

Zboczmy na chwilę z tematu, pomińmy dyskusję o wersjach przeglądarek, systemów operacyjnychlub platform i skoncentrujmy się na użytkownikach. Przytaczanie statystyk może trwać nawet całydzień, jednak te wartościowe mówią coś ważnego o Twoich użytkownikach, a nie o wszystkichużytkownikach ogólnie. Być może tworzysz aplikację dla swojego pracodawcy, który używa standarduIE 10. A może Twój pomysł na aplikację zależy zdecydowanie od funkcjonalności oferowanych jedyniew przeglądarce Chrome. Może nawet nie powstanie wersja na komputery stacjonarne, gdyż zamierzaszużywać jedynie tabletów z systemem Android lub iPadów. Zastanów się nad użytkownikamidocelowymi. Ta książka jest napisana w taki sposób, aby miała dość szerokie zastosowanie. To samomoże dotyczyć aplikacji. Nierozsądne więc wydaje się tracenie czasu na zastanawianie się nad błędamiw IE 9, jeśli chodzi o aplikacje tylko na tablety. Wróćmy teraz do naszych standardów.

W przypadku zrzutów ekranów lub testów w książce będziemy zazwyczaj korzystać z przeglądarkiGoogle Chrome. Jeśli zaistnieje taka potrzeba, będziemy demonstrować kod w przeglądarce Firefoxlub Internet Explorer. Chrome jest złotym standardem dla programistów z powodu serwowanych iminformacji, jest też przyjazny dla użytkowników. W kolejnym rozdziale poznamy wiele dostępnychnarzędzi programistycznych oferowanych nie tylko przez Chrome’a, ale także przez Firefoxa (z wtyczkąFirebug lub bez niej) oraz IE.

Jako standardowej biblioteki będziemy używać jQuery. Oczywiście istnieje wiele innych bibliotek,lecz jQuery zwycięża z dwóch powodów. Po pierwsze, jest najpopularniejszą biblioteką JavaScriptogólnego przeznaczenia dostępną w sieci. Po drugie, jeden z autorów tej książki (John Resig) zna dobrzebibliotekę jQuery, co spowodowało, że drugi autor (John Paxton) dał za wygraną. Przygotowując drugąwersję tej książki, wiele technik z poprzedniego wydania zastąpiliśmy funkcjonalnością dostępnąw bibliotece jQuery. W takich przykładach dość niechętnie odkrywamy koło na nowo. W razie potrzebyodwołamy się do odpowiedniej funkcjonalności jQuery. Będziemy oczywiście omawiać także nowe,ekscytujące techniki.

W ciągu ostatnich kilku lat IDE JavaScriptu znacząco się poprawiło, głównie dzięki rozwojowijęzyka. Lista wszystkich możliwości jest zbyt liczna, aby je wszystkie wymieniać w tym miejscu, jeżelijednak mielibyśmy wymieniać kilka znaczących aplikacji, to John Resig używa w swoim środowiskuprogramistycznym bardzo zindywidualizowanej wersji edytora vim. John Paxton jest nieco bardziejleniwy i postanowił używać w charakterze swojego IDE doskonałego edytora WebStorm firmy JetBrains(http://www.jetbrains.com/webstorm). Firma Adobe oferuje jako bezpłatne oprogramowanie opensource edytora Brackets (http://brackets.io/), mającego obecnie wersję 1.3. Dostępna jest również wersjaedytora Eclipse. Wiele osób z kolei bardzo pozytywnie ocenia dostosowanie do swoich potrzeb edytorówSublimeText lub Emacs. Ty natomiast używaj tego, z czym czujesz się najswobodniej.

Istnieją również inne narzędzia, które mogą wspomagać programowanie w języku JavaScript.Poznamy je w jednym z dalszych rozdziałów. Oznacza to, że nadszedł dobry czas na zaprezentowanietego, co nas będzie czekać w dalszej części książki.

Co nas czeka wkrótce?Począwszy od rozdziału 2., rozpoczniemy naszą przygodę z najnowszą i najlepszą wersją języka JavaScript.Będziemy analizować nowe funkcjonalności dostępne dzięki typowi Object. Zbadamy też ponownie niektórestare pomysły, takie jak referencje, funkcje, zakres oraz domknięcia. Zgrupujemy to wszystko pod nazwąFunkcji, Cech oraz Obiektów, jednak rozdział ten będzie zawierać znacznie więcej informacji.

Poleć książkęKup książkę

Page 15: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej

ROZDZIA 1. PROFESJONALNE TECHNIKI W JAVASCRIPT

23

W rozdziale 3. omówimy tworzenie kodu do wielokrotnego użytku. W rozdziale 2. prześlizgniemysię jedynie po jednej z większych nowych cech języka JavaScript, jaką jest metoda Object.create(),poznamy także jej wpływ na obiektowy kod JavaScript. Dopiero więc w rozdziale trzecim poznamydokładniej metodę Object.cresate(), funkcjonalne konstruktory, prototypy oraz zagadnieniaobiektowe zaimplementowane w JavaScript.

Po poświęceniu dwóch rozdziałów na omówienie kodu czas zacząć myśleć, w jaki sposób nim zarządzać.W rozdziale 4. przedstawimy narzędzia do testowania kodu w JavaScript. Zaczniemy od sprawdzeniaprzeglądarek oraz ich narzędzi programistycznych.

Rozdział 5. rozpoczniemy od omówienia obszarów funkcjonalności JavaScript o wysokim stopniuużycia. Przyjrzymy się wtedy również modelowi obiektowemu dokumentu DOM. Od ostatniej wersjiAPI DOM zdecydowanie stało się dużo bardziej złożone, co utrudnia jego zastosowanie. Istnieje jednakkilka nowych jego cech, które powinniśmy poznać.

W rozdziale 6. postaramy się opanować zdarzenia (Events), które zostały poddane standaryzacjizgodnie z zaleceniami konsorcjum W3C. Pozwoli to nam na ostateczne odejście od bibliotek narzędziowychi zagłębienie się w API zdarzeń bez troszczenia się o duże różnice pomiędzy przeglądarkami.

Jednym z pierwszych (innych niż rozrywkowe) zastosowań JavaScript była walidacja formularzypo stronie klienta. Twórcom przeglądarek zajęło ponad dekadę, aby zdecydować się na dodaniefunkcjonalności służącej do walidacji formularzy poza prostym przechwytywaniem zdarzenia submit.W rozdziale 7. pt. JavaScript a walidacja formularzy odkryjemy, że istnieje całkiem nowy zestawfunkcjonalności, służących do walidacji formularzy, udostępniany zarówno przez język HTML,jak i JavaScript.

Każdy, kto zajmował się programowaniem w języku JavaScript, musiał poświęcić nieco czasu naWprowadzenie do Ajaksa. Od czasu wprowadzenia protokołu CORS funkcjonalność protokołu Ajaxprzezwyciężyła ostatecznie najgłupsze ze swoich ograniczeń.

W rozdziale pt. Narzędzia do tworzenia stron internetowych zostały opisane narzędzia(takie jak Yeoman, Bower, Git lub Grunt), które są wywoływane z wiersza poleceń. Narzędziate pokażą nam, w jaki sposób można szybko dodać potrzebne pliki oraz katalogi. Dzięki temumożemy skoncentrować się na programowaniu.

W rozdziale 10. omówimy AngularJS oraz testowanie. Korzystając z wiedzy nabytej w poprzednimrozdziale, dowiemy się, co sprawia, że Angular działa, a także w jaki sposób można zaimplementowaćzarówno testy jednostkowe, jak i całościowe.

W rozdziale 11. omówimy Przyszłość języka JavaScript. Do czasu wydania tej książki zostanie jużmniej więcej ustanowiony standard ECMAScript w wersji 6. ECMAScript w wersji 7 wciąż aktywnie sięrozwija. Po przedstawieniu planów rozwoju JavaScriptu zajmiemy się głównie tymi funkcjonalnościami,których można używać obecnie.

PodsumowanieDużą część tego rozdziału poświęciliśmy omawianiu otoczenia JavaScriptu: platformom, historii, IDEitp. Wierzymy, że historia determinuje teraźniejszość. Próbowaliśmy wyjaśnić, gdzie byliśmy przedtemi jak dostaliśmy się tu, gdzie jesteśmy teraz, aby pomóc Ci zrozumieć, gdzie obecnie znajduje się językJavaScipt i czym on właściwie jest. Jesteśmy przekonani, że ta książka omawia takie techniki oraz API,które powinien znać każdy zawodowy programista JavaScript. Tak więc bez dalszego zbytniegoprzedłużania…

Poleć książkęKup książkę

Page 16: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej

ZAAWANSOWANE TECHNIKI J ZYKA JAVASCRIPT

24

Poleć książkęKup książkę

Page 17: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej

Skorowidz

$httpBackend, 152

AAjax, 123analizator sieci, 56, 60

w Chrome, 61w Firefox, 61

AngularJS, 141API kolekcji, 174aplikacje internetowe, 133atrybut, 178, 185

kroku, 113maxlenght, 113min / max, 113wzorca, 113

atrybuty elementu, 77

Bbąbelkowanie, 90

zdarzeń, 98biblioteka, 20

jQuery, 20Math, 171

BitBucket, 139błąd TypeError, 36błędy, 55Bootstrap, 142Bower, 133

Ccechy

języka, 25zdarzeń, 98

CORS, 123CSS, 113czas odpowiedzi, 130

Ddebugger, 55, 60delegacja zdarzeń, 101document, 179dodawanie

nowych testów, 151plików, 136usługi $http, 145węzłów, 82

dokument, 178dokumentacja DOM, 177DOM, Document Object Model, 17, 60, 65

dodawanie węzłów, 82dokumentacja, 177dostęp do elementów, 70modyfikacja modelu, 80, 187nawigacja, 180obsługa niewidocznych znaków, 84przeglądanie drzewa, 85relacje, 68struktura, 67terminologia, 177

Poleć książkęKup książkę

Page 18: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej

SKOROWIDZ

194

DOM, Document Object Modelusuwanie węzłów, 83wczytywanie, 73wskaźniki, 69wstawianie HTML, 82zasoby, 177zmienne globalne, 179

domknięcia, 30dopełnianie argumentów, 31dostęp do elementów DOM, 70dostępność zdarzeń, 110dostosowywanie walidacji, 120dowiązywanie

DOM, 96tradycyjne, 92zdarzenia, 94zdarzenia z argumentem, 94

DTD, Document Type Definition, 181dynamiczne przełączanie widoku, 79działanie funkcji super, 46dziecko, 83, 178dziedziczenie, 43

EECMAScript, 158ECMAScript Harmony, 158efekt podświetlenia, 108element, 178

<a>, 91<body>, 91<p>, 75<strong>, 75

Ffabryka, 42fazy zdarzeń, 90formularz, 112, 115, 118funkcja

appendChild(), 187attr, 78cloneNode(), 188createElement(), 80, 188createElementNS(), 188createTextNode(), 189foo, 90getAttribute(), 186getElementById(), 181

getElementsByTagName(), 181insertBefore(), 190isPrototypeOf(), 44Object.create, 44Object.isPrototypeOf(), 35removeAttribute(), 186removeChild(), 190replaceChild(), 190setAttribute(), 187super(), 45

funkcjeanonimowe, 32języka ECMAScript Harmony, 163konsoli, 58obsługi zdarzeń, 99strzałkowe, 164typu Array, 71

Ggenerator modułów, 52generatory, 134Git, 133, 137GitHub, 139Grunt, 133

HHTMLElement, 179

Iinformacje o węźle, 183inspektor DOM, 55, 60instrukcja typeof, 34

JJavaScript, 19język

ECMAScript, 18ECMAScript 6, 163HTML, 141

Kklasa XMLHttpRequest, 129klasy, 166

ECMAScript, 161

Poleć książkęKup książkę

Page 19: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej

SKOROWIDZ

195

klawiatura, 104kod

do wielokrotnego użytku, 39HTML elementu, 76w Chrome, 57w Firefox, 57w Internet Explorer, 58

kody klawiszy, 105kolejka, 90komunikat błędu, 34konfiguracja Protractora, 154konsola, 55, 56konsorcjum W3C, 96kontekst, 29kontrola wersji, 135kontrolery, 143

Mmetoda, 26

append, 126checkValidity, 117document.querySelectorAll, 116PostCtrl, 149

model DOM, 60moduły, 168

z prywatnymi danymi, 51modyfikacja

modelu DOM, 80, 187obiektów, 36

monitorowanie postępu żądania, 129MVC, Model-View-Controller, 17, 141myszka, 103

Nnadpisywanie funkcji, 42narzędzia

do tworzenia stron internetowych, 133obiektowe, 35testujące, 55

narzędzie Traceur, 161nasłuch zdarzeń, 92nasłuchiwanie postępu żądania, 130nawigacja DOM, 180niejawna deklaracja zmiennej, 28Node.js, 133NPM, Node Package Manager, 133

Oobejście błędu, 84obiekt, 26, 35

Person, 40ValidityState, 115XMLHttpRequest, 123

obiektowyJavaScript, 39, 49model dokumentu, 65

Obiektowy Model Dokumentu, DOM, 17obiekty

FormData, 126zdarzeń, 98, 102

obietnice, 166obsługa

niewidocznych znaków, 84zdarzeń, 92

oczekiwanie nawczytanie strony, 73właściwe zdarzenie, 74

odczytywanieodpowiedzi, 129wartości atrybutów, 78

odnajdywanie elementów, 72odpowiedź HTTP, 129odwiązywanie zdarzeń, 97ograniczanie zakresu poszukiwania, 71opakowanie kodu, 49operator

instanceof, 34typeof, 34

oś czasu, 61

Pparametry tras, 148pętla zdarzeń, 90platforma Angular, 141plik

app.js, 143HTML, 66README.md, 138traceur-runtime.js, 162

płytkie zamrożenie, shallow freeze, 37pobieranie

kodu HTML elementu, 76tekstu Elementu, 74

polyfile, 163, 173, 175

Poleć książkęKup książkę

Page 20: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej

SKOROWIDZ

196

potomek, 178poziomy konsoli, 56procedury nasłuchu zdarzeń, 92, 95profiler, 56, 62

w Chrome, 62w Firefox, 63

Protractor, 153przechwytywanie, 90przeciążenie funkcji, 33przeglądanie drzewa DOM, 85przekazywanie argumentów, 53przestrzenie nazw, 49przodek, 178przyszłość JavaScript, 157pseudoklasa

:in-range, 114:invalid, 113:optional, 114:out-of-range, 114:required, 114:valid, 114

Rramka, 90referencje, 182

do obiektu, 25, 63referent, 25relacje pomiędzy węzłami, 68rodzaje zdarzeń, 105rodzeństwo, 179rodzic, 43, 179rozszerzenia typów, 170rozwiązania mobilne, 21

SSass, 141selektor CSS, 72serializacja struktur danych, 125, 127składowe

obiektu, 47prywatne, 47

słowo kluczoweclass, 166import, 170let, 163this, 94

sprawdzanieatrybutu, 77przekroczenia limitu czasu, 130typów, 33tytułu strony, 154właściwości ID, 153

sterta, 90stos, 90struktura DOM, 67system

kontroli wersji, 133zarządzania pakietami, 133

szablon HTML, 149

Ttekst Elementu, 74testowanie, 141

aplikacji, 149integracyjne, 153żądań HTTP, 152

testyjednostkowe, 150Protractera, 155

Traceur, 161transpilator Traceur, 173transpilatory, 160trasy, 146tworzenie

efektu podświetlenia, 108kompilacji, 133modułu, 50obiektu, 35referencji, 63rusztowania projektu, 134stron internetowych, 133węzłów, 80wielu domknięć, 32zakresów, 28żądania GET, 128żądania POST, 128

typArray, 172Number, 171String, 171

typy kolekcji, 173

Poleć książkęKup książkę

Page 21: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej

SKOROWIDZ

197

Uukryte opisy definicji, 79usługa

$http, 145, 149REST, 146

ustanowienie połączenia z serwerem, 125, 129ustawianie wartości atrybutu, 77usuwanie

błędów, 55referencji, 63węzłów, 83

użycie$httpBackend, 152addEventListener, 130Ajaksa, 124ECMAScript Harmony, 158Harmony, 159instanceof, 34Object.freeze(), 37Object.preventExtensions(), 36Object.seal(), 36

Wwalidacja

dostosowywanie, 120formularzy w HTML, 111formularzy za pomocą JavaScript, 114

wartości, 25atrybutu, 77prymitywne, 25

wczytywanie strony, 73węzeł, 80, 179

tekstowy, 179widoczność składowych obiektu, 47widoki, 143właściwości, 26

obiektu ValidityState, 115właściwość

__proto__, 40ID, 153innerHTML, 189body, 180button, 103childNodes, 180className, 185clientX, 103ctrlKey, 104

documentElement, 181firstChild, 181ID, 153innerHTML, 189innerText, 183keyCode, 104lastChild, 182layerX/layerY, 103nextSibling, 182nodeName, 184nodeType, 184nodeValue, 185offsetX/offsetY, 103pageX, 103parentNode, 183preventDefault, 102previousSibling, 183relatedTarget, 103shiftKey, 105stopPropagation, 102target, 102type, 102

współdzielenie zasobów pomiędzy domenami, 130wstawianie

do drzewa DOM, 81HTML, 82

wyłączenie bąbelkowania zdarzeń, 98wyrażenia funkcyjne, 51

wywoływane natychmiast, 39wyrażenie IIFE, 52wzorzec modułowy, 50

YYeoman, 133, 136

Zzakres zmiennych, 27zamiennik konsoli, 56zapobieganie walidacji formularzy, 120zarządca pakietów Node, 133, 134zasoby Harmony, 159zatwierdzenie zmian, 136zawartość Elementu, 74zdalne źródła danych, 145zdarzenia, 89

bąbelkowanie, 90delegacja, 101

Poleć książkęKup książkę

Page 22: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej

SKOROWIDZ

198

zdarzeniadowiązywanie, 92formularzy, 109interfejsu użytkownika, 107klawiatury, 109myszy, 107obiekty, 102odwiązywanie, 97przechwytywanie, 90walidacji, 118wyłączenie bąbelkowania, 98związane ze stroną, 106

zdarzeniebeforeunload, 106blur, 107change, 109click, 107, 110dblclick, 107DOMContentLoaded, 74error, 106focus, 107invalid, 118keydown/keypress, 109keyup, 109load, 106mousedown, 107mouseenter, 108

mouseleave, 108mousemove, 107mouseout, 108, 110mouseover, 108, 110mouseup, 107reset, 109resize, 106scroll, 106select, 109submit, 109unload, 106

zmianadomyślnych akcji przeglądarki, 99kontekstu funkcji, 29referencji, 27

zmienne globalne, 179znacznik li, 70znak równości, 55

żądania HTTP, 124żądanie

GET, 128POST, 128

Poleć książkęKup książkę

Page 24: Tytuł oryginału: Pro JavaScript Techniques, Second Edition · Referencje oraz wartości ... Używając Node.js, możemy dodatkowo uzyskać własną wersję maszyny wirtualnej