Objekty v Javascriptu - Builder.cz - Informacni server o programovani

Odběr fotomagazínu

Fotografický magazín "iZIN IDIF" každý týden ve Vašem e-mailu.
Co nového ve světě fotografie!

 

Zadejte Vaši e-mailovou adresu:

Kamarád fotí rád?

Přihlas ho k odběru fotomagazínu!

 

Zadejte e-mailovou adresu kamaráda:

Soutěž

Sponzorem soutěže je:

IDIF

 

Kde se koná výstava fotografií Luďka Vojtěchovského?

V dnešní soutěži hrajeme o:



JavaScript

Objekty v Javascriptu

5. září 2001, 00.00 | Základní seznámení s objekty v javascriptu. Jaké objekty známe, jaké mají definované metody a atributy. Dále si ukážeme jak pracovat s příkazem with.

JavaScript je objektově orientovaný jazyk a při programování stále pracujete s objekty. Abych mohl pokračovat v seriálu, musím tedy vysvětlit, jak to s objekty skutečně je.

Co jsou to tedy ty objekty ?

Objekty jsou data, která spolu souvisejí. Každý objekt obsahuje několik proměnných, které určují vlastnosi objekt. Protože proměnné obsahují hodnoty vlastností, říká se takovým proměnným vlastnosti objektu. Krom vlastností má každý objekt ještě funkce, které můžete použít, pokud chcete aby objekt něco vykonal. V uzavřeném objektu se funkcím říká metody.

Objektem může být například okno prohlížeče. Jeho vlastností je například název, text ve stavovém řádku a podobně. Příkaz alert (zobrazí v dialogovém okně) je jen metodou objektu window. Zapisuje se takto:

window.alert("Text hlášky");

Z toho co jsem zapsal si lze všimnout, že zápis většiny příkazů v JS je založen na obecném zápisu (v předešlém příkladě jde o objekt window):

jmeno_objektu.jmeno_vlastnosti
- pro změnu vlastnosti objektu

jmeno_objektu.jmeno_metody
- pokud má objekt něco vykonat

Seznam objektů

Bez dlouhého popisku zde uvedu seznam objektů, které jsou definovány v JavaScriptu. Pokusím se do konce seriálu dát dohromady referenci jazyka, kde popíši jednotlivé objekty, jejich metody a vlastnosti. Dokument bude ke stažení v jednom z posledních dílů seriálu. Teď však k seznamu:

anchor applet area
Array button checkbox
Date document form
frame hidden history
image link location
Math navigator password
radio reset select
String submit text
textarea window  

Do reference zařadím také hierarchii objektů se stručným popisem, tady by to bylo zbytečné.

Ukázka práce s objekty - objekt document

Protože mám rád názornost, začneme zase s příklady, ze kterých člověk programování pochopí přece jen nejrychleji. Pozornost budeme věnovat objektu document.

Nejdříve popíši jednotlivé vlastnosti objektu:

alinkColor - barva aktivovaných objektů
podporuje: NN 2.0, IE 4.0

all[] - pole všech objektů dokumentu
podporuje: IE 4.0

anchors[] - pole obsahující kotvy dokumentu
podporuje: NN 2.0, IE 3.0

bgColor - barva pozadí stránky
podporuje: NN 2.0, IE 3.0

charset - aktuální kódování dokumentu
podporuje: IE 5.5

cookie - řetězec cookies patřící aktuálnímu dokumentu
podporuje: NN 2.0, IE 4.0

fgColor - barva textu stránky
podporuje: NN 2.0, IE 3.0

forms[] - pole obsahující formuláře dokumentu
podporuje: NN 3.0, IE 3.0

images[] - pole obsahující obrázky dokumentu
podporuje: NN 3.0, IE 4.0

lastModified - datum a čas poslední změny dokumentu
podporuje: NN 2.0, IE 3.0

linkColor - barva nenavštívených odkazů
podporuje: NN 2.0, IE 3.0

links[] - pole obsahující odkazy  dokumentu
podporuje: NN 2.0, IE 4.0

location - aktuální URL dokumentu
podporuje: NN 2.0, IE 3.0

referrer - URL dokumentu, ze kterého jste se dostali na tento dokument
podporuje: NN 2.0, IE 4.0

stylSheets[] - pole obsahující kaskádové styly dokumentu
podporuje: IE 4.0

title -  titulek stránek
podporuje: NN 2.0, IE 3.0

URL - URL aktuálního dokumentu
podporuje: NN 2.0, IE 4.0

URLUnencoded - dekódované URL aktuálního dokumentu
podporuje: IE 5.5

vlinkColor - barva navštívených odkazů
podporuje: NN 2.0, IE 3.0

URL - URL aktuálního dokumentu
podporuje: NN 2.0, IE 4.0

No a nyní si budeme s dokumentem hrát a naprogramujeme dva skripty. Nejdříve naprogramujete skript, který pouze změní barvu pozadí stránky, barvu navštívených a aktivních odkazů a barvu textu. Změníme tedy vlastnosti (tento skript by bylo vhodné umístit do hlavičky HTML souboru).

<SCRIPT LANGUAGE="JavaScript">
document.fgColor="#8080FF";
document.vlinkColor="blue";
document.bgColor="red";
document.alinkColor="white";
</SCRIPT>

Dále tu máme skript, který vypíše na své tělo titulek stránky a datum poslední úpravy.

<SCRIPT LANGUAGE="JavaScript">
document.write("Titulek: "+document.title+"<BR>");
document.write("Datum posledni upravy: "+document.lastModification)
</SCRIPT>

Právě se stáváte velmi samostatní a nezávislí na tomto seriálu, protože když tak to umíte pracovat s objekty, můžete již hodně naprogramovat. Tak to vypadá programování v JavaScript, je to objektový jazyk, proto se nedivte. Jediné co vám schází je vhodná reference, kde by byli popsány jednotlivé metody objektů. To se pokusím napravit.

Příkaz with

V mnoha zdrojových kódech si můžete všimnout "podivného" příkazu with. Slouží k ulehčení práce (a zpřehlednění kódu), kdy můžete získat snadný přístup ke všem vlastnostem objektu. Například místo příkazů:

document.write("Stále u vlastnosti musím před tečkou");
document.write("uvádět jméno objektu a ");
document.write("nelíbí se mi to.");

Lze mnohem jednodušeji a přehledněji zapsat:

with (document)
{
write("Na pomoc mi však přišel.")
write("příkaz with, který mi usnadní práci")
write("a ušetrí peníze zaměstnavateli :-( .")
}

A ještě jeden příklad, kdy zneužiji příkazu with. Zdrojový kód tohoto skriptu je pouze upravený kód prvního příkladu tohoto dílu.

<SCRIPT LANGUAGE="JavaScript">
with(document) 
{
   fgColor="#8080FF";
   vlinkColor="blue";
   bgColor="red";
   alinkColor="white";
}
</SCRIPT>

Toto byl možná trochu nezáživný, ale velice podstatný díl. Do této doby jsem občas musel něco zamlčet, ale teď již můžete snadno pochopit vše a já se mohu pustit do vysvětlování složitějších skriptů.

Obsah seriálu (více o seriálu):

Tématické zařazení:

 » Rubriky  » JavaScript  

 » Rubriky  » Web  

 

 

 

Nejčtenější články
Nejlépe hodnocené články

 

Přihlášení k mému účtu

Uživatelské jméno:

Heslo: