659

23

              Tworzenie skryptów w języku JavaScript

Rozdział 19.

Tworzenie skryptów w języku JavaScript

W kilku poprzednich rozdziałach poznałeś sposoby wzbogacania tworzonych stron WWW o dodatkowe metody interakcji, takie jak mapy graficzne, formularze oraz skrypty CGI. Wszystkie te narzędzia, z wyjątkiem map graficznych, są dostępne w najnowszych prze­glądarkach, dzięki czemu będziesz mógł ich spokojnie używać, bez zbytniego przejmowa­nia się o zachowanie kompatybilności. Jednakże stosowanie ich ma także swoją cenę: wy­maga­ją one bowiem kontaktu z serwerem WWW, na przykład, do przetworzenia skryptu, i jako takie nie są najlepszym rozwiązaniem przy tworzeniu wielu typów prezen­tacji.

W tym oraz w kilku następnych rozdziałach poznasz nowe narzędzia wzbogacające możli­wości samej przeglądarki i pozwalające na tworzenie interesujących interaktywnych prezen­tacji, które nie bazują na programach CGI wykonywanych na serwerze. Pierwsze z tych na­rzę­dzi zostanie przedstawione w tym rozdziale; są to skrypty pisane w języku JavaScript.

Język JavaScript, wcześniej nazywany także LiveScirpt, jest językiem programowania słu­żącym do dodawania nowych możliwości funkcjonalnych do dokumentów HTML. Skrypty napisane w tym języku umieszczane są bezpośrednio w dokumentach HTML i wykonywane przez przeglądarkę. JavaScript jest nowością wprowadzoną przez firmę Netscape; zyskała ona już aprobatę i poparcie wielu innych organizacji oraz firm. W różny sposób, język ten dostęp­ny jest aktualnie w kilku różnych przeglądarkach, między innymi, w Netscape Navi­gatorze oraz Microsoft Internet Explorerze.

Podobnie jak znaczna większość technologii używanych na Internecie, a w szczególności na WWW, także i język JavaScript jest cały czas modernizowany i rozszerzany. Prze­szedł on błyskawicznie od wersji 1.0, dostępnej w Netscape Navigatorze 2, poprzez wersję 1.1 w Nawigatorze 3 i wersję 1.2 w Navigatorze 4, aż do wersji 1.3 w Navigatorze 4.5. W tym sa­mym czasie firma Microsoft stworzyła swoją własną wersję języka JScript, która dostępna jest w Microsoft Internet Explorerze 3 i 4. Wszystkie wersje różnią się od siebie drobny­mi szczegółami. W rozdziale tym nie będziemy zajmowali się różnicami między po­szczególny­mi implementacjami i wersjami języka; zamiast tego skupimy się na jego podsta­wowych cechach, wspólnych dla wszystkich implementacji.

W tym rozdziale poznasz podstawowe zagadnienia dotyczące języka JavaScript, takie jak:

n               czym jest JavaScript,

n               dlaczego miałbyś używać tego języka,

n               znacznik <SCRIPT>,

n               podstawowe polecenia oraz konstrukcje języka,

n               przykłady prostych programów napisanych w języku JavaScript.

Przedstawienie języka JavaScript

Zgodnie z oświadczeniem prasowym, opublikowanym wspólnie przez firmę Netscape Communications oraz Sun Microsystems, JavaScript jest „łatwym do użycia obiektowym języ­kiem skryptowym, zaprojektowanym do tworzenia aplikacji łączących obiekty i zasoby zarów­no w przeglądarce użytkownika, jak i na serwerze WWW. JavaScript stworzony zos­tał z myślą o autorach stron WWW oraz twórcach aplikacji firmowych, w celu umożliwie­nia im dynami­cznego opisu zachowania obiektów uruchamianych w przeglądarkach oraz na serwerach WWW”.

Mówiąc najprościej jak można, powyższy opis oznacza, że za pomocą języka JavaScript możesz dodać do tworzonych stron WWW nowe możliwości funkcjonalne, które w prze­szłości wymagały zastosowania skomplikowanych programów CGI uruchamianych na ser­we­rze. Pod wieloma względami JavaScript przypomina język Visual Basic, przyjazny dla użyt­kownika język programowania opracowany przez firmę Microsoft.  Nawet, jeśli nie po­siadasz żadnego doświadczenia programistyczne­go, będziesz mógł wykorzystywać JavaScript do two­rzenia skomplikowanych aplikacji działających na stronach WWW.

Czynnikiem, który powoduje, że JavaScript to wyjątkowy język, jest sposób, w jaki został zintegrowany ze stronami WWW. Programy w nim pisane nie są prze­chowywane w odrębnych plikach, tak jak programy CGI, lecz zapisywane bezpośrednio wewnątrz stron WWW, podobnie jak znaczniki i obiekty HTML. Innymi słowy, programy JavaScript osadzane są wewnątrz dokumentów HTML. Ponadto, w odróżnieniu od pro­gra­mów CGI, które są wykonywane przez serwer WWW, programy napisane w języku JavaScript wykonywane są bezpośrednio przez samą przeglądarkę. Dzięki temu są one łatwe do przenoszenia i mogą być wykonywane przez wszystkie przeglądarki, które są w stanie obsługiwać progra­my napisane w tym języku, niezależnie od typu komputera oraz systemu operacyjnego.

Dlaczego miałbyś używać języka JavaScript?

Odpowiedź na to pytanie zależy w pewnym stopniu od możliwości, jakich dostarcza język JavaScript. Wraz z rozwojem JavaScript oraz technologii pokrewnych, skrypty pisane w tym języku uzyskują możliwość kontroli wszelkich aspektów stron WWW i formularzy oraz bezpośredniej komunikacji z wyświetlanymi pluginami i apletami.

Podstawowe, najprostsze, możliwości JavaScriptu pozwalają na wykonywanie w przeglądarce wielu prostych (oraz całkiem skomplikowanych) progra­mistycznych zadań, które wcześniej można było rozwiązać tylko i wyłącznie za pomocą prog­ramów CGI wykonywanych na serwerze. Prócz tego, JavaScript umożliwia weryfikację poprawności danych wprowadzanych przez użytkowników w for­mula­rzach. W końcu, w połączeniu z zastosowaniem ramek, JavaScript daje bardzo szero­kie możliwości tworzenia nowych metod prezentacji dokumentów na WWW.

Łatwość użytkowania

W odróżnieniu od języka Java, JavaScript został zaprojektowany z myślą o osobach, które nie miały wcześniej nic wspólnego z programowaniem. Jako taki, JavaScript jest względnie łatwy w użyciu i o wiele mniej wymagający, jeśli chodzi o precyzyjne stosowanie typów zmiennych. Co więcej, nie musisz kompilować kodu programów pisanych w języku JavaScript przed ich użyciem; jest to cecha, której nie posiada bardzo wiele innych języków programowania, włącznie z Javą. Pomimo to, JavaScript wciąż jest językiem trud­niejszym do opanowania od języka HTML (choć z drugiej strony, jest on znacznie prostszy od Javy). Osoba bez żadnego przygotowania programistycznego może używać języka JavaScript do tworzenia bardzo pros­tych programów, takich jak przedstawione w tym rozdziale. Bardziej skomplikowane zastoso­wania będą wymagały poznania głównych pojęć i technik programi­stycznych.

Polepszanie efektywności serwera

Wraz ze wzrostem liczby użytkowników WWW, coraz więcej najpopularniejszych serwe­rów zbli­ża się do granicy swoich możliwości przetwarzania. W związku z tym, większość operatorów WWW szuka nowych sposobów zredukowania obcią­żenia ich systemów oraz uniknięcia kosztownego unowocześniania posiadanych komputerów. Takie właśnie były po­wody stworzenia map graficznych obsługiwanych przez przeglądarki (omówionych w roz­dzia­le 16. „Tworzenie i stosowanie map odsyłaczy”).

