JavaScript. Zaawansowane Programowanie

IDZ DO
PRZYKADOWY ROZDZIA
SPIS TRECI
KATALOG KSIEK
KATALOG ONLINE
ZAMW DRUKOWANY KATALOG
TWJ KOSZYK
DODAJ DO KOSZYKA
CENNIK I INFORMACJE
ZAMW INFORMACJE
O NOWOCIACH
ZAMW CENNIK
CZYTELNIA
FRAGMENTY KSIEK ONLINE
JavaScript. Zaawansowane
programowanie
Autor: praca zbiorowa
Tumaczenie: Maciej Gnicki, Adam Jarczyk, Daniel
Kaczmarek, Aleksandra Tomaszewska, Tomasz Wrona
ISBN: 83-7197-687-9
Tytu oryginau: Professional JavaScript 2nd Edition
Format: B5, stron: 1222
JavaScript jest jzykiem sieci. Jest to jzyk intuicyjny i atwy do przyswojenia.
Jego wielk zalet jest dostpno w wikszoci nowoczesnych przegldarek WWW.
Dziki JavaScriptowi moemy tworzy dynamiczne, interaktywne strony WWW. Jzyk
ten najczciej wykorzystywany jest do sprawdzania poprawnoci formularzy, tworzenia
dynamicznych menu, a take do programowania gier. Jednak moliwoci tego jzyka s
znacznie wiksze. Trudno powiedzie, czy istnieje chocia jedna komercyjna witryna
WWW, ktra nie zawiera w ogle JavaScriptu.
Ksika JavaScript. Zaawansowane programowanie zawiera wszechstronny opis
jzyka JavaScript, jego skadni i zastosowa. Na pocztek zaprezentujemy najnowsze
przegldarki i standardy stosowane w WWW, a nastpnie przedstawimy praktyczne
techniki w postaci krtkich przykadw oraz bardziej szczegowych i zoonych analiz
konkretnych rozwiza. Niniejsza ksika koncentruje si wycznie na wykorzystaniu
JavaScriptu w przegldarkach WWW, poniewa gwnie w nich jzyk ten jest
stosowany.
Dla kogo jest ta ksika?
Dla kadego, komu potrzebny jest JavaScript do tworzenia aplikacji WWW
uruchamianych po stronie klienta. Czytelnikom znajcym ju jzyk JavaScript, ksika
ta moe posuy jako aktualny, zaawansowany poradnik; natomiast tym, ktrzy znaj
ju inny jzyk programowania, pozwoli opanowa JavaScript jako now umiejtno.
Co opisuje ta ksika?
Wydawnictwo Helion
ul. Chopina 6
44-100 Gliwice
tel. (32)230-98-63
e-mail: helion@helion.pl
Podstawowe programowanie w JavaScripcie

Wykorzystanie w skryptach obiektw przegldarek
Prac z multimediami
Standardy WWW, w tym XML, CSS i W3C DOM
Dynamiczny HTML
Techniki uruchamiania skryptw
Wyraenia regularne i walidacj formularzy
Analiz przykadw zastosowa praktycznych
Propozycja ECMAScript Edition 4
Spis treci
O Autorach...................................................................................................................................................17
Wprowadzenie ............................................................................................................................................21
Cz I JavaScript w Sieci
27
Rozdzia 1. JavaScript, przegldarki i Sie............................................................................................. 29

JavaScript i Sie ........................................................................................................... 29
Techniczny ksek..................................................................................................... 30
Stan i historia przegldarek ...................................................................................... 34
Obecna uyteczno Sieci ........................................................................................ 37
Ograniczenia Sieci i trendy........................................................................................ 40
Standardy sieciowe i JavaScript ..................................................................................... 42
Typy standardw...................................................................................................... 43
Podstawowe standardy znacznikw ........................................................................... 43
Pomocnicze standardy ............................................................................................. 44
Narzucanie standardw ............................................................................................ 46
Programowanie w JavaScripcie....................................................................................... 47
Nad czym bdziesz spdza czas............................................................................... 47
Z kim bdziesz spdza czas..................................................................................... 48
Narzdzia programowania WWW ............................................................................... 49
Podsumowanie ............................................................................................................. 51
Rozdzia 2. Rdze jzyka JavaScript ....................................................................................................... 53

Pisanie skryptw a standard Unicode ............................................................................. 53
Dodawanie wasnego kodu JavaScript do strony internetowej ........................................... 55
Instrukcje, bloki oraz komentarze ................................................................................... 56
Zmienne i stae............................................................................................................. 57
Wyraenia i warunki....................................................................................................... 59
Operatory arytmetyczne ............................................................................................ 59
Operatory relacji............................................................................................................ 60
Operatory logiczne ................................................................................................... 61
Rozmaite operatory jednoargumentowe ..................................................................... 62
Operatory przypisania............................................................................................... 64
Inne operatory ......................................................................................................... 65
Typy danych.................................................................................................................. 66
Proste typy danych................................................................................................... 66
Inne podstawowe typy danych................................................................................... 69
JavaScript. Zaawansowane programowanie

Sterowanie przepywem ................................................................................................. 70
if else................................................................................................................. 70
while ...................................................................................................................... 72
do while.............................................................................................................. 73
for .......................................................................................................................... 73
break and continue .................................................................................................. 75
switch..................................................................................................................... 76
Funkcje ........................................................................................................................ 77
Tworzenie wasnych funkcji ....................................................................................... 77
Zasig zmiennych funkcji.......................................................................................... 79
Funkcje w wyraeniach ............................................................................................. 80
Funkcje zaimplementowane w JavaScripcie................................................................ 80
Obiekty ........................................................................................................................ 82
Czym s obiekty ...................................................................................................... 82
Wbudowane obiekty w JavaScripcie ........................................................................... 84
Operatory obiektowe i sterowanie przepywem............................................................ 90
Funkcje to rwnie obiekty........................................................................................ 92
Konwersje typw danych i porwnywanie......................................................................... 93
Prosta i bezpieczna zmiana typu ............................................................................... 94
Konwersja prostych typw ........................................................................................ 94
Operatory i mieszane typy danych ............................................................................. 96
Podsumowanie ............................................................................................................. 98
Rozdzia 3. Techniki programowania obiektowego i JavaScript...........................................................101

Czym s obiekty?........................................................................................................ 101
Abstrakcja danych.................................................................................................. 102
Czci skadowe obiektu ........................................................................................ 102
Rozszerzenia ......................................................................................................... 103
Kapsukowanie ...................................................................................................... 105
Dlaczego obiekty s takie wane? ........................................................................... 106
JavaScript .................................................................................................................. 107
Obiekty JavaScript ................................................................................................. 107
Kontekst wykonania, kod funkcji i zasig ................................................................. 109
Konstruktory obiektu.............................................................................................. 113
Ponowne uycie kodu ............................................................................................. 113
Techniki programowania obiektowego i JavaScript ......................................................... 115
Konstruktory obiektw, klasy oraz instancje ............................................................. 115
Dziedziczenie obiektw........................................................................................... 122
Dodawanie chronionych elementw danych do jzyka JavaScript..................................... 132
Metody chronione .................................................................................................. 133
Kod rdowy dla metody chronionej ........................................................................ 136
Podsumowanie ........................................................................................................... 140
Rozdzia 4. Okna i ramki ...........................................................................................................................143

Ramki ........................................................................................................................ 143
Jak zbudowane s zestawy ramek ........................................................................... 144
Porzdek adowania ramek ..................................................................................... 157
Kod rnych ramek ................................................................................................ 160
Zdarzenia ramki..................................................................................................... 168
Okna.......................................................................................................................... 168
atwe okna ........................................................................................................... 169
Tworzenie nowego okna przegldarki ....................................................................... 170
Spis treci
Kod rnych okien ................................................................................................. 176

Zamykanie okien ................................................................................................... 181
Podsumowanie ........................................................................................................... 182
Rozdzia 5. Formularze i dane..................................................................................................................185

Formularze ................................................................................................................. 185
Obiekty formularza ................................................................................................. 186
Elementy formularza .............................................................................................. 192
Otrzymywanie danych bez formularzy ....................................................................... 200
Dane ......................................................................................................................... 204
Trwao danych na stronie internetowej.................................................................. 204
Porwnywanie archiww ......................................................................................... 210
Sprawdzanie poprawnoci ...................................................................................... 210
Ukad formularza ................................................................................................... 215
Podsumowanie ........................................................................................................... 226
Rozdzia 6. Multimedia oraz moduy rozszerzajce.............................................................................227

Krtka historia multimediw w Internecie ...................................................................... 227
Doczanie multimediw do strony internetowej............................................................. 229
EMBED ................................................................................................................. 229
NOEMBED............................................................................................................. 230
Netscape 6 ........................................................................................................... 231
OBJECT................................................................................................................. 231
Alternatywne przegldarki ....................................................................................... 233
Wzgldy specjalne ................................................................................................. 233
Rozpoznawanie i kontrolowanie moduu przy uyciu JavaScriptu ...................................... 235
Rozpoznawanie komponentw za pomoc IE 5.0+ .................................................... 235
Tworzenie instancji dla rozpoznania obiektw ActiveX ............................................... 237
Problemy rozpoznawania IE na Macintoshu.......................................................... 238
Uycie obiektw przegldarki obiekt navigator...................................................... 239
Danie gwne skrypt rozpoznajcy moduy rozszerzajce ....................................... 241
Kontrolowanie popularnych formatw medialnych przy uyciu jzyka JavaScript ................ 247
Macromedia .......................................................................................................... 247
RealNetworks ........................................................................................................ 249
Microsoft Windows Media Player............................................................................. 252
Apple QuickTime.................................................................................................... 253
JavaScript oraz Java .................................................................................................... 257
Porwnanie i kontrast ............................................................................................ 257
Pocztek ............................................................................................................... 257
Element APPLET .................................................................................................... 258
Pisanie prostych apletw Javy................................................................................. 258
Integracja apletw z JavaScriptem........................................................................... 260
Model bezpieczestwa w Javie................................................................................ 262
Nowe technologie ....................................................................................................... 263
SMIL..................................................................................................................... 263
HTML+TIME .......................................................................................................... 263
Skalowalna grafika wektorowa SVG..................................................................... 267
Jzyk interfejsu uytkownika oparty na XML (XUL) ..................................................... 270
Podsumowanie ........................................................................................................... 271
Cz II Ku standaryzacji
273
Rozdzia 7. XML i XHTML..........................................................................................................................275

Wprowadzenie do jzyka XML....................................................................................... 275
Historia jzyka XML..................................................................................................... 276
SGML ................................................................................................................... 276
HTML i sie WWW.................................................................................................. 276
Dane i XML ........................................................................................................... 277
Dobrze sformuowany XML ........................................................................................... 277
Znaczniki, atrybuty i elementy ................................................................................. 278
Deklaracja dokumentu XML .................................................................................... 280
Instrukcje przetwarzania ......................................................................................... 281
Komentarze, obiekty i inne ..................................................................................... 281
Przestrze nazw..................................................................................................... 282
Przykad tekstu XML............................................................................................... 284
Obowizujcy XML....................................................................................................... 284
XML DTD............................................................................................................... 285
W3C XML Schema ................................................................................................. 287
Inne technologie tworzenia schematw.................................................................... 290
Parsery i walidacja ...................................................................................................... 290
Wywietlanie XML ....................................................................................................... 291
Wywietlanie XML za pomoc CSS .......................................................................... 291
Wywietlanie XML za pomoc XSLT ......................................................................... 292
XML i JavaScript ......................................................................................................... 297
XML DOM.............................................................................................................. 297
XHTML.................................................................................................................. 300
XML i nowe specyfikacje.............................................................................................. 303
SVG Scalable Vector Graphics ............................................................................ 303
SMIL..................................................................................................................... 304
RDF Resource Description Framework................................................................. 304
MathML ................................................................................................................ 305
Podsumowanie ........................................................................................................... 306
Rozdzia 8. Kaskadowe arkusze stylw i JavaScript ..........................................................................307

Cele rozwoju CSS........................................................................................................ 308
CSS1 i CSS 2........................................................................................................ 310
Przyszo CSS 3 .............................................................................................. 312
Korzystanie z CSS....................................................................................................... 313
Aktualny stan dostpnoci CSS .............................................................................. 314
Skadnia CSS ........................................................................................................ 315
Jednostki miar....................................................................................................... 319
Modularyzacja CSS ................................................................................................ 321
Model obiektu CSS ..................................................................................................... 322
Dostp do obiektu stylu elementu........................................................................... 324
Modyfikowanie obiektu stylu elementu.......................................................................... 326
Dokumenty i kolekcje arkuszy stylw ....................................................................... 328
Obiekty StyleSheet...................................................................................................... 330
Reguy stylw.............................................................................................................. 331
Zasig sterowania stylami CSS ............................................................................... 333
Pseudoklasy i elementy.......................................................................................... 337
Umieszczanie treci przed i za ................................................................................ 340
Spis treci
Sterowanie czcionk ................................................................................................... 341

Sterowanie obszarem i uoeniem tekstu ...................................................................... 344
Rozmiar i pooenie obiektu ......................................................................................... 346
Model kolorw i ta...................................................................................................... 348
Model obszaru brzegi, marginesy i odstp ................................................................ 349
Ukad listy .................................................................................................................. 353
Ukad tabeli................................................................................................................ 355
Efekty wizualne ........................................................................................................... 357
Automatycznie generowana zawarto .......................................................................... 359
Typy nonikw (stronicowane i przewijane) .................................................................... 359
Sterowanie interfejsem uytkownika ............................................................................. 360
Style dwikowe ......................................................................................................... 360
Proponowane przestrzenie nazw CSS poziom 3 ............................................................. 362
Inne zastosowania praktyczne...................................................................................... 362
Przenone rozmiary czcionek .................................................................................. 362
Zmiana wygldu obiektw wprowadzania danych ...................................................... 363
Zmiana stylu sterowana zdarzeniami ....................................................................... 364
Sterowanie pooeniem przez zdarzenia myszy ......................................................... 366
Przenono a przegldarki starego typu ...................................................................... 367
Podsumowanie ........................................................................................................... 369
Rozdzia 9. DOM.........................................................................................................................................371
Teoria i praktyka ......................................................................................................... 372
DOM poziomy 0, 1, 2 i 3 ............................................................................................. 374
Struktura drzewa DOM................................................................................................. 375
Obiekty wzw ...................................................................................................... 377
Relacje rodzic-potomek .......................................................................................... 380
Wzy Document .................................................................................................... 381
Wzy Element....................................................................................................... 382
Wzy Attribute ...................................................................................................... 383
Wzy CharacterData.............................................................................................. 383
Wzy Text............................................................................................................. 384
Dostp do arkusza stylw CSS ............................................................................... 386
Aktorzy drugoplanowi ............................................................................................. 386
Analiza implementacji w przegldarkach........................................................................ 387
Narzdzia analizy ................................................................................................... 387
Inne przydatne techniki inspekcji............................................................................. 394
Implementacje DOM w przegldarkach IE i Netscape ................................................ 395
Tumaczenie reprezentacji tabeli wedug modelu DOM .............................................. 406
Modyfikowanie drzewa................................................................................................. 407
Punkt wyjcia ........................................................................................................ 407
Rozrastanie i przycinanie ........................................................................................ 410
Zabawa z atrybutami .............................................................................................. 420
Obiekty HTMLElements .......................................................................................... 424
Co dzieje si z symbolami w wzach Text? .............................................................. 426
Modularyzacja DOM .................................................................................................... 427
Moduy DOM ......................................................................................................... 428
Strategia modularyzacji .......................................................................................... 429
Detekcja dostpnych cech...................................................................................... 430
Modele zdarze DOM .................................................................................................. 433
czenie faz przechwytywania i bbelkowania .......................................................... 433
Obiekty zdarze ..................................................................................................... 434

Typy zdarze.......................................................................................................... 435
Doczanie obsugi zdarze styl klasyczny............................................................ 437
Przechwytywanie zdarze........................................................................................ 438
Samodzielne przydzielanie obsugi zdarze .............................................................. 441
Obsuga zdarze zoonych ..................................................................................... 442
Obsuga przestrzeni nazw XML ..................................................................................... 443
Funkcje jeszcze niedostpne........................................................................................ 444
DOM poziom 2 ...................................................................................................... 444
DOM poziom 3 ...................................................................................................... 444
Podsumowanie ........................................................................................................... 445
Rozdzia 10. Dynamiczny HTML................................................................................................................447

Przegld historyczny .................................................................................................... 448
Technologie DHTML .................................................................................................... 449
document.write().................................................................................................... 450
Techniki zamiany rysunkw..................................................................................... 455
InnerHTML i Friends ............................................................................................... 459
Pozycjonowanie obiektw ....................................................................................... 462
Zmiana porzdku wewntrz dokumentu ................................................................... 467
Efekty transformacji ............................................................................................... 468
Przykad selektora kolorw........................................................................................... 470
Dynamiczny HTML i nowe modele zdarze..................................................................... 473
Model przechwytywania zdarzenia ........................................................................... 473
Model bbelkowania zdarze .................................................................................. 475
Model zdarze DOM............................................................................................... 476
Implementacja prostych funkcji obsugi zdarzenia..................................................... 478
Funkcje nasuchiwania zdarze ............................................................................... 481
Selektor kolorw Netscape Navigator 6 ........................................................................ 482
Podsumowanie ........................................................................................................... 486
Cz III Strategie programowania
487
Rozdzia 11. Wybieranie narzdzi ...........................................................................................................489

Problemy produkcyjne ze skryptami .............................................................................. 490
Tworzymy lini produkcyjn .......................................................................................... 490
Wybieramy narzdzia programistyczne .......................................................................... 494
Narzdzia przyspieszajce pisanie skryptw ............................................................. 494
Narzdzia do zarzdzania baz kodu ....................................................................... 506
Prbny cykl produkcyjny ............................................................................................... 511
Ponowne wykorzystanie istniejcego kodu..................................................................... 513
Biblioteka Netscape do sprawdzania poprawnoci .................................................... 513
Biblioteki cookie .................................................................................................... 515
Podsumowanie ........................................................................................................... 516
Rozdzia 12. Praktyka dobrego kodowania.............................................................................................519

Dlaczego potrzebne s standardy kodowania ................................................................ 519
Dobre praktyki oglne.................................................................................................. 520
Prawidowy ukad kodu ........................................................................................... 520
Stosuj opisowe nazwy ............................................................................................ 521
Stosuj konwencje nazewnictwa ............................................................................... 522
Stosuj zmienne dla wartoci specjalnych ................................................................. 524
Komentarze........................................................................................................... 525
Spis treci
Czysto i prosta ........................................................................................................ 526

Upraszczaj wyraenia warunkowe ............................................................................ 527
Stosowanie tablic w roli tabel wyszukiwania............................................................. 527
Ogranicz do minimum liczb punktw wyjcia z ptli ................................................. 531
Pokrewny kod trzymaj razem ................................................................................... 533
Zorganizuj swj kod ............................................................................................... 533
Szczegy ................................................................................................................... 537
Zmienne ............................................................................................................... 537
Funkcje ................................................................................................................. 539
Usuwamy skutki katastrofalnego kodowania ............................................................ 542
Podsumowanie ........................................................................................................... 545
Rozdzia 13. Obsuga bdw, uruchamianie, rozwizywanie problemw..........................................547

Typy bdw w JavaScripcie ......................................................................................... 547
Bdy czasu adowania ........................................................................................... 548
Bdy czasu wykonania........................................................................................... 549
Bdy logiczne ....................................................................................................... 551
Najczstsze bdy w JavaScripcie ................................................................................. 552
Niezdefiniowane zmienne, pisownia i kolejno skryptu ............................................ 552
Niedomknite nawiasy okrge i klamrowe ............................................................... 553
Uycie metody nieobsugiwanej przez obiekt............................................................. 554
Uycie sowa zastrzeonego.................................................................................... 555
Cudzysowy ........................................................................................................... 555
Brakujce znaki + przy konkatenacji ..................................................................... 557
Metody jako wasnoci i odwrotnie .......................................................................... 558
Niejasne instrukcje else ......................................................................................... 558
Problemy z for in ............................................................................................... 559
Zadzieranie z typami .............................................................................................. 560
Obcinanie acuchw ............................................................................................. 561
Jedyno nazw funkcji ............................................................................................ 561
Uycie wyjtkw .......................................................................................................... 562
Skadnia wyjtkw a if......................................................................................... 565
Wyjtki, zdarzenia i bdy........................................................................................ 567
Jak pisa kod czysty i bezbdny .................................................................................. 568
Kod modularny ...................................................................................................... 568
Sprawdzanie istnienia obiektw .............................................................................. 568
Techniki uruchamiania................................................................................................. 568
JavaScript po stronie klienta................................................................................... 569
Microsoft Script Debugger ........................................................................................... 570
Jak zdoby Microsoft Script Debugger ..................................................................... 571
Jak wczy Microsoft Script Debugger .................................................................... 571
Jak uywa programu Microsoft Script Debugger ...................................................... 572
Netscape JavaScript Console....................................................................................... 584
Podsumowanie ........................................................................................................... 587
Cz IV Rady, triki i techniki
589
Rozdzia 14. Prywatno, bezpieczestwo i cookies .............................................................................591

Prywatno dla twrcy skryptw ................................................................................... 591
Ukrywanie kodu rdowego .................................................................................... 592
Zniechcanie do podgldania ................................................................................. 596
10

Bezpieczestwo .......................................................................................................... 597
Bezpieczestwo dla uytkownikw przegldarek ....................................................... 597
Cookies ..................................................................................................................... 605
Teoria cookies....................................................................................................... 606
JavaScript i cookies ............................................................................................... 609
Uycie cookies....................................................................................................... 610
Puapki cookie....................................................................................................... 613
Zestaw narzdzi dla cookies ................................................................................... 613
Podsumowanie ........................................................................................................... 626
Rozdzia 15. Wyraenia regularne .........................................................................................................629

Wyraenia regularne w JavaScripcie.............................................................................. 630
Tworzenie wyrae regularnych przez obiekt RegExp ................................................. 630
Modyfikatory wyrae regularnych ........................................................................... 632
Uycie obiektu RegExp() metod test()..................................................................... 633
Uycie metody replace() obiektu String .................................................................... 634
Skadnia wyrae regularnych ...................................................................................... 634
Proste wyraenia regularne ..................................................................................... 634
Znaki specjalne ..................................................................................................... 636
Uycie wyrae regularnych w JavaScripcie.................................................................... 653
Globalny obiekt RegExp .......................................................................................... 653
Obiekt RegExp ....................................................................................................... 657
Obsuga wyrae regularnych w obiekcie String ........................................................ 661
Podsumowanie ........................................................................................................... 665
Rozdzia 16. Zatwierdzanie formularza .................................................................................................667

Klasa Validate ............................................................................................................ 668
Zatwierdzanie informacji .............................................................................................. 671
Zatwierdzanie informacji podstawowych................................................................... 671
Zatwierdzanie wieku............................................................................................... 675
Zatwierdzanie formatw hasa ................................................................................ 676
Zatwierdzanie numerw telefonw........................................................................... 678
Zatwierdzanie kodw pocztowych ............................................................................ 680
Zatwierdzanie adresu poczty elektronicznej .............................................................. 682
Weryfikacja dat...................................................................................................... 683
Zatwierdzanie numerw kart kredytowych................................................................. 687
Rozszerzanie klasy Validate ......................................................................................... 697
Jak to dziaa.......................................................................................................... 698
Tworzenie rozszerze ............................................................................................. 701
Zastosowanie klasy Validate ........................................................................................ 708
Zatwierdzanie bez JavaScriptu...................................................................................... 714
Podsumowanie ........................................................................................................... 714
Rozdzia 17. Dynamiczne strony WWW ...................................................................................................715

Proste efekty dynamiczne ............................................................................................ 716
Dostp do zawartoci............................................................................................. 722
Magiczne sztuczki ....................................................................................................... 732
Przeczanie reklam ............................................................................................... 733
Przewijanie transparentw ...................................................................................... 736
Wywietlanie dynamiczne ....................................................................................... 740
Spis treci
11
Elementy nawigacji...................................................................................................... 747

Etykietki narzdzi ................................................................................................... 748
Niestandardowe etykietki narzdzi .......................................................................... 749
Panele z zakadkami .............................................................................................. 752
Kiedy cze nie jest czem? ................................................................................... 755
Widgety funkcjonalne .................................................................................................. 756
Sortowanie danych w tabeli .................................................................................... 757
Ktra godzina? ...................................................................................................... 761
Przecignij i upu ................................................................................................. 765
Ruch..................................................................................................................... 768
Pong..................................................................................................................... 771
Podsumowanie ........................................................................................................... 775
Rozdzia 18. Filtry Internet Explorera ....................................................................................................777

Czym s filtry?....................................................................................................... 778
Multimedialne efekty wizualne ................................................................................ 779
Definiowanie prostego filtra .................................................................................... 780
Filtry i ukad .......................................................................................................... 780
Filtry i model obiektowy .......................................................................................... 783
Kolekcja Element.filters ......................................................................................... 785
acuch style.filter ................................................................................................ 786
Dostp do wasnoci obiektu filtra .......................................................................... 787
Efekty proceduralne ............................................................................................... 788
Statyczne efekty filtrw .......................................................................................... 791
Efekty przejciowe ................................................................................................. 795
Przejcia pomidzy stronami................................................................................... 797
Zdarzenia i filtry ..................................................................................................... 799
Optymalizacja filtrw statycznych............................................................................. 801
Optymalizacja zmian asynchronicznych .................................................................... 803
Optymalizacja filtrw przejciowych ......................................................................... 805
Filtry i rne przegldarki ............................................................................................. 807
Filtry Internet Explorera 4.0 .................................................................................... 808
Wykrywanie wersji przegldarki..................................................................................... 809
Podsumowanie ........................................................................................................... 810
Rozdzia 19. Rozszerzanie obiektw standardowych i obiektw przegldarek..................................811

Krtka powtrka ......................................................................................................... 812
Prosty przykad rozszerzenia ................................................................................... 812
Zastosowanie wasnoci prototypu.......................................................................... 813
Zalety ................................................................................................................... 814
Obiekty standardowe................................................................................................... 816
Przykad wykorzystujcy wbudowany obiekt JavaScriptu ............................................. 816
Array..................................................................................................................... 817
Date ..................................................................................................................... 822
Function................................................................................................................ 831
Math .................................................................................................................... 832
Number ................................................................................................................ 833
Object................................................................................................................... 836
String ................................................................................................................... 838
Obiekty przegldarek ................................................................................................... 841
Window................................................................................................................. 842
Globalne metody obiektw...................................................................................... 843
Formularze ............................................................................................................ 845
12

Zastosowanie w Dynamicznym HTML-u ......................................................................... 846
Zgodno z DOM W3C............................................................................................ 846
Zgodno ze starszymi skryptami ............................................................................ 849
Podsumowanie ........................................................................................................... 851
Zasoby internetowe..................................................................................................... 852
Zasoby drukowane ...................................................................................................... 852
Cz V Studium konkretnych przypadkw
853
Rozdzia 20. Konsola audiowizualna BBC News .....................................................................................855

Dlaczego tak, a nie inaczej?......................................................................................... 856
Ustalanie wymaga ..................................................................................................... 857
Dostp do kodu rdowego ......................................................................................... 859
Zestaw materiaw rdowych ..................................................................................... 859
Budowa fundamentw ................................................................................................. 861
Decyzje odnonie implementacji................................................................................... 863
Kliknij i odtwrz .......................................................................................................... 864
Ramki gwnego zestawu............................................................................................. 865
Procedura obsugi odtwarzania klipw........................................................................... 870
Ramka odtwarzacza wideo ........................................................................................... 874
Ramka odtwarzacza wideo (IE 4 Win)....................................................................... 876
Ramka odtwarzacza wideo (IE 4 Mac)...................................................................... 878
Ramka odtwarzacza wideo (Nav4 Win) ..................................................................... 878
Ramka odtwarzacza wideo (Nav4 Mac) .................................................................... 880
Ramka odtwarzacza wideo (inne plug-iny)................................................................. 880
Ramka wiadomoci ..................................................................................................... 880
Ramka bannera .......................................................................................................... 881
Ramka dla panela menu.............................................................................................. 882
Ramka przewijajcych si wiadomoci na ywo........................................................... 884
Biblioteka funkcji ........................................................................................................ 889
Dane zdarze sterowane przez wideo............................................................................ 890
Zmiany w Navigatorze 6............................................................................................... 891
Podsumowanie ........................................................................................................... 896
Rozdzia 21. Teleks BBC News .................................................................................................................897

Dlaczego w JavaScripcie? ............................................................................................ 898
Zagadnienia systemowe .............................................................................................. 899
Wstawienie teleksu na stron ...................................................................................... 900
Zasada dziaania......................................................................................................... 901
Sprawdzenie przegldarki ....................................................................................... 901
Uruchomienie teleksu ............................................................................................ 901
Ptla gwna ......................................................................................................... 903
Importowanie danych ............................................................................................. 904
Efekty wizualne i prezentacja ....................................................................................... 905
Nadawanie wygldu kocowego .............................................................................. 906
Problemy z odwieaniem ekranu ................................................................................. 907
Wyciekanie pamici i odmiecanie ............................................................................... 908
Specyfikacja uaktualnionego teleksu ............................................................................ 909
Przekazywanie danych do teleksu ................................................................................. 909
Ukryte pola formularza ........................................................................................... 910
Ukryte ramki i warstwy ........................................................................................... 911
Spis treci
13
Nawigacja poprzez DOM ......................................................................................... 911

Zhierarchizowane bloki DIV ..................................................................................... 912
Alternatywa wykorzystujca wyspy danych XML......................................................... 913
Doczany kod JavaScript ....................................................................................... 915
Implementacja nowego projektu teleksu ....................................................................... 916
Podsumowanie ........................................................................................................... 921
Rozdzia 22. Koszyk na zakupy...............................................................................................................923

Obraz oglny............................................................................................................... 923
Cele ..................................................................................................................... 924
Proces zakupw..................................................................................................... 925
Spojrzenie od strony technicznej ............................................................................. 928
Tworzenie programu koszyka na zakupy ........................................................................ 930
Tworzymy podstawowe strony WWW ........................................................................ 930
Tworzymy koszyk na zakupy .................................................................................... 932
Tworzymy kas ...................................................................................................... 956
Podsumowanie ........................................................................................................... 976
Rozdzia 23. Drzewo genealogiczne.......................................................................................................979

Aplikacja albumu z fotografiami.................................................................................... 980
Wymogi projektu .................................................................................................... 981
Strategia implementacji ......................................................................................... 981
Projektujemy aplikacj............................................................................................ 982
Drzewo genealogiczne ............................................................................................ 984
Aplikacja DHTML dla Internet Explorera......................................................................... 985
Gwna ramka aplikacji .......................................................................................... 985
Implementacja strony wywietlajcej fotografie ........................................................ 985
Implementacja modalnego okna dialogowego........................................................... 988
Sterownik struktury drzewiastej w czystym JavaScripcie ............................................ 992
Testowanie albumu z fotografiami ......................................................................... 1005
Wyposaanie albumu w obsug XML-a .................................................................. 1005
Wersja zgodna z przegldarkami 6, 5, 4.x ................................................................... 1009
Wykorzystanie biblioteki Netscape z listami rozwijanymi.......................................... 1009
Symulacja modalnego okna dialogowego ............................................................... 1014
Nowa strona wywietlajca fotografie .................................................................... 1015
Podsumowanie ......................................................................................................... 1022
Cz VI Biece kierunki rozwoju JavaScriptu
1023
Rozdzia 24. ECMAScript 4 .................................................................................................................... 1025

ECMAScript == JavaScript?........................................................................................ 1025
Pocztki JavaScriptu a ECMAScript........................................................................ 1026
Dlaczego potrzebny jest ECMAScript...................................................................... 1028
Ewolucja JavaScriptu i ECMAScriptu w edycji 3....................................................... 1028
JavaScript 2.0 i co dalej? .......................................................................................... 1029
Kompilacja a interpretacja .................................................................................... 1030
Klasa a prototyp .................................................................................................. 1031
ECMAScript edycji 4. i co dalej? ................................................................................. 1032
Utrzymanie starego sposobu funkcjonowania ......................................................... 1033
Dodanie nowego sposobu funkcjonowania ............................................................. 1033
14

JavaScript 2.0 > ECMAScript edycji 4. ........................................................................ 1047
Zgodno wsteczna................................................................................................... 1048
ECMAScript jest dobr rzecz .................................................................................... 1049
Podsumowanie ......................................................................................................... 1050
Odsyacze WWW ....................................................................................................... 1051
Rozdzia 25. .NET, usugi web, JScript.NET i JavaScript..................................................................... 1053

Microsoft i .NET ........................................................................................................ 1053
Czym jest .NET? .................................................................................................. 1054
Wicej o JScript.NET ............................................................................................ 1056
JScript.NET i przegldarki WWW ............................................................................ 1056
Visual Studio.NET ................................................................................................ 1057
ASP.NET ............................................................................................................. 1058
Wprowadzenie do usug web dla nowicjusza ................................................................ 1060
Prawdziwa niezaleno ....................................................................................... 1062
Internet Explorer jako konsument usug web ............................................................... 1063
Tworzymy nasz pierwsz usug .......................................................................... 1064
Wykorzystanie zachowania usugi WWW................................................................. 1066
Metody useService() i callService() ........................................................................ 1067
Obiekt wynikowy .................................................................................................. 1068
Skadanie wszystkiego w cao............................................................................ 1069
Usuga sieciowa sklepu elektronicznego ..................................................................... 1070
Metody ............................................................................................................... 1071
Proces ................................................................................................................ 1072
Tworzenie formularza zamwienia ......................................................................... 1072
error i errorDetail ................................................................................................. 1073
Przetwarzanie formularza zamwienia.................................................................... 1074
Krok w przd ............................................................................................................ 1077
Podsumowanie ......................................................................................................... 1078
Dodatki
1079
Dodatek A Funkcje, instrukcje i operatory........................................................................................... 1081

Ograniczniki.............................................................................................................. 1081
Operatory ................................................................................................................. 1082
Pierwszestwo operatorw ................................................................................... 1087
Konstrukcje jzykowe ................................................................................................ 1089
Funkcje wbudowane JavaScript .................................................................................. 1093
Sowa zarezerwowane ............................................................................................... 1094
Dodatek B Obiekty, metody i wasnoci................................................................................................ 1095

Object................................................................................................................. 1096
Array................................................................................................................... 1097
Boolean .............................................................................................................. 1098
Date ................................................................................................................... 1099
Error ................................................................................................................... 1102
Function.............................................................................................................. 1104
Math .................................................................................................................. 1105
Number .............................................................................................................. 1107
RegExp ............................................................................................................... 1108
String ................................................................................................................. 1109
Window............................................................................................................... 1112
Spis treci
15
Obiekty specyficzne dla implementacji: Microsoft ........................................................ 1117

ActiveXObject ...................................................................................................... 1117
Enumerator ......................................................................................................... 1117
VBArray............................................................................................................... 1118
Obiekty specyficzne dla implementacji: Netscape ........................................................ 1119
JavaArray ............................................................................................................ 1119
JavaClass ........................................................................................................... 1120
JavaObject .......................................................................................................... 1120
JavaPackage ....................................................................................................... 1121
Dodatek C Typy danych i konwersje typw.......................................................................................... 1123

Proste typy danych............................................................................................... 1123
Wbudowane stae ................................................................................................ 1123
Konwersja typw.................................................................................................. 1124
Operator typeof ................................................................................................... 1126
Dodatek D Obsuga zdarze ................................................................................................................... 1129

Kompendium typw zdarze....................................................................................... 1129
Typy zdarze modelu DOM.................................................................................... 1134
Obiekt zdarzenia ....................................................................................................... 1135
Rozszerzenia DOM dla obiektu celu zdarzenia ............................................................. 1147
Rozszerzenia DOM obiektu Document......................................................................... 1148
Dodatkowe zdarzenia obsugi klawiszy w modelu DOM poziom 3................................... 1148
Dodatek E Sownik CSS ........................................................................................................................... 1153

Obiekty .................................................................................................................... 1153
Obiekt style......................................................................................................... 1153
Obiekt CSSStyleSheet.......................................................................................... 1165
Obiekt CSSStyleRule............................................................................................ 1166
Obiekt CSSMediaRule .......................................................................................... 1167
Obiekt CSSFontFaceRule...................................................................................... 1168
Obiekt CSSPageRule............................................................................................ 1168
Obiekt CSSImportRule.......................................................................................... 1168
Obiekt CSSUnknownRule...................................................................................... 1169
Jednostki miar .......................................................................................................... 1169
Dodatek F Model DOM .............................................................................................................................. 1171

Typy wzw modelu DOM.......................................................................................... 1171
Wze Document....................................................................................................... 1174
Wze Element.......................................................................................................... 1176
Wze Attribute ......................................................................................................... 1177
Wze Character Data................................................................................................ 1178
Wzy Text ................................................................................................................ 1179
Wzy Comment ........................................................................................................ 1179
Wzy CDATA Section ................................................................................................ 1179
Skorowidz ................................................................................................................................................ 1181
Obsuga bdw, uruchamianie,

rozwizywanie problemw
Poniewa JavaScript jest jzykiem interpretowanym, informacja zwrotne ogranicza si gwnie do ostrzee o problemach ze skadni naszych skryptw. Gdy si z tym uporamy, nieliczne komunikaty diagnostyczne czasu wykonania przekadaj si w zasadzie na Prbowaem to zrobi, ale co, czego potrzebowaem, nie istnieje.
JavaScript w zaoeniach ma by jzykiem szybko i atwo interpretowanym i interaktywnym,
czsto wymagajcym zaledwie kilku instrukcji. aden kompilator nie sprawdza rygorystycznie skryptw zanim pozwoli ich uy. Na skutek tego bardzo atwo nabra przyzwyczaje do niedbaego programowania. Wiele problemw, takich jak bd pominicia testu
obiektu przed uyciem, brak obsugi wyjtkw lub zapominanie o zamykaniu nawiasw
z uwagi na niewaciwe wcicia, bierze si z braku dobrych nawykw programistycznych.
W niniejszym rozdziale omwimy rne typy bdw JavaScriptu, ich przyczyny oraz sposoby ich odnajdywania i poprawiania. Na koniec omwimy dwa najwaniejsze programy
uruchomieniowe: Microsoft Script Debugger i Netscape JavaScript Console.
Typy bdw w JavaScripcie

Instrukcje JavaScriptu s interpretowane po zaadowaniu przez interpreter programu gospodarza (na przykad przegldarki WWW). Podczas adowania skryptu przeprowadzana
jest kontrola skadni. Jeli znalezione zostan bdy skadniowe, to wykonywanie skryptu
jest przerywane i zostaje zgoszony bd. Po zakoczeniu kontroli skadni wykonywane s
wszystkie polecenia globalne (nie zawarte w funkcjach), takie jak deklaracje zmiennych.
Na tym etapie moe wystpi bd czasu wykonania, spowodowany przez cokolwiek, poczwszy od niezdefiniowanej zmiennej, a po przekroczenie zakresu przez indeks tablicy.
Bdy wykonania powoduj przerwanie wykonywania funkcji, lecz pozwalaj na dalsze
dziaanie innych funkcji obecnych w skrypcie. Funkcje i procedury s rozpoznawane przy
548
Cz III n Strategie programowania

adowaniu skryptu, lecz nie bd wykonane, dopki nie zostan wywoane przez inne funkcje
lub zdarzenia. Podczas wykonywania funkcji mog zosta wygenerowane bdy wykonania
lub bdy logiczne (tzn. bdy, ktre powoduj, e wynik nie jest zgodny z oczekiwaniami).
Bdy czasu adowania

JavaScript przechwytuje i zgasza bdy czasu adowania (inaczej bdy skadni) podczas
adowania skryptu. Bdy skadni s powodowane przez powane pomyki w skadni skryptu.
Skrypty, ktre zawieraj bdy skadni generuj komunikaty o bdach podczas adowania
skryptu i nie zostaj uruchomione. Tego typu bdy najatwiej chyba wychwyci i naprawi, poniewa pojawiaj si przy kadym adowaniu skryptu, w przeciwiestwie do bdw
czasu wykonania i bdw logicznych, ktre generowane s tylko po wywoaniu funkcji lub
spenieniu okrelonych warunkw. Brakujce cudzysowy, nawiasy okrge i klamrowe
nale do najczstszych przyczyn tych bdw. Wemy na przykad poniszy fragment kodu:

!
"
#$%&'()(*+,-#.
+
. /+0
123

+
"#$%&
"
"
Po zaadowaniu powyszego kodu do IE 6 (gdy debuger jest wyczony a powiadamianie

o bdach jest wczone) generowany jest nastpujcy komunikat o bdzie:
Aby wyczy odpluskwianie skryptw i wczy powiadamianie w bdach skryptw w IE:

1. Otwrz okno przegldarki Internet Explorer.
2. Kliknij Narzdzia.
3. Kliknij Opcje internetowe.
4. Kliknij zakadk Zaawansowane.
5. Pod nagwkiem Przegldanie zaznacz opcj Wycz debugowanie skryptu.
Rozdzia 13. n Obsuga bdw, uruchamianie, rozwizywanie problemw
549
6. Zaznacz opcj Wywietl powiadomienie o kadym bdzie skryptu.

7. Kliknij OK.
Netscape 6 generuje podobny bd na konsoli JavaScriptu (Tasks/Tools/JavaScript Console).
Jak widzimy, obie przegldarki wywietlaj podobne informacje o bdzie. Kada wywietla opis napotkanych bdw, plik, ktry spowodowa bd (plik rdowy albo URL) oraz
wiersz i pooenie bdu w tym wierszu. Naley zwrci uwag, e wiersz i kolumna bdu
(pozycja znaku) nie musz przedstawia dokadnego pooenia bdu. Do takiego sposobu
podawania numerw wierszy i pooenia znaku troch trudno si przyzwyczai. Powodowane jest to faktem, e interpreter JavaScriptu wywietla numer wiersza i kolumny, skd
nie potrafi przej dalej. W powyszym przykadzie z IE interpreter JavaScriptu zatrzyma
si na 7. wierszu, 4. znaku dokadnie mwic, na w wierszu . W Netscape 6
numery wartoci mog by inne z uwagi na rnice w interpreterach JavaScriptu i miejscach, od ktrych nie potrafi interpretowa skryptu. Z tego powodu warto korzysta ze
rodowiska IDE (np. Microsoft Visual .NET, Allaire HomeSite, Macromedia Ultradev itp.),
w ktrym wywietlane s numery wierszy.
Bdy czasu wykonania

Bdy czasu wykonania s wychwytywane po zaadowaniu skryptu i podczas dziaania.
Bd taki zachodzi, gdy skrypt usiuje wykona nieprawidowe dziaanie. Gdy w skrypcie
pojawi si bd czasu wykonania, zostaje wywietlony komunikat o bdzie i wykonanie
skryptu ustaje. Inne skrypty nadal mog dziaa, lecz za kadym razem, gdy zostaje wywoany skrypt z bdem, wywietlany jest komunikat o bdzie. Do powszechnie spotykanych przyczyn wystpowania bdw czasu wykonania nale odwoania do niezdefiniowanych zmiennych, niewaciwe zastosowanie obiektw, wstawianie niezgodnych typw
i tworzenie ptli nieskoczonych. Poniszy kod generuje typowy bd czasu wykonania:
.4!

&.56789 5!!
"
#$%&'()(*+,-#.
+
-. # .
!:*;0
123

;<
. / # .
!:=<""4 :!
.!5>4! # .
!:
"#$%&
"
"
550

Komunikaty o bdach generowane przez IE 5 i Netscape 6 s nastpujce:
Obie przegldarki informuj uytkownika, e zmienna

nie jest zdefiniowana.
Poniewa przegldarka nie wie, co ma wywietli w polu , zwracany jest bd.
Oto bardziej zoony przykad kodu generujcego bd wykonania:
.4!
6

&.5?78.
1@!89 5!!
"
#$%&'()(*+,-#.
+
4! : ! '/; A ';= -4 !: *;BB;
"#$%&
"
CD
'&)D&*+ A +!*+ A '+-4*+E.+"'&)
"CD
"
Ten skrypt generuje nastpujce bdy:
551
Powodem, dla ktrego skrypt generuje bd, jest jego wykonanie zanim zostanie utworzone
pole tekstowe. Skrypt nie moe przypisa wartoci czemu, co nie istnieje. Sam skrypt jest
cakowicie poprawny i nie wygenerowaby adnych bdw, gdyby by wykonany po utworzeniu pola tekstowego lub gdyby zosta umieszczony w funkcji wywoanej po zaadowaniu tekstu HTML.
Bdy logiczne
Bdy logiczne s wolne od bdw skadni i czasu wykonania, lecz prowadz do niepoprawnych wynikw. Bdy logiczne nie powoduj zatrzymania wykonywania skryptu, chyba e
niezamierzone wyniki bdu logicznego w poczeniu z innym poleceniem lub skryptem
powoduj bd czasu wykonania. Usuwanie bdw logicznych jest czsto najtrudniejsze
i moe od programisty wymaga przeledzenia wartoci wszystkich zmiennych w kadym
kroku skryptu. Do czstych przyczyn bdw logicznych nale: uycie zamiast i niezgodne typy danych. Poniszy kod ilustruje, jak atwo jest wygenerowa bd logiczny:
:

#$%&'()(*+,-#.
+
-.-4<
F./4! .*G<4! .H<4! .II=
J
-4*4! .<""8 .K!
5>!9

F/-4*?=""L
>;*;!;**;8.
K89
J
. /;
3 M! . 3K*?;=<
N

J
. /;-4*;I-4=<
N
N
"#$%&
"
"
W powyszym przykadzie wynik zawsze bdzie taki:
552

Pierwsze wartociowanie zmiennej (instrukcja ) zawsze zwrci , poniewa za kadym
razem ustawia warto zmiennej rwn za pomoc operatora zamiast uy operatora porwnania . Poniewa instrukcja daje (gdy mogaby zwrci
tylko wtedy,
gdyby wartoci nie mona byo z jakiego powodu zmieni), za kadym razem
otrzymamy alert jak na rysunku powyej. Gdybymy zamienili na lub , wyniki byyby
zgodne z oczekiwaniami, za warto w oknie alert reprezentowaaby spodziewan warto
zmiennej, czyli zaczynaa si od wartoci i zwikszaa za kadym klikniciem OK o 1, a do .
Najczstsze bdy w JavaScripcie

Czytelnik, ktry spdzi jaki czas pracujc JavaScriptem zapewne napotka wiele z poniszych problemw. Zawsze jednak warto przyjrze si im po raz drugi, aby pamita o nich
podczas kodowania.
Niezdefiniowane zmienne, pisownia i kolejno skryptu

Zmienna w JavaScripcie moe by zdefiniowana na dwa sposoby: niejawnie i jawnie. Definicja niejawna pozwala zdefiniowa zmienn po prostu przez przypisanie wartoci:
'48.*?<
Definicja jawna wykorzystuje sowo kluczowe :

-.
'48.*?<
lub:
-.
'48.<""1 !F
!
1
!!1
'48.*?<""
!
1 !

!!1
Wszystkie trzy metody daj taki sam efekt (z ma rnic dotyczc zasigu zmiennej: zmienne deklarowane niejawnie wewntrz funkcji staj si zmiennymi globalnymi): zmienna o nazwie zostaje zdefiniowana i otrzymuje warto .
Jak widzimy, zdefiniowa zmienn jest atwo wystarczy przypisa do niej warto. Bd
otrzymamy tylko wtedy, gdy zmienna nie bdzie w ogle zdefiniowana.
Bdy niezdefiniowanych zmiennych s czsto powodowane przez literwki i bdnie stosowane due litery w nazwach zmiennych.
""
-.: !*;O13K
;<
-. *; K 4;<
F/!F
./;P
5!
1CP213
O13K
;==
J
. /;$;I( !=<
N

553
J
. /;$;I =<
N
W powyszym skrypcie s dwa powane bdy. Po pierwsze, zmienna zostaa niepoprawnie zapisana od duej litery ! . Po drugie, zmienna
"
# zostaa bdnie zapisana jako
"#. Obie pomyki powoduj podobne bdy czasu wykonania: bd
braku definicji zmiennej.
Powysze okno bdu jest wywietlane, jeeli Microsoft Script Debuger zosta zainstalowany
i wczony. Wicej informacji o tym programie przedstawimy w podrozdziale Microsoft
Script Debuger pod koniec rozdziau.
Chocia definiowanie zmiennych w JavaScripcie jest bardzo atwe, niezdefiniowane zmienne
s bardzo czstym powodem bdw wykonania. Bdy zwykle powoduje nie to, jak zmienna
zostaa zdefiniowana, lecz kiedy. Wemy na przykad poniszy kod:
F4!
!. /=
J
. /0.A=<
N
. /=<
-.0.A*;0.A;<
W tym przykadzie, chocia nie generuje bdu czasu wykonania jak poprzedni, bardzo
atwo odkry, gdzie ley problem. Zmienna
$ % jest definiowana po wywoaniu funkcji
&' , wobec czego jest zwracana jako niezdefiniowana. W rzeczywistych przykadach
pomyki tego typu mog by trudne do znalezienia, zwaszcza e okrelone skrypty s czsto
doczane jako pliki .js, wic faktyczny kod czasami jest niewidoczny na stronie.
Niedomknite nawiasy okrge i klamrowe

Kolejnym frustrujcym problemem jest zapominanie o domkniciu nawiasw lub dopisywanie nawiasu tam, gdzie nie jest potrzebny. Pomyki tego typu generuj bd skadni podczas adowania.
Jedn z najczstszych pomyek jest brak nawiasu klamrowego. Wemy na przykad poniszy
kod:
F4!
!. 4.!
/8Q4=
J
-.8% 4.!Q4*F<

F/8Q4=
554

J
8% 4.!Q4* .4<
. 4.!8% 4.!Q4<
N
Instrukcja nie zawiera zamykajcego nawiasu klamrowego i wywouje nastpujcy bd:
Waciwe stosowanie wci, wspomniane w poprzednim rozdziale, znacznie zmniejsza prawdopodobiestwo popenienia tej pomyki.
Kolejn czst pomyk jest zapominanie o wziciu w nawias argumentu instrukcji . Oto
przykad:
F4!
!. 4.!
/8Q4=
J
-.8% 4.!Q4*F<

F8Q4
J
8% 4.!Q4* .4<
N
. 4.!8% 4.!Q4<
N
W wierszu mamy ( bez nawiasw, wic wystpi nastpujcy bd:
Uycie metody nieobsugiwanej przez obiekt

Uycie metody, ktrej obiekt nie obsuguje jest powszechnie spotykan pomyk, zwaszcza
przy pracy z HTML DOM. Poniszy fragment kodu generuje bd czasu wykonania:
-.
Q4*G6?<
!Q4*
Q4 ./62R=
. 4.!
Q4<
Powyszy kod usiuje wykona zastpowanie acucha na liczbie cakowitej, co generuje

poniszy bd:
555
Uycie sowa zastrzeonego

W JavaScripcie pewne sowa nale do skadni jzyka, wobec czego maj w tym jzyku
ustalone znaczenie. S to sowa zastrzeone. Wikszo z nich to sowa kluczowe, uywane
przez sam JavaScript, inne s zarezerwowane na przyszo. Sowa zastrzeone nie mog
by uywane jako nazwy zmiennych, funkcji, obiektw ani metod. Jeli sprbujemy uy
sowa zastrzeonego, interpreter JavaScript wygeneruje bd czasu adowania.
W poniszym przykadzie sprbujemy zadeklarowa zmienn o nazwie )
(zastrzeone
sowo kluczowe):
-.<
Interpreter JavaScript zgosi bd:
Naley zwrci uwag, e

jest dopuszczaln nazw, poniewa JavaScript rozpoznaje
wielko liter. Jednake uywanie sw kluczowych jest zawsze zym nawykiem, niezalenie od wielkoci liter. List sw zastrzeonych przedstawia dodatek A.
Cudzysowy
Niewaciwie umieszczone znaki cudzysowu lub ich brak to pomyki popeniane powszechnie w JavaScripcie , zwaszcza gdy skrypty s generowane i kodowane dynamicznie, oraz
gdy acuchy w JavaScripcie zawieraj znaki cudzysowu.
Cudzysowy wok nazw zmiennych i obiektw

Omykowe umieszczenie nazwy zmiennej lub obiektu w cudzysowach powoduje, e JavaScript traktuje t nazw jak acuch. Moe to powodowa nieoczekiwane wyniki. Poniszy
kod:
-.E
. '*;,!;<
-. '*;;<
. /;0
12;IE
. 'I;;I; ';I; ;=<
556

da wynik:
Brak cudzysoww przy acuchach

Jeli zapomnimy umieci cudzysowy wok acucha, JavaScript potraktuje acuch jak
zmienn lub obiekt, co moe spowodowa bd czasu wykonania. Kod:
-.E
. '*,!<
-. '*;;<
. /;0
12;IE
. 'I;;I 'I; ;=<
spowoduje bd:
Niedomknite cudzysowy
Niedomknite cudzysowy rwnie mog wygenerowa bdy JavaScriptu. Przy pracy z acuchami w JavaScripcie wane jest poprzedzenie cudzysowu wewntrz acucha znakiem
ucieczki. Oto przykad acucha generujcego bd:
-.# .
!:G*;&

;L:;;
Komunikat o bdzie bdzie wyglda tak:
acuch generuje bd, poniewa znaki cudzysowu wewntrz acucha musz by poprzedzone znakiem ucieczki lub przynajmniej stosowane naprzemiennie: podwjne i pojedyncze.
Oto kilka moliwych rozwiza:

n
557
Zastp podwjne cudzysowy w acuchu pojedynczymi:

-.# .
!:G*;&

+L:+;
Ujmij acuch w cudzysw pojedynczy:

-.# .
!:G*+&

;L:;+
Preferowanym sposobem zapisywania cudzysoww w acuchach jest uycie

znaku ucieczki, zamiast zmiany cudzysoww pojedynczych lub podwjnych:
-.# .
!:G*;&

M;L:M;;
Dodatkowe informacje o znakach ucieczki zawiera rozdzia 2., Rdze jzyka JavaScript.
Brakujce znaki + przy konkatenacji

Przy konkatenacji acucha oraz zmiennej lub obiektu JavaScriptu atwo zapomnie o symbolu + pomidzy czonymi acuchami, zmiennymi lub obiektami. Brak operatora + bardzo atwo przeoczy, gdy usiujemy odpluskwia skrypt, ktry cignie si strona za stron.
Tak moe wyglda przykad, w ktrym nietrudno zapomnie o operatorze konkatenacji:
-.4.'*;,;<
-.
'48.*G6?R<
-.)%<
)%*;F.& S4.*;I4.'I;T
'48.*;
'48.
4!
! .F*)%
Plus (*) powinien znale si pomidzy +, + i .
Operatory =, ==, ===

W JavaScripcie jest operatorem przypisania, ktry warto tego, co znajduje si przed nim,
nastawia na to, co znajduje si po nim. oznacza jest rwny, wykonuje porwnanie
wartoci po obu stronach i zwraca warto boolowsk. oznacza jest cile rwny i dokonuje porwnania zarwno wartoci, jak i typu danych po obu stronach.
-.
*6<
. /
*?="" .?
. /
**;?;="" . .4
. /
***;?;="" .F
W tym przykadzie zmienna jest deklarowana z wartoci -. W drugim wierszu warto

zmiennej jest zmieniona na , co zgasza okno alert. ++ w trzecim wierszu zwraca ,
poniewa warto zostaa zmieniona w poprzednim wierszu. Czwarty wiersz zwraca
,
poniewa jest zmienn typu liczbowego.
558
Operatory <> i !=
Programici ASP i VB zwykle uywaj jako rny ni. W JavaScripcie powoduje to
bd skadni, poniewa operatorem nierwnoci w tym jzyku jest ..
Metody jako wasnoci i odwrotnie

W JavaScripcie para nawiasw musi nastpowa po kadej metodzie, nawet dla metod nie
przyjmujcych parametrw. Po wasnociach nigdy nie wystpuje para nawiasw.
W tym przykadzie po metodzie /
brak pary nawiasw, wic JavaScript usiuje
zinterpretowa j jako wasno:
-.Q.*;0
123

;<
. /Q. .$=<
Daje to do ciekawe wyniki:
Wyniki w ramce ostrzegawczej s zasadniczo prototypem metody /

, ktrego
metody i wasnoci s nie wyliczonym kodem wasnym obiektu JavaScript, do ktrego naley
/
.
Analogicznie, jeli umiecimy nawias po wasnoci, interpreter JavaScriptu bdzie prbowa zinterpretowa wasno jako metod:
-.Q.*;0
123

;<
. /Q. !: /==<
Generuje to bd wykonania:
Niejasne instrukcje else

Czasami nie jest oczywiste, do ktrej instrukcji naley dana instrukcja
. W poniszym przykadzie niepoprawna jest zarwno logika, jak i formatowanie:
559
F/.4 *; :.!;=

F/.4 **;.:.!;=
U/=<

U
!/=<
W tym przykadzie nie wygramy nigdy. Rami

naley do drugiej z instrukcji . Uycie
nawiasw klamrowych (opisane w poprzednim rozdziale) eliminuje ten bd.
F/.4 *; :.!;=

J

F/.4 **;.:.!;=
J
U/=<
N
N

J
U
!/=<
N
Problemy z for in
Jak powiedzielimy w rozdziale 2., skadnia 01110 jest uywana do znajdowania nazw
wszystkich wasnoci obiektu JavaScript. Problem polega na tym, e metoda ta nie zawsze
dziaa zgodnie z oczekiwaniami; niektre wasnoci nie pojawiaj si, za cz obiektw
pozornie nie ma w ogle wasnoci. Niewiele moemy z tym zrobi, poniewa tak decyzj
o produkcie podjli autorzy interpretera JavaScript. Problem taki zwykle pojawia si tylko
wtedy, gdy dla swoich celw wycinamy wasn ciek do przegldarki..
Moemy tylko:
n
pozna z gry nazwy wasnoci,
wiedzc, dlaczego wasnoci s ukryte przed wyliczeniem, zaakceptowa to.
Aby pozna z gry wasnoci obiektu, polecamy odwoa si do dokumentacji, na przykad

