1. Instrukcja document.write
Nasz pierwszy skrypt będzie wypisywał na ekranie tekst. Posłużymy
się do tego instrukcją document.write. Document jest to obiekt
JavaScript, który reprezentuje aktualnie wyświetlaną stronę, natomiast
write - to jego metoda, czyli funkcja wykonująca określone działania na
obiekcie - w tym wypadku wypisuje tekst.
Nasz tekst umieszczamy w nawiasach, jako argumenty wywołania metody. Ogólnie postępujemy następująco:
obiekt.metoda( argumenty metody )
Zatem nasz standardowy program "Hello World" będzie wyglądał następująco:
document.write("Witaj świecie!")
Wewnątrz możemy używać znaczników HTML, dbając oczywiście o to, żeby je w odpowiednich miejscach otwierać i zamykać:
document.write("<h1>Strona tytułowa</h1>")
document.write("<b><a href='spis.htm'>Spis treści</a></b>")
Tu zwróćmy uwagę na pewną istotną rzecz: otóż łańcuch znaków
przekazywany metodzie write ograniczony jest z obu stron podwójnym
cudzysłowem. Ale co zrobić w przypadku, gdy umieszczamy wewnątrz
znaczniki HTML, których atrybuty również używają cudzysłowia? Jeżeli
użyjemy " popełnimy błąd, gdyż JavaScript pomyśli, że zakończyliśmy
wprowadzanie łańcucha znakowego do metody write, podczas gdy za znakiem
" znajduje się jeszcze to, co chcemy wypisać w dokumencie. Dlatego
musimy stosować zamiennie znaki " oraz '. Jeżeli będziemy pamiętali o
tym, że muszą się one parami otwierać i zamykać, możemy wielokrotnie
zagnieżdżać jedne w drugich, przy czym stosując przemiennie: "1 '2 "3 -
3" 2' 1".
A co zrobić żeby wypisać znak cudzysłowu na stronie, lub użyć innego
znaku specjalnego? Znaki takie poprzedzamy backslashem - czyli \ lub
specjalnymi sekwencjami podstawienia HTML
document.write("Na ekranie zobaczysz<br>C:\\>")
document.write("Polecam film \"Wladca Pierścieni\"")
document.write("<b><a href=\"spis.htm\">Spis treści</a></b>")
2 Zmienne
Metoda write w powyższych przykładach przyjmuje jako argument string
- czyli łańcuch znakowy - dlatego jest on umieszczony w cudzysłowu.
Można jako argument podać liczbę całkowitą (integer) lub
zmiennoprzecinkową (float):
document.write(2004)
Jeżeli chcemy korzystać w skrypcie z długich tekstów, bądź wypisywać
skomplikowane liczby, wygodnie jest przypisać je do zmiennej. W
JavaScript nie musimy deklarować, jakiego typu jest zmienna. Poza tym,
typ zmiennej elastycznie dopasowuje się do naszych potrzeb, dlatego nic
nie stoi na przeszkodzie, aby przypisywać na zmianę typ łańcuchowy i
całkowitoliczbowy. Jedyne co musimy zrobić, to powiadomić przeglądarkę
o zmiennej. Robi się to poprzez instrukcję var:
var nazwa_zmiennej
Nazwy zmiennych zaczynamy od litery i pozostajemy wierni zasadzie,
że składa się ona z liter, cyfr i znaku podkreślenia _. Dodatkowo dbamy
o to, żeby nazwa reprezentowała coś sensownego - czyli była
samotłumacząca się - żebyśmy w przyszłości nie zastanawiali się, co to
za zmienna i po co była użyta w kodzie.
var imie="Janek" // zmienna typu string
var wiek=20 // zmienna typu integer
document.write("Nasz gość ma na imie "+imie+".")
document.write(imie+" ma "+wiek+" lat")
3 Operatory
W dwóch powyższych linijkach kodu użyliśmy operatora + łączenia
stringów. Dzięki niemu możemy wypisywać złożone zdania, zmieniające się
w zależności od zmiennych. Jeżeli przy łączeniu różnych typów zmiennych
występuje string i operator łączenia +, pozostałe zmienne są
przekształcane również na string.
Zestawienie operatorów używanych w JavaScript:
Operatory Arytmetycze
Operator
Opis
Przykład
Wynik
| + |
Dodawanie |
x=3
x=x+4 |
7 |
| - |
Odejmowanie |
x=4
x=6-x |
2 |
| * |
Mnożenie |
x=3
x=x*5 |
15 |
| / |
Dzielenie |
10/5
9/2 |
2
4.5 |
| % |
Modulo (reszta z dzielenia) |
4%3
12%8
8%2 |
1
4
0 |
| ++ |
Zwiększanie o 1 |
x=2
x++ |
x=3 |
| -- |
Zmniejszanie o 1 |
x=4
x-- |
x=3 |
Operator
Przykład
Równoważne z
| = |
x=y |
|
| += |
x+=7 |
x=x+7 |
| -= |
x-=3 |
x=x-3 |
| *= |
x*=y |
x=x*y |
| /= |
x/=y |
x=x/y |
| %= |
x%=y |
x=x%y |
Operator
Opis
Przykład
| == |
jest równe |
2==3 wynik:fałsz
|
| != |
nie jest równe |
2!=3 wynik:prawda |
| > |
jest większe |
25>3 wynik:fałsz |
| < |
jest mniejsze |
2<3 wynik:prawda |
| >= |
większe lub równe |
25>=3 wynik:fałsz |
| <= |
mniejsze lub równe |
2<=3 wynik:prawda |
Operator
Opis
Przykład
| && |
i |
x=3
y=4
(x < 9 && y > 2)
wynik:prawda |
| || |
lub |
x=3
y=4
(x==8 || y==6)
wynik:fałsz |
| ! |
zaprzeczenie |
x=3
y=4
!(x==y) wynik:prawda |
|