Wraz z pojawieniem się języka JavaScript twórcy stron WWW zyskali nowe możliwości. Załóżmy, że stworzyłeś formularz do wprowadzania szczegółowych informacji potrzebnych do działania Twojego systemu zamówień. Gdy formu­larz zostaje wysłany, program CGI musi w pierwszej kolejności sprawdzić otrzymane infor­macje i upewnić się, czy wszystkie pola for­mularza zostały poprawie wypełnione. Między innymi skrypt będzie musiał sprawdzić, czy zo­stało podane nazwisko osoby zamawiającej, wybrana została metoda płatności, czy podano numer karty kredytowej, itp.

Co się stanie, gdy Twój program CGI odkryje, iż brakuje bardzo istotnych informacji? W takim wypadku będziesz musiał poinformować użytkownika o zaistniałych problemach oraz poprosić go o ponowne wypełnienie i przesłanie formularza. Taki proces wymaga uży­cia wielu zasobów po stronie serwera (wykonanie każdego programu CGI wy­maga wolnej pa­mięci operacyjnej oraz czasu procesora), jak również czasochłonnego nawiązywania po­łączeń sieciowych między klientem a serwerem.

Dzięki przeniesieniu wykonania wszystkich czynności sprawdzających poprawność przesy­łanych danych na stronę przeglądarki, co jest możliwe w skryptach pisanych w języku JavaScript, można uniknąć konieczności wielokrotnego przesyłania danych do serwera (gdyż tylko jeden komplet poprawnych danych zostanie przesłany). To rozwiązanie ma także korzystny wpływ na efektywność pracy serwera, ponieważ program CGI nie musi już sprawdzać poprawności danych, co umożliwia zmniejszenie zasobów systemowych pot­rzeb­nych do wykonania programu.

JavaScript a dostawcy usług internetowych

Wielu dostarczycieli usług internetowych, z powodu konieczności zapewnienia odpowied­nie­go poziomu bezpieczeństwa systemu, wprowadza bardzo poważne ograniczenia możli­wości skryptów CGI. Dzięki zastosowaniu skryptów JavaScript da się odzyskać wiele z ut­raconych w ten sposób możliwości. Zastosowanie skryptów umożliwia bowiem wykonanie w przeglą­darce wielu czynności wykonywanych uprzednio na serwerze.

Znaczna większość dostarczycieli usług internetowych umożliwia stosowanie prostych skryp­tów CGI, na przykład skryptów, które pobierają dane przesyłane z formula­rza i zapi­sują je w pliku dyskowym lub przesyłają do właściciela węzła. Jednakże, w przy­padku ko­nieczności zastosowania bardziej skomplikowanego przetwarzania danych, niejed­nokrotnie trzeba było zmieniać dostawcę usług internetowych lub nawet „stawiać” własny ser­wer. Teraz jed­nak, dzięki użyciu skryptów JavaScript, nie będzie już mowy o takich proble­mach.

Posłużenie się skryptami służącymi do obsługi danych z formularzy, dostarczanych przez Twojego dostawcę usług internetowych wraz z procedurami JavaScript w stronach WWW, umożliwi pełną obsługę formularzy nawet na najbardziej zabezpieczanych serwerach WWW. Co więcej, po wprowadzeniu pełnej integracji pomiędzy Javą, JavaScriptem oraz dodatkami rozszerzającymi możliwości przeglądarek, będziesz mógł wykonywać w stro­nach WWW czynności, o których nigdy Ci się nie śniło i których nawet najlepsze progra­my CGI nie były w stanie wykonać.

Znacznik <SCRIPT>

Aby umożliwić umieszczanie programów napisanych w języku JavaScript na stronach WWW, firma Netscape zaproponowała wprowadzenie nowego znacznika — <SCRIPT>. Umiesz­czając ten znacznik wewnątrz dokumentu HTML, instruujesz przeglądarkę, aby kolejne linie dokumentu traktowała jako skrypt, a nie jak normalny kod HTML. Kod do­kumentu trakto­wany jest jako skrypt aż do momentu napotkania znacznika </SCRIPT>; zawar­tość dokumentu umieszczona po tej etykiecie będzie traktowana jako kod źródłowy strony.

Jeśli znacznik <SCRIPT> użyty jest wewnątrz dokumentu HTML, to musi on posiadać atry­but LANGUAGE, deklarujący użyty język skryptowy. Aktualnie można stosować jedynie dwie wartości tego atrybutu: LANGUAGE="LiveScript" lub LANGUAGE="JavaScript". Nazwa „LiveScript” pochodzi z czasów, gdy firma Netscape rozpoczynała tworzenie języka JavaScript. Wraz z pojawieniem się przeglądarki Netscape Navigator 2.0, pierwszej wersji umożliwiającej wykonywanie skryptów, nazwa języka została oficjalnie zmieniona na JavaScript. Dlatego też aktualnie używanie atrybutu LANGUAGE="LiveScript" nie jest zale­cane.

Struktura skryptów pisanych w języku JavaScript

Umieszczając skrypty JavaScript w kodzie dokumentów HTML, oprócz użycia znacznika <SCRIPT>, powinieneś przestrzegać także kilku dodatkowych zasad.

n               Pamiętaj, aby znacznik <SCRIPT> umieszczać pomiędzy znacznikami <HEAD> i </HEAD> na początku dokumentu, a nie pomiędzy znacznikami <BODY> i </BODY>. Nie jest to wymóg obowiązkowy, lecz raczej udogodnienie wynikające z tego, iż kod skryptów nie powinien być widoczny jako treść strony WWW, a tak byłby on traktowany w przypadku umieszczenia znacznika <SCRIPT> wewnątrz znaczników <BODY>. Kod skryptów powinien być umieszczany w nagłówku dokumentu wraz ze wszelkimi innymi znacznikami informacyjnymi i kontrolnymi, takimi jak <META> i <TITLE>.

n               Starsze przeglądarki, które nie potrafią wykonywać skryptów JavaScript, będą próbowały traktować ich kod jako normalny kod HTML. Dlatego też umieszczaj cały kod skryptów wewnątrz komentarzy: <!-- i -->. Jest to niesłychanie istotne. Takie postępowanie zagwarantuje, iż kod skryptu nigdy i w żadnej przeglądarce nie będzie wyświetlany jako treść strony.

n               W odróżnieniu od języka HTML, w którym komentarze umieszczane są wewnątrz znaków: <!-- oraz -->, wewnątrz skryptów JavaScript komentarze rozpoczynają się od znaków: //. Wszystkie linie skryptu, które rozpoczynają się od tych znaków, będą traktowane jako komentarz i pomijane.

Uwzględniając wszystkie powyższe reguły, struktura strony WWW zawierającej skrypty JavaScript, powinna mieć następującą postać:

<HTML>

<HEAD>

<TITLE>Przykładowy skrypt w Javie</TITLE>

<SCRIPT LANGUAGE="JavaScript">

<!-- Użyj znacznika początku komentarza, by ukryć kod JavaScript

// Tutaj rozpoczyna się kod JavaScript

// zamknij znacznik komentarza w linii bezpośrednio przed znacznikiem </SCRIPT> -->

</SCRIPT>

</HEAD>

<BODY>

  Tu wstaw swój dokument

</BODY>

</HTML>

Atrybut SRC

Oprócz atrybutu LANGUAGE znacznik <SCRIPT> może posiadać jeszcze jeden atrybut — SRC. Użycie go pozwala na zastosowanie wewnątrz strony WWW skryptu zapisanego w zupełnie innym, niezależnym pliku. Ta możliwość jest bardzo przydatna, gdy kilka stron WWW korzysta z tego samego skryptu JavaScript oraz, gdy nie chcesz umieszczać kodu tego skryptu we wszystkich stronach.

Gdy będziesz chciał użyć tego atrybutu, znacznik <SCRIPT>...