w dodatkach do tej ksiki. Alternatywn taktyk jest sondowanie danego obiektu, wasno
po wasnoci, przy uyciu skadni tablicowej. Pochania to wiele czasu i jest ostatni desk
ratunku.
Zgodnie ze standardem ECMA, dana wasno obiektu ma kilka atrybutw opisujcych t
wasno, na przykad nazw i warto wasnoci. Jednym z takich atrybutw jest 23.
Jeli atrybut ten jest obecny, wasno nie zostanie ujawniana przez ptl 0 1110 .
W ten sposb wasnoci obiektw s pomijane w takich ptlach.
Wasnoci obiektw mog mie atrybut 23 z kilku powodw. Najprostszym jest fakt,
e niektre wasnoci s nieciekawe. Kada metoda obiektu jest rwnie jego wasnoci.
Nie ma sensu prbowa oddziaywa z metod jako wasnoci, jeli obiekt jest obiektem
macierzystym. Na przykad:
560

. /4! !=<
4! !*;# 5 ;<
. /4! !=<
Skrypt wywietli poniszy alarm i przy okazji wywoa zamieszanie w obiekcie &).
Metoda 4 nie bdzie od tego momentu dostpna do tworzenia nowych okien przegldarki.
Drugim powodem stosowania wasnoci, ktrych nie mona wyliczy jest to, e niektre
obiekty macierzyste nie trzymaj si tych samych regu co JavaScript. Przykadem mog
by klasy jzyka Java, udostpniane jako obiekty macierzyste JavaScriptu w przegldarce.
Wasno JavaScriptu 51 nie jest naprawd obiektem, lecz pakietem typw obiektowych (inaczej zwanym bibliotek klas). 511 jest pakietem w 51, ale nie
jest obiektem. Pakiet to po prostu grupa pokrewnych obiektw, zgromadzonych razem.
Klasy s zapisane na dysku i przesiewanie ich w poszukiwaniu skadowych 51, ktre
mog by obiektami, nie jest zadaniem atwym, efektywnym lub choby przydatnym. I tak
przegldarka na to nie pozwala. Wobec tego ani on, ani inne pakiety zwizane z klasami jzyka Java, nie mog by wyliczane przez JavaScript.
Powyszy opis dotyczy tylko klas jzyka Java uywanych z JavaScriptu, a nie obiektw
Java uywanych z JavaScriptu. Obiekt Javy mona wyliczy przez JavaScript jak normalny
obiekt.
Zadzieranie z typami
atwo jest naprdce skleci skrypt JavaScriptu uruchamiany po stronie klienta. Jzyk o sabych typach oszczdza mnstwo czasu, ktry w przeciwnym razie trzeba by powici na
organizowanie danych waciwego rodzaju dla waciwego rodzaju zmiennych. Po ukoczeniu pracy przychodz ludzie ze szczeglnymi zdolnociami, zwani potocznie uytkownikami, i wynajduj wielkie luki w naszych skryptach. Wprawdzie JavaScript posiada beztypowe zmienne, lecz same dane s ju okrelonego typu, a uytkownicy na pewno znajd
sposb, aby skrypt wyoy si na tej rnicy.
W rozdziale 1. opisano dziaanie konwersji typw w JavaScripcie. Najczstsz puapk jest
pisanie wszystkich skryptw pod Netscape 4.0, aby potem odkry, e nie dziaaj w adnej innej
przegldarce, poniewa polegalimy na specjalnym zachowaniu operatorw JavaScript 1.2 .
i w Netscape. Odradzamy uycie podczas programowania 0/'!6'!378) 4
561
1-7 , chyba e przenono nie jest w ogle wymagana. Zapewne najbezpieczniej jest cakiem pomin atrybut /'!6'!3, poniewa JavaScript i tak jest domylnym jzykiem
skryptowym przegldarek. Jeli musimy go zastosowa, lepiej uy /'!6'!378) 47.
Jeli mamy pewno, e uytkownicy bd korzysta z naprawd nowych przegldarek, to
dobr opcj jest te /'!6'!378) 4017 lub /'!6'!378) 40197, poniewa
wtedy bdziemy dysponowa zdarzeniami obsugi bdw w tych wersjach.
Konwersja danych od uytkownika na liczby moe by problematyczna. Jeli program CGI

