1
1
JavaScript - wykład 2
Obiekty i metody specjalne
Beata Pańczyk
(na podstawie wykładów
dr inż. Anny Kamińskiej)
2
Przykład 1 - XHTML + JavaScript
<?xml version="1.0" encoding="iso-8859-2"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl">
<head> <meta http-equiv="Content-type" content="application/xhtml+xml;
charset=iso-8859-2" />
<title>Pierwszy Java Script </title>
<script type="text/javascript">
// <![CDATA[
var data=new Date();
var godz=data.getHours();
if (godz>=22) document.write("<h3>Dobranoc</h3>");
else document.write("<h3>Dzień dobry</h3>");
// ]]>
</script>
</head> <body> <p>Java Script</p> </body> </html>
3
Przykład 1a - XHTML + JavaScript
//prolog XHTML
<head> <title>Pierwszy Java Script </title>
<script type="text/javascript" src="js1.js"></script>
</head>
<body> <p>Java Script</p></body></html>
• Plik js1.js
//zmienne skryptu:
var data=new Date();
var godz=data.getHours();
if (godz>=22) document.write("<h3>Dobranoc</h3>");
else document.write("<h3>Dzień dobry</h3>");
4
Przykład 1
5
Obiekty specjalne
• Obiekt
Array
- do manipulowania grupami
danych (tablice)
• Obiekt
Date
- dane dotyczące daty i czasu
(odczyt, konwertowanie itp.)
• Obiekt
Math
- stałe i funkcje matematyczne
• Obiekt
String
- łańcuchy tekstowe
(formatowanie, wyszukiwanie itp.)
6
Obiekt
Array
• Tablica w JavaScript - obiekt
Array
• Tworzenie obiektu - słowo kluczowe
new
• Elementy tablicy mogą być różnych typów
• Przykłady tworzenia tablic
var ocena = new Array();
var tablica = new Array("Rok ",2000);
• Indeksowanie elementów tablicy - od 0
• Definiowanie elementów tablicy, np.
ocena[0]=4.5;
2
7
Obiekt
Array
• Właściwość
length
obiektu - zwraca długość
tablicy
• Przykład
var tabela = new Array("IZ","III");
for (i=0; i<tabela.length; i++)
document.write(tabela[i] + " ");
• Dynamiczna zmiana długości tablicy, np.
var x = new Array(13,6,9);
x[3]=7;
// x=13,6,9,7
8
Niektóre metody obiektu
Array
• reverse
() – odwraca kolejność elementów tablicy
• join
(separator) - łączy elementy tablicy w ciąg
znaków, oddzielając je podanym separatorem
(domyślnie ",")
• sort
(funkcja) – sortuje elementy tablicy według
podanej funkcji (domyślnie – sortowanie
alfabetyczne)
• np.
var Tab = new
Array("jeden","dwa","trzy","cztery");
Tab.reverse();
9
Obiekt
Date
• Tworzenie obiektu - słowo kluczowe
new
• Wartość domyślna - aktualna data i czas
var dzisiaj = new Date();
• Inne sposoby tworzenia obiektu np.
var data = new Date(2005,9,1,10,0,0);
//1.10.2005, godz. 10:00:00
var data = new Date(2005,9,1);
//1.10.2005, godz. 00:00:00
var data = new Date("10/01/2005
13:20:10");
10
Nektóre metody obiektu
Date
• getYear
()
zwraca rok (różna postać)
• getMonth
()
zwraca miesiąc (0
÷
11)
• getDate
()
zwraca dzień miesiąca (1
÷
31)
• getDay
()
zwraca dzień tygodnia (0
÷
6)
• getHours
()
zwraca godzinę (0
÷
23)
• getMinute
s()
zwraca minuty (0
÷
59)
• getSeconds
() zwraca sekundy (0
÷
59)
• getTime
()
zwraca liczbę [ms], jaka
upłynęła od 1.01.1970, godz. 0
11
Nektóre metody obiektu
Date
• setYear
(liczba)
ustawia rok
• setMonth
(liczba)
ustawia miesiąc (0
÷
11)
• setDate
(liczba)
ustawia dzień miesiąca
• setHours
(liczba)
ustawia godzinę (0
÷
23)
• setMinutes
(liczba) ustawia minuty (0
÷
59)
• setSeconds
(liczba) ustawia sekundy (0
÷
59)
• toGMTString
()
zwraca datę jako łańcuch
• toLocaleString
() zwraca datę jako łańcuch
(czas lokalny)
• getFullYear
() z v. 1.2 - zwraca zawsze rok w
postaci czterocyfrowej
12
Przykład 1 – plik dzien.js
function dzien_t(nr) {
var tab=new Array ("niedziela", "poniedziałek",
"wtorek","
ś
roda","czwartek","pi
ą
tek","sobota");
return tab[nr];
}
function miesiac(nr) {
var tab=new Array("stycznia","lutego","marca",
"kwietnia", "maja", "czerwca", "lipca", "sierpnia", "wrze
ś
nia",
"pa
ź
dziernika", "listopada", "grudnia"); return tab[nr];
}
function powitanie(){
var d = new Date();
document.write("<h3>Dzisiaj jest ");
document.write(dzien_t(d.getDay()));
document.write(", "+d.getDate()+" ");
document.write(miesiac(d.getMonth()));
document.write("</h1>");
}
3
13
Przykład 1 – data.xhtml
<head>
<meta http-equiv="Content-type"
content="application/xhtml+xml; charset=iso-8859-2" />
<title>Data </title>
<script type="text/javascript" src="dzien.js"></script>
</head>
<body onload="powitanie()">
</body></html>
14
Obiekt
Math
• Obiekt
Math
- predefiniowany
• Właściwości obiektu (stałe matematyczne)
E
e
SQRT1_2
√
1/2
PI
π
SQRT2
√
2
LN2
ln(2)
LOG2E
log
2
(e)
LN10
ln(10)
LOG10E
log(e)
• Przykład
document.write("Pi="+Math.PI + "<BR>");
document.write("E=" +Math.E + "<BR>");
15
Metody obiektu
Math
• abs
(x)
zwraca wartość bezwzględną x
• exp
(x)
zwraca e
x
• log
(x)
zwraca ln(x)
• sqrt
(x) zwraca pierwiastek z x
• pow
(x,y) zwraca x do potęgi y
• max
(x,y) zwraca większą z liczb x i y
• min
(x,y) zwraca mniejszą z liczb x i y
• cos
(x)
zwraca cosinus x (x w radianach)
• sin
(x)
zwraca sinus x (x w radianach)
• tan
(x)
zwraca tangens x (x w radianach)
16
Metody obiektu
Math
• acos
(x) zwraca arcus cosinus x (wynik w radianach)
• asin
(x) zwraca arcus sinus x (wynik w radianach)
• atan
(x) zwraca arcus tangens x (wynik w radianach)
• round
(x) zwraca x zaokrąglone do najbliższej liczby
całkowitej
• ceil
(x) zwraca najmniejszą liczbę całkowitą większą
lub równa x
• floor
(x) zwraca najmniejszą liczbę całkowitą
mniejszą lub równa x
• random
() zwraca liczbę pseudolosową z zakresu <0,1>
17
Uwagi do obiektu
Math
• Błędne wartości niektórych funkcji (np.
pierwiastek z liczby ujemnej) -
niebezpieczeństwo zawieszenia przeglądarki
• Nieskończoność - wartość prawidłowa
• Użycie operatora
with
, np.
with(Math){
a=PI*r*r;
x=r*cos(alpha);
}
18
Przykład - odliczanie dni
<head>
...
<script type="text/javascript">
function wigilia()
{ dzis= new Date(); rok=dzis.getYear();
kolejnyRok=rok+1;
wigilia=new Date(rok,11,24);
if(wigilia.getTime() < dzis.getTime())
wigilia.setYear(kolejnyRok);
ms=wigilia.getTime() - dzis.getTime();
il_dni=Math.floor(ms/(1000*60*60*24));
return il_dni;
}
</script>
</head>
4
19
Przykład - odliczanie dni - cd
<body>
<h3>Do wigilii zostało jeszcze tylko:
<script type="text/javascript">
document.write(" "+wigilia()+" dni.");
</script></h3>
</body></html>
20
Obiekt
String
• Każdy łańcuch tekstowy - obiekt
String
• Łańcuch - tablica znaków (indeksy od 0)
• Tworzenie obiektu
String
- jak zwykłej
zmiennej (bez
new
), np.
var uczelnia = "Politechnika";
document.write(uczelnia.length);
21
Metody obiektu
String
• bold
()
zwraca łańcuch znaków umieszczony wewnątrz
bloku <B>...</B>
• big
()
zwraca łańcuch znaków umieszczony wewnątrz
bloku <BIG>...</BIG>
• Analogicznie do
bold
() -
italics
()
• Analogicznie do
big
() -
sub
(),
sup
(),
strike
(),
small
()
22
Metody obiektu
String
• toLowerCase
()
zamienia litery na małe
• toUpperCase
()
zamienia litery na duże
• charAt
(indeks)
wyświetla znak o podanym indeksie
• charCodeAt
(indeks)
zwraca kod Unicode znaku o podanym indeksie
• indexOf
(str)
zwraca pozycję pierwszego znaku łańcucha str w
łańcuchu przeszukiwanym
23
Metody obiektu
String
• substring
(indeksA, indeksB)
zwraca podzbiór łańcucha od indeksA do indeksB-1
• split
(separator)
dzieli łańcuch znaków na fragmenty, zastępuje
separator przecinkiem, tworzy tablicę elementów
• concat
(str)
łączy dwa łańcuchy, np.
napis = napis1.concat(napis2)
24
Przykład - kody
polskich znaków
<head>
<script type="text/javascript">
document.write("Kody Unicode <br/>");
x="
ąęćś
ół
ńżźĄĘĆŚ
ÓŁ
ŃśŹ
"
for(i=0;i<x.length;i++){
document.write(x.charAt(i)+"-");
document.write(x.charCodeAt(i)+"<br/>");
}
</script>
</head>
<body>
</body>
</html>
5
25
Wyra
ż
enia regularne
• Obecne od wersji 1.2
• Reprezentowane przez obiekt
RegExp
• Ułatwiają przeszukiwanie łańcuchów
• Sposoby tworzenia wyrażeń regularnych
x=/a+bc/
//zalecany
x=new RegExp("a+bc")
• Sposoby przeszukiwania
– globalny
/a+bc/g
– pomijanie wielkości liter
/a+bc/i
26
Metody obiektu
String
do obsługi wyrażeń regularnych
• match
(wyrażenie_regularne)
przeszukuje podany łańcuch znaków, zgodnie
z podanym wyrażeniem regularnym
• search
(wyrażenie_regularne)
sprawdza występowanie wyrażenia regularnego
w przeszukiwanym łańcuchu znaków
• replace
(wyrażenie_regularne,nowy_łańcuch)
zamienia fragment łańcucha zgodny z podanym
wyrażeniem regularnym na nowy_łańcuch
27
Metody specjalne
• Metody nie należące do żadnego obiektu
– eval
(tekst)
oblicza wartość wyrażenia tekstowego), np.
x=eval("10*y")-1; //dla y=2 x=19
– parseInt
(tekst[, n])
konwersja tekstu na liczbę całkowitą
(n=2 - binarnie, n=8 - ósemkowo, n=16 -
szesnastkowo)
– parseFloat
(tekst)
konwersja tekstu na liczbę
zmiennoprzecinkową
Wyszukiwarka
Podobne podstrony:
Narzedzia internet w 1 ID 5 id Nieznany
Narzedzia internet w 3 ID 5 id Nieznany
Arkana radiowego internetu 2 id Nieznany (2)
Arkana radiowego internetu id 6 Nieznany
17 12 2013 Sapa Internet[1]id 1 Nieznany (2)
Narzędzia internet w 4 ID 5
Narzędzia internet w 5 ID 5
17 Narzedzia internetowe NPF id Nieznany
5 11 2013 Sapa Internet id 3993 Nieznany (2)
poradnik internetocholika id 37 Nieznany
konspekty z internetu id 246070 Nieznany
literatura internet id 270916 Nieznany
cit 2007 w interneciejw id 1173 Nieznany
Gieldy interna id 190819 Nieznany
więcej podobnych podstron