wci pada, poczta e-mail nie dochodzi a JavaScript powoduje wyskakiwanie bdw w jakiej przegldarce, to najlepiej wrci do sprawdzania poprawnoci wszystkich wartoci
liczbowych wprowadzanych przez uytkownika. Sprawdanie poprawnoci formularzy opisano w rozdziale 16.
Na koniec, starsze przegldarki posiadaj ograniczon obsug typw JavaScriptu (omwionych rozdziale 1.). Jeli chcemy obsugiwa takie przegldarki, lepiej nie przyzwyczaja si do , , "4 lub obiektw ' ".
Obcinanie acuchw
Uwaga na stae acuchowe, ktre zawieraj ponad 80 znakw. Niektre starsze przegldarki nie potrafi ich obsugiwa. Lepiej podzieli je na mniejsze czci tak atwiej je
czyta. W poniszym przykadzie s tylko krtkie acuchy, lecz ilustruje on zasad:
-.8
:U .
!:*;
. 5 5;
I;.4:
5 5;
I; .
5 5;<
Uwaga na problem pustego znaku w przegldarkach Netscape. Warto +%%%:;;;"""+1<

wynosi w nich , z wyjtkiem pniejszych wersji Netscape 4.0; znaki """ gubi si. Dla
wszystkich przegldarek prba pokazania takiego acucha za pomoc lub &)=
1 jest oglnie bezowocna, poniewa acuch bdzie rozumiany jako %%% a nie
%%%:;;;""".
Jedyno nazw funkcji

Kada funkcja i zmienna musz mie wasn niepowtarzaln nazw. Powielanie nazw zmiennych lub funkcji niekoniecznie musi powodowa bd, lecz daje wyniki inne od spodziewanych:
F4!
!. /=
J
4! .
/=<
N
F4!
!E4!
!/=
J
. /;&
. F4!51;=<
N
F4!
!E4!
!/=
562

J
. /;.4:F4!51;=<
N
E4!
!/=<
W powyszym kodzie standardowa funkcja alertu JavaScript jest redefiniowana tak, e wykonuje zapis &)1 . Nastpnie definiujemy funkcj, po czym redefiniujemy j
w kolejnym bloku. Wynik ilustruje, jak wane s niepowtarzalne nazwy funkcji:
Uycie wyjtkw
W JavaScripcie wszystko, co zgasza bd lub usiuje wykona niedozwolon operacj, jest
definiowane jako wyjtek. Wyjtki, ktre nie s obsugiwane przez kod, generuj znajome
tajemnicze komunikaty o bdach systemowych i powoduj przerwanie wykonywania skryptu.
Poprzez obsug wyjtkw moemy wprowadza wasne komunikaty o bdach i uruchamia wasne funkcje obsugi bdw.
Gdy wywoywana jest funkcja lub metoda, jedynym opisanym jak dotd mechanizmem
przekazywania informacji z powrotem do fragmentu skryptu, ktry wywoa metod lub
funkcj, jest instrukcja . Co si dzieje, gdy co idzie nie tak? Pokazuje to poniszy
przykad funkcji:
F4!
!U
5UU
/!C!2! =
J
-.-% 4.!Q4<

F/!C!I! 6V=
J
-% 4.!Q4*;.5O 4.95
O
!
;<
N

F/!C!I! GV=
J
-% 4.!Q4*;.5O 4.95
!
;<
N

J
-% 4.!Q4*!C!I! <
N
. 4.!-% 4.!Q4<
N
563
Problem z t funkcj polega na tym, e przy kadym jej uyciu wymagany jest dodatkowy
kod do sprawdzenia wartoci zwracanej. Nigdy nie bdziemy wiedzie przed tym sprawdzeniem, czy funkcja zadziaaa w sposb przydatny, czy nie. W takim przypadku moemy
by zmuszeni do przeprowadzenia dwch kontroli, po jednej dla kadego nietypowego
przypadku. Gdyby funkcja bya zoona, musielibymy przeprowadza wiele kontroli. Oto
przykad uycia tej funkcji:
-.-%4 *U
5UU
/?2W=
F/-%4 **;.5O 4.95

O
!
;=
J
"".O832@8.
K8
.8
N

F/-%4 **;.5O 4.95
!
;=
J
"".O83
!!:2@8.
K8
.8
N
""13

3 :
125! !44115 5
W Javie trudne przypadki tego typu s obsugiwane za pomoc wyjtkw. Oglnym zadaniem wyjtkw jest udostpnienie mechanizmu zgaszajcego nietypowe zdarzenia. Gdy
mamy taki dziaajcy mechanizm, moemy by pewni, e zwracane wartoci bd zgasza
tylko normalne, poprawne dane wyjciowe funkcji. Gdy zatroszczymy si o przypadki wyjtkowe, nie bdzie trzeba dodatkowo sprawdza wartoci zwracanych funkcji.
JavaScript do pewnego stopnia naladuje skadni Javy. Wyjtki stan si w przyszoci
wan funkcjonalnoci JavaScriptu. Wynika to std, e gdy chcemy uy obiektu w skrypcie, musimy dysponowa punktami dostpu, przez ktre mona dosta si do obiektu, jego
wasnoci i metod. Takie punkty dostpu razem tworz interfejs, inaczej sygnatur obiektu. W terminologii komputerowej trzema gwnymi cechami interfejsu obiektu s jego wasnoci (inaczej atrybuty), metody i wyjtki. Wobec tego w JavaScripcie wyjtki s obecne.
W Javie musimy cile deklarowa typ rzeczy, ktr jest wyjtek. Zgodnie z duchem jzyka,
w JavaScripcie wyjtkiem moe by dowolny znany element, na przykad obiekt lub acuch. Oficjaln skadni instrukcji JavaScriptu obsugujcych wyjtki przedstawilimy poniej. Najpierw tworzymy wyjtek:
. <
Nastpnie obsugujemy wyjtek:

.

/="" .
!
. 2@8K .!

/
F="" .
! .4:
2@8K .!

""1!!2!1 @11!
Tak bdzie wyglda napisana na nowo poprzednia funkcja liczca na palcach:

F4!
!U
5UU
/!4G2!46=
J

F/!4GI!466V=
. ;.5O 4.95
O
!
;<
564

F/!4GI!466V=
. ;.5O 4.95
!
;<
. 4.!!4GI!46<
N
Jeli w tej funkcji instrukcja < bdzie w ogle wykonana, to przetwarzanie funkcji zostanie zatrzymane i funkcja zwrci informacj natychmiast, lecz zamiast zwykej wartoci
zwracanej zostanie zwrcony wyjtek.
Napisany na nowo kod wywoujcy funkcj bdzie wyglda tak (dziaa w przegldarkach
Netscape 6 i Internet Explorer 5):
-.
%4 <
.
J

%4 *U
5UU
/?2W=<

F/
%4 **X=
J
. /;$.. ;=<
N

J
. /;& .:
!;=<
N
N
/...=
J

F/...**;.5O 4.95
O
!
;=
J
. /;.5O 4.95
O
!
;=<
N

F/...**;.5O 4.95
!
;=
J
. /;.5O 4.95
!
;=<
N
N
F
!
J
. /
%4 =<
N
W tym skrypcie zmienna

moe nigdy nie zosta ustawiona w czwartym wierszu.
Jeli funkcja zwrci wyjtek, przetwarzanie przeskakuje natychmiast do instrukcji ))<,
ktra ma dostp do wyjtku w zmiennej bdu, i zamiast zwykych, wykonane zostaj instrukcje w bloku po ))<. Jeli nie bdzie wyjtku i funkcja normalnie zwrci warto, to
wykonane bd nastpne instrukcje w bloku ", a po jego zakoczeniu blok ))< zostanie
cakowicie pominity, podobnie jak nieuywane rozgazienie instrukcji .
Cae objanienie bdzie o wiele prostsze, jeli znamy troch argonu. Gdy co idzie le,
mwimy e funkcja zgasza wyjtek. Funkcja jest wywoywana w bloku ", a wyjtki s
obsugiwane w blokach ))<. Blok " jest wykonywany zawsze, jeli na kocu nie
pozostanie nierozstrzygnity wyjtek.
565
Zasady dziaania tego procesu s nastpujce:

n
Jeli w funkcji (lub w dowolnym bloku kodu) dotrzemy do instrukcji < ,

funkcja ta nie bdzie dalej przetwarzana, nie zwrci wartoci i nie zwrci &.
Zamiast tego przestanie dziaa natychmiast i zostanie zgoszony wyjtek.
Jeli instrukcja lub funkcja powodujca wyjtek nie znajduje si wewntrz bloku
", wystpi bd interpretera i skrypt zostanie zatrzymany. Jeli instrukcja lub
funkcja jest wywoana ze rodka innej funkcji, metody lub bloku ", to cay ten
zbir instrukcji zostanie rwnie zaniechany, za wyjtek bdzie przekazany wyej
do nastpnego poziomu sterowania, dopki nie zostanie napotkany blok " lub nie
wystpi bd.
Jeli instrukcja lub funkcja powodujca wyjtek znajduje si wewntrz bloku ",
wszystkie kolejne instrukcje w bloku s ignorowane, a interpreter przeglda
wszystkie bloki ))<, jakie mog by obecne. Jeli znajdzie blok z zadowalajcymi
kryteriami, to ten blok ))< bdzie wykonany. Po wykonaniu wszystkich blokw
" i ))< zgodnie z wyjtkiem, zostaje wykonany blok ".
Jak wygldaj kryteria bloku ))<? Moliwe s dwa przypadki, przedstawione poniej:
/ =J N
oraz
/
F ; ;==J N
W pierwszym przypadku blok ))< pasuje do wszystkich wyjtkw. W drugim przypadku

blok ))< pasuje tylko do wyjtkw, ktre speniaj warunek . Jeli blokw ))< jest
wicej, to pierwszy przypadek wyapie wszystko, podobnie jak warunek &> instrukcji
)<, wic rozsdnie jest umieci go na kocu listy blokw ))<. Zmienna ledzi
wyjtek i w bloku ))< gra rol podobn do parametru funkcji. Blok ))< traktuje zmienn
w sposb bardzo zbliony do tego, jak poniszy skrypt traktuje zmienn -:
F4!
!!.../...6=
J

F/...6**;...G;=
J
"".4. 19 54 .4!54G
N

F/...6**;...6;=
J
"".4. 19 54 .4!546
N
N
Skadnia wyjtkw a if
Kto, kto nigdy nie uywa wyjtkw, moe by bardzo sceptyczny wzgldem skadni, ktra
jest wymagana, aby zadziaay. Najczstsze zastrzeenia do powyszego przykadu s takie:
566

n
Jest bardziej opisowy. Zajmuje wicej wierszy ni zwyke wystpienie ,

wic wymaga te wicej pracy.
Strukturalnie bardzo przypomina pierwszy przykad. W czym jest lepszy?
Jzyk jest obcy. Co jest nie tak ze starym, poczciwym ?
W prostych przykadach istotnie argumenty za wyjtkami s mao przekonujce; kod oparty

na wyjtkach moe by zdecydowanie duszy. Skrypty, ktre po prostu wykonuj cig
niezawodnych operacji, tak naprawd w ogle nie potrzebuj wyjtkw. Bardziej oglna
argumentacja za uyciem skadni wyjtkw jest nastpujca:
n
Skadnia wyjtkw jest bardziej przejrzysta, gdy wiele rzeczy na raz idzie le.
Gdy si do niej przyzwyczaimy, skadnia wyjtkw jest atwiejsza do odczytania,

poniewa uczymy si ignorowa bloki ))<. Bloki ))< to okoo 1% faktycznie
uruchamianego kodu (bdy s rzadkie) i zawieraj 99% nieistotnych szczegw
(naprawianie bdw jest kopotliwe).
Wyjtki s przykadami czystego kodu i dobrego stylu w programowaniu.
Wyjtki s jedn z trzech gwnych funkcjonalnoci obiektw (dwie pozostae to

atrybuty i metody).
Oto przykad pokazujcy, e skadnia wyjtkw pracuje na korzy autora skryptu, a nie
przeciwko niemu:
""5 55425 O.@
3K!6V.O@!8O
.
J
""@
O1!:W 19 5O
.5 !U!
UG/=<
""@
O1!:R 19 5O
.5 !U!
U6/=<
""@
O1!:Y 19 5O
.5 !U!
U?/=<
""@
O1!:R 19 5O
.5 !U!
UR/=<
N
/-.
!:=
J
"".1
!
8:
N
Poniewa instrukcja < natychmiast przerywa wykonanie bloku ", kada funkcja moe
nastpi zaraz po poprzedniej i na pewno pniejsze nigdy nie zostan wykonane. W tym
przypadku zaoszczdzilimy wielu testw przez uycie bloku ". Prosz zwrci uwag,
e funkcje nie musz mie wartoci zwracanej innej ni &, aby mc skorzysta z wyjtkw.
Oprcz tego nie musimy ogranicza si do zgaszania prostych typw. Oto przykad:
"":8
5
. J..U .
!:Z;,4@ 8
;2..U!48.Z6?N<
567
Powysza instrukcja utworzya obiekt o dwch wasnociach i zwrcia go jako zgoszony

element. Z drugiej strony, ponisza instrukcja oczekuje, i wyjtek bdzie obiektem z wasnoci ? , co ewidentnie si stanie, gdy poprzednia instrukcja < bdzie odpowiedzialna za wyjtek:
"". 41 589!.6?
/
F/ ..U!48.**6?==J[N
Wyjtki, zdarzenia i bdy

Czytelnik, ktry eksperymentowa z JavaScriptem w przegldarkach, by moe wie, e istniej zdarzenia wyzwalajce, ktre mog powodowa uruchomienie fragmentw skryptu
JavaScript, zwaszcza gdy dana strona zawiera formularze. Tego typu zdarzenia oglnie nie
s uwaane za wyjtki. Zdarzenia wystpujce jako pewien rodzaj polecenia uytkownika
lub dziaania z sieci, s zjawiskiem normalnym i zwykle obsugiwane s tak samo jak zwyke dane. Wyjtki nie s uwaane za zjawiska normalne i zwykle uywane s do warunkw
bdw, gdy pjdzie le co, co skrypt mg przewidzie (uywajc blokw "01110))<),
lecz nie mog by normalnie obsugiwane.
Czasami mona pomyli zdarzenia z wyjtkami. Powodem jest to, e sposb przygotowania si skryptu do zdarze jest zwykle nieco odmienny od sposobu przyjmowania bardziej
podstawowych polece i danych wprowadzanych przez uytkownika, i moe troch przypomina nietypowo wygldajc obsug wyjtkw. Zdarzenia i wyjtki s jednake od
siebie rne i odrbne. Rozdzia 5., Formularze i dane, da pojcie, jak wygldaj zwyke
zdarzenia, a jeli wrcimy do niego, zobaczymy e nie wspomina o skadni wyjtkw
w JavaScripcie.
Wyjtki mog si przyda dla obiektw macierzystych

Dodatkowy powd wprowadzenia obsugi wyjtkw w JavaScripcie moemy znale
w obiektach macierzystych (wbudowanych obiektw i metod, takich jak obiekt & lub metoda
4)). Bez obiektw macierzystych JavaScript jest niemal bezuyteczny. A gdyby te obiekty
generoway wyjtki w ramach swojego interfejsu atrybut-metoda-wyjtek? W JavaScripcie
musi istnie mechanizm obsugujcy ten typ komunikacji.
Wyjtki mog si przyda przy bdach interpretera

Ze skryptami w JavaScripcie mog dzia si rne bardzo ze rzeczy. Jeli autor skryptu
zrobi literwk w jakim ciemnym kcie duego skryptu, bd taki moe nie zosta wykryty,
dopki skrypt nie zostanie zainstalowany w jakim strategicznym miejscu. Takie jest ryzyko
zwizane z jzykami interpretowanymi.
Jeli interpreter odczyta skrypt i znajdzie ten bd, warto by mg co z tym zrobi, zamiast
zatrzymania caego skryptu. Taki jest przyszy kierunek standardu ECMAScript bdy
pisania skryptu mog by zgaszane jako wyjtki i obsugiwane przez system, ktry uruchamia interpreter JavaScript.
568
Jak pisa kod czysty i bezbdny

Najszybsz metod usuwania bdw w skrypcie jest ...napisanie go tak, aby od razu nie
zawiera bdw. Pisanie czystego kodu jest najlepszym sposobem na unikanie pomyek
przy kodowaniu. Czysty kod oznacza dobr organizacj, samodokumentowanie, wcicia
i komentarze. Poprzedni rozdzia zawiera kilka solidnych wytycznych dotyczcych pisania
czystego kodu.
Kod modularny
Przy pisaniu skryptw w JavaScripcie wana jest jak najbardziej modularna konstrukcja
kodu. Kod modularny jest podzielony na wiele rnych funkcji, z ktrych idealnie kada
wykonuje jedno okrelone zadanie. Modularno kodu redukuje powielanie i ogln zoono skryptu. Nigdy te nie odwouje si bezporednio do zmiennych lub elementw HTML,
lecz przyjmuje je jako dane wejciowe. Jedynymi zmiennymi deklarowanymi w funkcjach s
zmienne lokalne. Zmienne zewntrzne nie s ustawiane bezporednio przez funkcje, lecz przez
warto zwrcon przez funkcj. Mona zaj za daleko z modularyzacj, zwaszcza gdy
zaczynamy pisa skrypty, ktre wykonuj lub powielaj wbudowane funkcje JavaScriptu.
Sprawdzanie istnienia obiektw

Bdy czasu wykonania Brak definicji s bdami chyba najczciej spotykanymi przy
pisaniu kodu w JavaScripcie. Moemy wyeliminowa takie bdy niemal cakowicie,
sprawdzajc czy obiekt istnieje przed prb dostpu do jego wasnoci lub metod. Oglnie
mwic, blok podobny do poniszego powinien by wstawiany gdzie na pocztku skryptu
i (lub) kadej funkcji, w ktrej odwoujemy si do obiektu:
.
J

F/8
5 48 !3K=
J
"" 41:!
!
N
N
/...=
J
"" 4 84:84
N
Techniki uruchamiania
Dla programw w JavaScripcie dostpnych jest wiele skutecznych technik uruchamiania,
od banalnych do wyczerpujcych. Techniki uruchamiania, ktre wykorzystuj nowe okna,
pisanie do biecego dokumentu lub nowego okna oraz alerty powinny by usunite lub
oznaczone jako komentarz przed wprowadzeniem kodu do eksploatacji.
569
JavaScript po stronie klienta

Dla JavaScriptu osadzonego w HTML-u najprymitywniejszym narzdziem uruchomieniowym jest &)1 . Nawet jeli spowoduje zamieszanie w dokumencie HTML, to
przynajmniej da nam jakie informacje zwrotne podczas testowania. W poczeniu z poleceniem & 14 moemy te informacje wysa do innego okna, jeli tego chcemy. Na
przykad:
-.! 0
! *
! !/;;2;! 0
! ;=<! 0
! 4! .
/;0
12
3

;=<
Skrypty JavaScriptu na potrzeby plikw konfiguracji proxy dla poczenia internetowego

oraz dla plikw preferencji w przegldarkach Netscape (np. prefs.js, omwiony w dalszej
czci rozdziau) nie poddaj si uruchamianiu musimy je testowa metod prb i bdw.
Alarmy
Uycie funkcji & 1 , osadzonych w skryptach JavaScript, jest najprostszym sposobem zatrzymania interpretera JavaScript w danym punkcie lub punktach podczas adowania dokumentu. Wiadomo w oknie alarmu moe te zawiera dowolne interesujce nas
dane. Jest to najprostszy sposb na uruchamianie zoonej logiki, zawierajcej mnstwo instrukcji i wywoa funkcji wystarczy doda do podejrzanego odgazienia
funkcji i bdziemy wiedzie czy jest wykonywane, czy nie. Alarmy s te szczeglnie skuteczne w poczeniu z URL JavaScriptu. Poniszy przykad zatrzymuje wykonywanie
skryptu za pomoc alarmu, aby sprawdzi warto zmiennej po kadej instrukcji:
-.# .
!:*;$3K
. ;<
. /# .
!:=<
-.# .
!:I*;2$3K.4:;<
. /# .
!:=<
Konwencja URL javascript:

Po penym zaadowaniu dokumentu HTML funkcja &)1 nie jest ju zbyt przydatna, wbudowane alarmy nie pomog, jeli skrypt zakoczy prac. Notacja URL 5=
) 4>, ktr moemy w kadej chwili wpisa w polu adresu lub lokalizacji w oknie przegldarki, pozwala nam sondowa przegldark i dokument i sprawdzi, jak wyglda
aktualny stan. Poniszy przykad pokazuje URL okna:
1-.
Z. /
! .F=<
Jednake konwencji URL 5

) 4> moemy uywa bardziej oglnie. Przy pewnej
cierpliwoci i ostronoci moemy wprowadzi dowoln ilo JavaScriptu. Poniszy przykad wywietla numery wszystkich elementw pierwszego formularza, posiadajcych wasnoci z wartoci:
1-.
Z-.
<F./
*V<
4! F.\V] ! !: <
II=J. /
=<N
570

Moemy wywoa kad funkcj i metod w przegldarce, ktre s w jaki inny sposb dostpne dla JavaScriptu. Oznacza to, e moemy bezporednio wymusi
formularza,
wykona ))@ dla przycisku lub wywoa dowoln wasn funkcj. Poniszy przykad
usuwa cookie za pomoc popularnej procedury, ktra, jak zakadamy, jest zawarta gdzie
w dokumencie:
1-.
Z $5
/;8
4
?;=<
Rejestrowanie na konsoli Javy

W Netscape Navigatorze 4+, jeli nie chcemy zakci adowania dokumentu, lecz chcemy
zapisa, co zaszo, moemy rejestrowa informacje w konsoli Javy. Moemy obserwowa
konsol podczas adowania dokumentu lub przeanalizowa pniej. Podejcie takie jest
bardzo podobne do &)1 , wystarczy w strategicznych punktach skryptu wstawi instrukcje w rodzaju:
1- !: # 4 .
! !/;' 5! Z;I !=<
Druga wersja nie zapisuje na konsoli znakw koca wiersza:

1- !: # 4 .
! /+
1 +=<
Rejestrowanie w pliku
Jeli rejestrowanie wyjcia na konsoli nie jest wystarczajco trwae, skrypty JavaScript po
stronie klienta mog pisa do plikw na dysku lokalnym testowego komputera. Wystarczy
wyczy w przegldarce zabezpieczenia nie pozwalajce na tego typu zachowanie:
-...*;,5
3895. 4;<
-.E#C*!
-BC81 /;#.

!: E
# C81 ;=<
-.E
*E#C $. A E
/;$ZM..: A ;=<
E
0.

!/..=<
Microsoft Script Debugger

Script Debugger Microsoftu jest imponujcym rodowiskiem uruchomieniowym w stylu
IDE, ktre testuje skrypty na obecno bdw i poprawia je w skryptach napisanych
w dowolnym jzyku skryptowym, obsugujcym ActiveX (JavaScript, VBScript, WSH itp.).
Microsoft Script Debugger wsppracuje cile z Internet Explorerem, dostarczajc kontekstowych informacji uruchomieniowych po napotkaniu bdu w skrypcie. Microsoft Script
Debugger moe te by uywany samodzielnie do tworzenia i uruchamiania skryptw poza
przegldark.
571
Jak zdoby Microsoft Script Debugger

Microsoft Script Debugger moemy pobra za darmo z http://msdn.microsoft.com/scripting/
default.htm?/scripting/debugger/default.htm. Jeli powyszy URL bdzie niepoprawny, otwrz
http://www.microsoft.com/ i szukaj Microsoft Script Debugger.
Program moe by ju zainstalowany, jeli w komputerze jest zainstalowany dowolny
z poniszych:
n
Skadniki Microsoft Visual Studio (Visual Interdev, Visual Basic, Visual C++ itp.).
IIS lub Microsoft PWS.
Windows 2000.
Z powyszymi aplikacjami instalowana jest zaawansowana wersja programu, ktra peni te

same funkcje co wersja podstawowa (dostpna przez URL podany powyej), lecz ma wicej funkcji i nieco inny ukad ekranu. Wszystkie ekrany w niniejszym rozdziale pochodz
z wersji podstawowej 1.0 z IE 6.0, poniewa jest powszechnie dostpna i moe by zainstalowana razem z wersj zaawansowan i dziaa niezalenie od niej.
Jak wczy Microsoft Script Debugger

Po zainstalowaniu najatwiej ustali, czy Microsoft Script Debugger jest wczony poprzez
uruchomienie Microsoft Internet Explorera i kliknicie pozycji Widok z paska menu.
Jeli w rozwijanym menu pojawi si opcja Debuger skryptw, oznacza to, e program jest
ju dostpny. W przeciwnym razie, aby wczy debuger skryptw, kliknij opcj Narzdzia
na pasku menu i wybierz Opcje internetowe.
W oknie Opcje internetowe, ktre si otworzy wybierz zakadk Zaawansowane. Jeli opcja
Wycz debugowanie skryptw pod nagwkiem Przegldanie jest zaznaczona, usu jej zaznaczenie i kliknij OK. Opcja uruchamiania skryptw jest ju wczona. Uwaga: niektre
systemy wymagaj restartu IE, aby zmiana ustawienia przyniosa skutek.
572
Jak uywa programu Microsoft Script Debugger

Zainstalowany i wczony debuggger moemy uy do uruchamiania skryptw sprawiajcych problemy. Do wikszoci przykadw uyjemy poniszego dokumentu, zapisanego
pod nazw VBTrim.html:
Q.

05. !
.:.4
.F #.
84::."
#$%&'()(*+,-#.
+
F4!
!Q.
/ A !4 =
J
""'1
. .
2>4 13

..!1!
11!!5

F/ A !4 !: V=
J
"")

!!15!1 . 3K>4 13
:
-..
* A !4 <
"".44 19 54

/.
48 .
!:/V2G=**++=
J
.
*.
48 .
!:/G2.
!: =<
N
""'5!
44 !15>>4

/.
48 .
!:/.
!: G2.
!: =**++=
J
.
*.
48 .
!:/V2.
!: G=<
N
""L ..
>4
. 4.!.
<
N
""04 5 !

!@!!5
J
. /;'
@!:>4.

;=<
. 4.!F<
N
N
"#$%&
"
CD
C8
!!
1
!9 54
5>4>4Z%%
'&)D&*+ A +!*+ A Q4+

!4 *+84 !+
!$
5*; A Q4 -4*Q.
/ A Q4 -4=;-4*;.
;
"CD
"
573
Czy potrafisz wskaza bd? Wskazwka: jest to bd logiczny, ktry pojawia si tylko
w okrelonych warunkach. Powyszy kod daje nastpujcy wynik w przegldarce:
Jak uruchomi Microsoft Script Debugger

Podobnie jak w wikszoci aplikacji, w programie Microsoft Script Debugger moemy wykonywa zadania w rnoraki sposb. Moemy go uruchomi:
n
Z programu wykonywalnego w katalogu, w ktrym Script Debugger zosta

zainstalowany. W ten sposb zostaje zaadowana nowa, pusta kopia debugera.
Aby dalej uywa programu, musimy otworzy dokument lub utworzy nowy.
Z Internet Explorera przez Widok/Debuger skryptw/Otwrz w pasku menu. W ten

sposb do debuggera adowany jest biecy dokument Internet Explorera (tylko do
odczytu). Moemy te uy opcji Przerwij na nastpnej instrukcji z tego samego
menu. Debuger skryptw zostanie otwarty przy nastpnym uruchomieniu skryptu.
Ze skryptu. Sowo kluczowe & zapisane w skrypcie powoduje otwarcie

programu Microsoft Script Debugger z biecym dokumentem, gdy tylko wykonywanie
skryptu dojdzie do tego wiersza (VBScript stosuje sowo kluczowe
4).
Z komunikatu o bdzie skryptu. Gdy debuger skryptw jest wczony, przy

kadym napotkaniu bdu w skrypcie zobaczymy okno podobne do poniszego,
dajce nam okazj do usunicia bdu:
Znamy ju szereg sposobw uruchomienia programu, wic otwrzmy nasz testowy dokument HTML (patrz powyej) w Internet Explorerze 6. Po otwarciu dokumentu w IE wybierz Widok z paska Menu, a nastpnie Debuger skryptw i Przerwij na nastpnej instrukcji.
Na koniec kliknij przycisk Przytnij (odwieenie strony nie zadziaa w naszym przypadku,
poniewa w chwili zaadowania dokumentu HTML nie s wykonywane adne instrukcje).
Debuger otwiera okno podobne do poniszego, z instrukcj, ktra wywoaa otwarcie debugera podwietlon na to:
574
Teraz jest dobra chwila na to, by objani znaczenie rnych przyciskw i menu, dostpnych w oknie Microsoft Script Debuggera:
Nazwa funkcji
Opis
Ikona
W menu
Run
Zaczyna lub kontynuuje wykonywanie aktualnie

wybranego skryptu lub dokumentu.
Debug
Stop Debugging
Anuluje uruchamianie aktualnie wybranego skryptu

lub dokumentu.
Debug
Break at Next
Statement
Wchodzi do debugera przy wykonaniu nastpnej instrukcji.
Debug
Step Into
Wykonuje nastpn instrukcj.
Debug
Step Over
Pomija nastpn instrukcj.
Debug
Step Out
Wychodzi z biecej funkcji.
Debug
Toggle Breakpoint
Zacza lub wycza punkt kontrolny.
Debug
Clear All Breakpoints Usuwa wszystkie punkty kontrolne.
Debug
Running Documents
Otwiera lub zamyka okno Running Documents (opisane

poniej).
View
Call Stack
Otwiera lub zamyka okno Call Stack (opisane poniej).
View
Command Window
Otwiera lub zamyka okno Command (opisane poniej).
View
575
Okna debugera
Oprcz gwnego okna, ktre jest otwierane przy kadym wywoaniu debugera, dostpne
s jeszcze trzy mniejsze okna, ktre moemy otworzy, dajc wiksz elastyczno narzdzia.
Okno Running Documents

Okno Running Documents wywietla list wszystkich aplikacji mieszczcych dokumenty,
ktre zawieraj aktywne skrypty. Kliknij + obok nazwy aplikacji (np. Internet Explorer),
aby rozwin list uruchomionych aktualnie dokumentw. W poniszym przykadzie w Internet Explorerze otwarte s cztery rne dokumenty .htm.
Kliknij dwukrotnie dokument, aby zaadowa do debuggera skryptw lub kliknij prawym
przyciskiem myszy, aby ustawi punkt kontrolny dla nastpnej instrukcji.
Okno Call Stack

Okno Call Stack wywietla list wszystkich aktualnie uruchomionych wtkw i procedur.
1. Otwrz poniszy dokument HTML (raczej bezsensowny) w IE.
84 !

#$%&
F4!
!4 !$
5/=
J

5/=<
N
"#$%&
"
CD
'&)D&*;84 !;!$
5*;4 !$
5/
=;Q)*;P
5!
1;
"CD
"
2. Wybierz z paska menu IE Widok/Debuger skryptw/Przerwij na nastpnej
instrukcji.
3. Kliknij przycisk Kliknij na stronie WWW.
4. Gdy otworzy si debuger skryptw, kliknij przycisk Call Stack, aby otworzy okno
Call Stack (jeli nie jest ju otwarte).
576

5. W oknie debugera powinno by widoczne podwietlone zdarzenie )@, ktre
wywoao debuger, natomiast okno Call Stack powinno wywietli warto JScript
anonymous function, przypisan do zdarzenia )@:
6. Klikaj przycisk Step Into a do podwietlenia wiersza zawierajcego 1))@.

7. Debuger powinien wyglda teraz jak ekran poniej, z podwietlonym wierszem
1))@A i oknem Call Stack zawierajcym &B)@ (nasz wasn funkcj).
Kada wykonywana instrukcja jest dodawana u gry okna Call Stack. Zostaje usunita po
zakoczeniu wykonywania i zwrceniu sterowania do procedury wywoujcej. Aby przej
do wiersza z instrukcj zawierajc funkcj z okna Call Stack, po prostu kliknij dwukrotnie
ten wiersz. Jeli w uruchomionym dokumencie jest wicej ni jeden wtek, poszczeglne
wtki mog by wybierane z listy rozwijanej.
577
Okno Command
Okno Command wywietla informacje uruchomieniowe oparte na wpisywanych przez nas
poleceniach uruchomieniowych. Na przykad, otwrz VBTrim.html w IE i kliknij Przerwij
na nastpnej instrukcji, wpisz 000 w polu tekstowym (3 spacje i cyfr 5), a nastpnie kliknij
Przytnij. Otwrz okno polece przyciskiem Command Window. Debuger powinien wyglda tak:
Wpisz w oknie polece

(nazw naszej zmiennej) i nacinij Enter. W oknie powinien
pojawi si tekst:
Mwi to nam, e zmienna nie jest zdefiniowana, poniewa ma tylko zasig funkcji, a funkcja ta jeszcze nie zostaa wywoana.
Kliknij kilkakrotnie przycisk Step Into, a do podwietlenia instrukcji:

/.
48 .
!:/V2G=**++=
Przemie kursor do pierwszego wiersza w oknie polece (powinna w nim by zmienna
) i nacinij Enter. Teraz okno polece powinno wyglda tak:
578
Warto
wynosi teraz 000 tak warto przekazalimy. Kliknij jeszcze dwa
razy Step Into, a wrci do pierwszego wiersza <. Ponownie sprawd warto
.
Okno polece powinno teraz wyglda tak:
Pierwsza spacja zostaa usunita i warto

wynosi teraz 00 (dwie spacje i cyfra 5).
Powtrz te same kroki i kliknij jeszcze dwa razy Step Into, a wrcimy do pierwszego wiersza < i sprawd warto
, ktra powinna teraz wynosi 0. Powtrz sekwencj
jeszcze raz. Okno polece powinno teraz wywietla:
Zmienna
zostaa cakowicie pozbawiona spacji z pocztku. Nastpne kliknicie
przycisku Step Into powoduje przejcie do instrukcji <, sprawdzajcej obecno spacji
na kocu acucha, ktrych w naszym acuchu nie ma. Kolejne kliknicie Step Into przeniesie nas do instrukcji . Kliknij przycisk Stop Debugging i sprawd wyniki przejcia
przez kod za pomoc debuggera w oknie IE, w ktrym strona jest otwarta. Warto w polu
tekstowym zostaa z powodzeniem przycita.
Ustawianie punktw kontrolnych

Punkty kontrolne (breakpoint) s skutecznym narzdziem zatrzymywania wykonywania
skryptu po osigniciu okrelonego punktu. Na przykad, otwrzmy debugger z naszym dokumentem VBTrim.html, tym razem przez umieszczenie sowa kluczowego & bezporednio przed instrukcj funkcji:
579
#$%&'()(*+,-#.
+
84::.<
F4!
!Q.
/ A !4 =
J
Otwrz teraz dokument w IE. Debugger uruchamia si od razu (z podwietlon instrukcj

& ), poniewa instrukcja & ma zasig globalny i nie jest zamknita w funkcji.
Dziki temu jest wykonywana przy zaadowaniu strony.
Ustawmy teraz punkty kontrolne. Umie kursor w wierszu 0
i kliknij przycisk Toggle Breakpoint. Okno debugera powinno teraz wyglda tak:
Debuger podwietla punkt kontrolny na czerwono. Nastpnym krokiem bdzie kliknicie

przycisku Run na pasku zada debugera, co zwraca sterowanie do IE. Wr do dokumentu
w IE i wpisz 9 w polu tekstowym. Kliknij przycisk Przytnij. Debuger uruchamia si ponownie, lecz tym razem zatrzyma si na wierszu, w ktrym ustawilimy punkt kontrolny
(zobacz rysunek na nastpnej stronie).
Ustawianie punktw kontrolnych pozwala zatrzyma wykonywanie skryptu w dowolnym
punkcie. Dziki temu moemy atwo znajdowa miejsca wystpowania bdw i ledzi
wartoci zmiennych w kadej instrukcji.
Aby usun punkty kontrolne, umie kursor w wierszu, z ktrego chcesz usun punkt
kontrolny i kliknij przycisk Toggle Breakpoint. Aby usun wszystkie punkty kontrolne, uyj
przycisku Clear All Breakpoints (w tym przypadku pooenie kursora nie gra roli).
Krokowe wykonanie kodu

Microsoft Script Debugger umoliwia stosunkowo bezbolesne wykonywanie kodu krok po kroku. Przycisk Step Into (ktrego uywalimy przed chwil) pozwala uytkownikowi wykona
580
nastpn wzgldem kursora instrukcj skryptu. Aby to zilustrowa, zaadujmy ponownie do IE

dokument VBTrim.html (z instrukcj & wci obecn na pocztku skryptu). Ponownie otworzy si debuger z podwietlonym wierszem & A.
Aby zacz wykonywa skrypt krokowo, kliknij przycisk Step Into. Sterowanie wykonaniem zostaje zwrcone do IE, poniewa skrypt czeka na dane wejciowe. Wpisz 0
0
(spacja, s, spacja) jako warto i kliknij Przytnij. Debuger podwietli teraz wywoanie
funkcji, spowodowane zdarzeniem )@ przycisku w dokumencie HTML. Jeli bdziemy
dalej klika przycisk Step Into, skrypt wykona si i zwrci podane wyniki do przegldarki.
Lecz co bdzie, jeli ju na pocztku stwierdzimy, e dana procedura nie jest powodem
bdu? Czy jest jaki sposb, eby po prostu wykona pozostae instrukcje w procedurze
i wrci do nastpnej instrukcji? Odpowied brzmi tak za pomoc funkcji debugera
Step Out i Step Over. Aby to zademonstrowa, bdziemy musieli zmodyfikowa dokument
VBTrim.html. Zmienimy go tak, aby osobna funkcja obcinaa spacje na pocztku acucha
i osobna funkcja spacje na kocu. Wobec tego plik VBTrim.html bdzie wyglda nastpujco:
Q.

05. !
.:.4
.F #.
84::."
#$%&'()(*;,-#.
;
84::.<
F4!
!Q.
/ A !4 =
J
""'1
. .
2>4 13

.
"".!1!
11!!5Z

F/ A !4 !: V=
J
"")

!!95!9! . 3K>4 13
:
-..
* A !4 <
""0 41F4!51 .

!:#>4
581
"" 13
:
.
* .

!:#/.
=<
""0 41F4!51 .
.

!:#>4
"" 13
:
.
* .

!:#/.
=<
"" .OK5 O! .
!:
. 4.!.
<
N
""04 5 !

!@!!5
J
. /;'
@!:>4.

;=<
. 4.!F<
N
N
F4!
! .

!:#/
!:=
J

/
!: 48 .
!:/V2G=**++=
J

!:*
!: 48 .
!:/G2
!: !: =<
N
. 4.!
!:<
N
F4!
! .
.

!:#/.

!:=
J

/.
48 .
!:/.
!: G2.
!: =**++=
J
.
*.
48 .
!:/V2.
!: G=<
N
. 4.!.

!:<
N
"#$%&
"
CD
C8
!!
1
!9 54
5>4>4Z8.8.

!4 *; A ;!*; A Q4;

!4 *;84 !;
!$
5*; A Q4 -4*Q.
/ A Q4 -4=;-4*;&. !
1;
"CD
"
Otwrz zmieniony dokument w IE. Script Debugger powinien uruchomi si od razu, z instrukcj & podwietlon na to. Kliknij przycisk Step Into raz, wpisz 0
4)50 do
pola tekstowego i kliknij przycisk Przytnij. Zostanie podwietlone zdarzenie )@. Kliknij
teraz 4 razy przycisk Step Into, tak by debuger przeszed do wntrza funkcji /&4)
(zobacz pierwszy rysunek na nastpnej stronie).

W tym punkcie debuger wyszed z funkcji (B i wszed do funkcji /&4=
)
. Na potrzeby dyskusji zamy, e ta funkcja jest w porzdku. Aby wydosta si
z niej, a jednak wykona j, uyjemy przycisku Step Out. Pozwoli to na dokoczenie wykonywania biecej procedury i przejcie do nastpnej instrukcji procedury wywoujcej
funkcje ((B ). Debuger powinien teraz przej do nastpnego wiersza funkcji (B
( 4)
) (zobacz drugi rysunek na nastpnej stronie).
582
Ponownie zamy, e funkcja 4)

nie zawiera bdw. Wykonamy funkcj uywajc przycisku Step Over, dziki czemu nie bdzie wykonywana krokowo wiersz
po wierszu. Przycisk Step Over, podobnie jak Step Out, wrci nas do nastpnej instrukcji
procedury wywoujcej (zobacz pierwszy rysunek na nastpnej stronie).
Przyciski Step Out i Step Over pozwalaj nam zaoszczdzi czas, dziki temu, e nie musimy przechodzi kadego wiersza funkcji wywoanej przez gwn procedur. Jeli mamy
pewno, e okrelona funkcja nie zawiera bdu, przeskoczymy wywoanie funkcji. Jeli
chcemy przetestowa warto wewntrz funkcji, lecz nie ca funkcj, wejdziemy do niej
a do instrukcji, w ktrej warto jest ustawiana, sprawdzimy warto za pomoc okna polece i wyjdziemy z funkcji.
583
Zakadki
Zakadki pozwalaj nam atwo wraca do okrelonych wierszy kodu. Gdy dojdziemy do
wiersza, ktry chcemy oznaczy zakadk, wystarczy nacisn Ctrl+F2. Debuger oznaczy
taki wiersz jak poniej:
Aby przej do nastpnej zakadki, nacinij F2. Aby przej do poprzedniej, nacinij
Shift+F2. Aby usun zakadk, nacinij Ctrl+F2.
wiczenie
Omwilimy gwne funkcje programu Microsoft Script Debugger, wic pora zastosowa t
wiedz w praktyce. Wemy na przykad dokument VBTrim.html (wersj z trzema funkcjami).
584

Nasi fikcyjni uytkownicy zgosili, e strona VBTrim.html umieszcza w polu tekstowym
sowo
po kadym naciniciu przycisku. Pierwsze, co zrobimy jako programici, to zaadujemy stron do debugera. Nastpnie za pomoc okna Command Window wprowadzimy
do funkcji warto, ktra przetestuje wikszo funkcji, na przykad acuch ze spacj na
pocztku, nastpnie kilkoma innymi znakami i spacj na kocu. W ten sposb przetestujemy
wszystkie instrukcje poza
.
Poniewa nie znalelimy adnej anomalii za pomoc tego acucha wejciowego, musimy
wygenerowa dane wejciowe, ktre pozwol przetestowa instrukcj
pusty acuch (%41<00;). Widzimy teraz, e instrukcja zwraca acuch
do
pola tekstowego. Aby naprawi bd, powinnimy usun instrukcj lub zwrci
acuch wejciowy.
Netscape JavaScript Console

Netscape udostpnia JavaScript Console jako narzdzie wspomagajce uruchamianie JavaScriptu. Konsola wywietla list wszystkich bdw, wygenerowanych przez aktualnie
otwarty dokument. JavaScript Console dziaa podobnie jak Command Window ze Script
Debuggera Microsoftu: pozwala wprowadza polecenia JavaScriptu i wywietla wyniki.
Jak otworzy konsol

Wpisanie 5
) 4> w pasku adresu Netscape Navigatora 4.x otwiera konsol JavaScriptu, ktra wyglda nastpujco:
Aby otworzy konsol JavaScriptu w Netscape 6, z menu Tasks wybierz Narzdzia/JavaScript

Console (lub wpisz 5
) 4> w pasku adresu, jak poprzednio).
Konsola JavaScriptu w Netscape 6 wyglda nastpujco:
585
Obliczanie wartoci wyrae za pomoc konsoli

Wprawdzie Netscape JavaScript Console przypomina okno polece Microsoft Script Debuggera pod tym wzgldem, e pozwala nam oblicza pojedyncze wyraenia JavaScriptu,
lecz rni si tym, e nie pozwala na interakcj z kodem zaadowanym do przegldarki. Na
przykad, zaaduj poniszy kod do przegldarki NN 4.x:
.

#$%&
-.
*?<
"#$%&
"
"
Nastpnie otwrz konsol JavaScriptu i wpisz w polu tekstowym javascript typein.
Wygeneruje to bd:
Powoduje go fakt, e konsola w ogle nie daje interakcji z kodem na stronie. Aby oddziaywa wzajemnie z tym kodem, moemy uy URL 5
) 4> w pasku adresu przegldarki, na przykad 5
) 4> .
Aby wygenerowa waciwe wyniki za pomoc konsoli, musimy odtworzy cay skrypt lub
jego sekcj, niezbdn, aby otrzyma podany efekt.
586
Wywoanie konsoli przy bdach

W przypadku przegldarek Netscape 4.06 i nowszych (z wyjtkiem wersji 6+) moemy
osign za pomoc skryptw taki efekt, e JavaScript Console bdzie pojawia si za kadym razem, gdy strona natknie si na bd. Aby zaprogramowa t funkcjonalno, musimy
zmieni plik preferencji uytkownika prefs.js, pooony w katalogu instalacyjnym Netscape
w Users, a nastpnie User Name (lub default), na przykad:
$ZM&.:.E
M' M).MF4 M.F 1
Otwrz plik prefs.js w dowolnym edytorze tekstowym. Trzeba doda nastpujcy wiersz na
kocu pliku:
4.U.F/;1-.
! !U!U...;2 .4=<
Aby zmiany odniosy skutek, plik naley zapisa i zamkn, a nastpnie ponownie uruchomi
Netscape.
Funkcjonalno automatycznego otwierania konsoli w razie bdu obecnie nie jest zaimplementowana w Netscape 6.
Ustawianie punktw kontrolnych

Wprawdzie JavaScript Console nie pozwala interaktywnie przej przez skrypt krok po
kroku, lecz udostpnia punkty kontrolne (watch point), ktre pomagaj ledzi wartoci
zmiennych w skrypcie. Punkty kontrolne uywaj do ledzenia wasnoci obiektw metod
)< i )<.
Metoda )< przyjmuje dwa parametry: nazw obserwowanej wasnoci i nazw funkcji,
ktra ma zosta wykonana przy jej zmianie. Gdy podana wasno ulega zmianie, wwczas
metoda )< przekazuje nazw wasnoci oraz wartoci poprzedni i biec do podanej
funkcji.
Prosz zwrci uwag, e funkcja musi zwrci biec warto wasnoci, w przeciwnym
razie wasno stanie si niezdefiniowana.
Metoda )< przyjmuje nazw wasnoci jako parametr i po prostu koczy ledzenie
zmian tej wasnoci.
Poniszy skrypt demonstruje uycie metod )< i )<. Skrypt ten obserwuje warto wasnoci "C51" 4, dopki licznik nie osignie wartoci .

!

#$%&
F4!
! $!:/.'2 Q2
Q=
J
4! .
/+C81 +I.'I+!:F.8+I QI
+"8 8+I
QI+"88.+=<
. 4.!
Q<
587
N
-.C81*! C81 <
C81 /+&.+2 $!:=<
F./-.
*G<
*W<
II=
J
C81 &.*

F/
**?=
J
C81 4! /+&.+=
N
N
"#$%&
"
"
Wynik dziaania skryptu jest nastpujcy:
Podsumowanie
Poniewa JavaScript jest jzykiem interpretowanym o lunej kontroli typw, bdy s czsto zgaszane bez szczegowych objanie, co poszo nieprawidowo. Istnieje mnstwo
sposobw sondowania zachowania danego skryptu, od prostych interaktywnych zapyta a
po pene graficzne rodowiska uruchomieniowe. Proste techniki s czsto wystarczajce,
aby wyszuka najpowszechniejsze przyczyny problemw. W przypadku pozostaych musimy zaakceptowa fakt, e wygoda jzyka interpretowanego z jednej strony daje nam elastyczno, lecz z drugiej nakada na autora skryptw obowizek szczeglnej starannoci.
W niniejszym rozdziale omwilimy:
n
Trzy rne typy bdw JavaScriptu: skadniowe, wykonania i logiczne.
Cz powszechnie spotykanych bdw JavaScriptu.
Korzystanie z wyjtkw.
Kilka podstawowych technik uruchomieniowych.
Microsoft Script Debugger.
Netscape JavaScript Console.
588

Po ukoczeniu lektury i zastosowaniu technik omwionych w tym rozdziale Czytelnik powinien mc cakiem efektywnie usuwa bdy ze swoich skryptw. Postpowanie zgodnie
ze wskazwkami omwionymi w tym i poprzednim rozdziale powinno prowadzi do popeniania mniejszej liczby bdw. Nawet jeli nie wszystkie informacje w tym rozdziale
byy dla Ciebie nowoci, mamy nadziej, e posuyy jako dobre repetytorium tematu.

JavaScript. Zaawansowane Programowanie

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

JavaScript. Zaawansowane Programowanie

Uploaded by

Copyright:

Available Formats

IDZ DO

Podstawowe programowanie w JavaScripcie

Rozdzia 1. JavaScript, przegldarki i Sie............................................................................................. 29

Rozdzia 2. Rdze jzyka JavaScript ....................................................................................................... 53

JavaScript. Zaawansowane programowanie

Rozdzia 3. Techniki programowania obiektowego i JavaScript...........................................................101

Rozdzia 4. Okna i ramki ...........................................................................................................................143

Kod rnych okien ................................................................................................. 176

Rozdzia 5. Formularze i dane..................................................................................................................185

Rozdzia 6. Multimedia oraz moduy rozszerzajce.............................................................................227

JavaScript. Zaawansowane programowanie

Rozdzia 7. XML i XHTML..........................................................................................................................275

Rozdzia 8. Kaskadowe arkusze stylw i JavaScript ..........................................................................307

Sterowanie czcionk ................................................................................................... 341

JavaScript. Zaawansowane programowanie

Rozdzia 10. Dynamiczny HTML................................................................................................................447

Cz III Strategie programowania

Rozdzia 11. Wybieranie narzdzi ...........................................................................................................489

Rozdzia 12. Praktyka dobrego kodowania.............................................................................................519

Czysto i prosta ........................................................................................................ 526

Rozdzia 13. Obsuga bdw, uruchamianie, rozwizywanie problemw..........................................547

Cz IV Rady, triki i techniki

Rozdzia 14. Prywatno, bezpieczestwo i cookies .............................................................................591

JavaScript. Zaawansowane programowanie

Rozdzia 15. Wyraenia regularne .........................................................................................................629

Rozdzia 16. Zatwierdzanie formularza .................................................................................................667

Rozdzia 17. Dynamiczne strony WWW ...................................................................................................715

Elementy nawigacji...................................................................................................... 747

Rozdzia 18. Filtry Internet Explorera ....................................................................................................777

Rozdzia 19. Rozszerzanie obiektw standardowych i obiektw przegldarek..................................811

JavaScript. Zaawansowane programowanie

Cz V Studium konkretnych przypadkw

Rozdzia 20. Konsola audiowizualna BBC News .....................................................................................855

Rozdzia 21. Teleks BBC News .................................................................................................................897

Nawigacja poprzez DOM ......................................................................................... 911

Rozdzia 22. Koszyk na zakupy...............................................................................................................923

Rozdzia 23. Drzewo genealogiczne.......................................................................................................979

Cz VI Biece kierunki rozwoju JavaScriptu

Rozdzia 24. ECMAScript 4 .................................................................................................................... 1025

JavaScript. Zaawansowane programowanie

Rozdzia 25. .NET, usugi web, JScript.NET i JavaScript..................................................................... 1053

Dodatek A Funkcje, instrukcje i operatory........................................................................................... 1081

Dodatek B Obiekty, metody i wasnoci................................................................................................ 1095

Obiekty specyficzne dla implementacji: Microsoft ........................................................ 1117

Dodatek C Typy danych i konwersje typw.......................................................................................... 1123

Dodatek D Obsuga zdarze ................................................................................................................... 1129

Dodatek E Sownik CSS ........................................................................................................................... 1153

Dodatek F Model DOM .............................................................................................................................. 1171

Skorowidz ................................................................................................................................................ 1181

Obsuga bdw, uruchamianie,

Typy bdw w JavaScripcie

Cz III n Strategie programowania

Bdy czasu adowania

Po zaadowaniu powyszego kodu do IE 6 (gdy debuger jest wyczony a powiadamianie

Aby wyczy odpluskwianie skryptw i wczy powiadamianie w bdach skryptw w IE:

Rozdzia 13. n Obsuga bdw, uruchamianie, rozwizywanie problemw

6. Zaznacz opcj Wywietl powiadomienie o kadym bdzie skryptu.

Netscape 6 generuje podobny bd na konsoli JavaScriptu (Tasks/Tools/JavaScript Console).

Bdy czasu wykonania

Cz III n Strategie programowania

Obie przegldarki informuj uytkownika, e zmienna

Ten skrypt generuje nastpujce bdy:

Rozdzia 13. n Obsuga bdw, uruchamianie, rozwizywanie problemw

Definicja jawna wykorzystuje sowo kluczowe :

Instrukcja nie zawiera zamykajcego nawiasu klamrowego i wywouje nastpujcy bd:

W wierszu mamy ( bez nawiasw, wic wystpi nastpujcy bd:

Naley zwrci uwag, e

Plus (*) powinien znale si pomidzy +, + i .

W tym przykadzie zmienna jest deklarowana z wartoci -. W drugim wierszu warto

Wyniki w ramce ostrzegawczej s zasadniczo prototypem metody /

F/.4 *; :.!;=

W tym przykadzie nie wygramy nigdy. Rami

F/.4 *; :.!;=

Uwaga na problem pustego znaku w przegldarkach Netscape. Warto +%%%:;;;"""+1<

F/-%4 **;.5O 4.95

W tym skrypcie zmienna

Jeli w funkcji (lub w dowolnym bloku kodu) dotrzemy do instrukcji < ,

W pierwszym przypadku blok ))< pasuje do wszystkich wyjtkw. W drugim przypadku

Jest bardziej opisowy. Zajmuje wicej wierszy ni zwyke wystpienie ,

Jzyk jest obcy. Co jest nie tak ze starym, poczciwym ?