JavaScript Tutorial na Srpskom (pdf document) free file download at fliiby.com

"Uvod u JavaScript Srđan Pantić <srdjan@pantic.co.yu> mart 1997. godine Uvod u JavaScript Srđan Pantić, srdjan@pantic.co.yu Uvod u JavaScript Šta je to JavaScript? Javascript je novi skript jezik za korišćenje u programiranju WWW prezentacija. Uveden je od strane Netscapea u Netscape Navigator, počevši od verzije 2.0, uporedo sa uvođenjem podrške za Javu. Brzo je postigao veliku popularnost i raširenost, toliku da je i sam Microsoft pored uvođenja svog skript jezika - Visual Basic Script, koji je kompatibilan sa Visual Basicom i Visual Basic for Aplication, uveo svoju verziju JavaScripta - JScript. Jedini razlog zašto Microsoft nije licencirao JavaScript kao takav jeste što nije dobio licencu. Javascript se uključuje u sadržaj HTML dokumenta i omogućava unapređenje HTML strana sa interesantnim efektima. Na primer, korišćenjem JavaScripta je moguće odgovarati na akcije korisnika u samom WWW čitaču. Ono što je bitno zapamtiti jeste da JavaScript program može da se izvrašava samo u okviru WWW čitača i nigde drugde. Najbolji način za upoznavanje sa jednim Internet orjentisanim jezikom, kakav JavaScript jeste, je baš na Internetu. Veliki broj primera, dokumentacije i svega drugog vezanog za JavaScript možete naći na Gamelanu, WWW serveru posvećenom Javi i JavaScriptu,http://www.gamelan.com. Izvornu dokumentaciju samog Netscapea možete naći na http://home.netscape.com. U ovom dodatku opisujemo JavaScript verziju 1.1, koja je podržana od strane Netscape Navigatora 3.0 i kasnijih. Microsoftova verzija JScripta je kompatibilna sa JavaScriptom 1.0 i na razlike između njih ćemo ukazati u tekstu. Koje su razlike između Jave i JavaScripta? Bez obzira na nazive, Java i JavaScript su različiti jezici. Oni predstavljaju dve različite tehnike programiranja na Internetu. Java je programski jezik. JavaScript je (kako mu i samo ime kaže) skript jezik. Razlika je u tome što sa Javom možete da kreirate prave programe, koji mogu da se izvršavaju potpuno nezavisno od WWW čitača (poput programa napisanih sa C++ ), ili Java aplete koje možete da pozivate iz HTML dokumenta i koji se dovlače preko mreže i onda izvršavaju u okviru vašeg WWW čitača. Ipak, najčešće vam za unapređenje HTML dokumenata zaista ne treba “teška artiljerija” poput Jave, jer želite da napravite neki efekat brzo, ne zamarajući se pravim programiranjem. Tu dolazimo na JavaScript, koji je jednostavan za razumevanje i upotrebu. JavaScript jeste zasnovan na Javi, ali postoje i brojne razlike. Poređenje Jave i JavaScripta Java Prevodi se na serveru pre izvršavanja u klijentu. Objektno-orijentisan jezik. Postoji podrška za objekte, klase, nasleđivanje... Apleti su odvojeni od HTML dokumenata (iz kojih se pozivaju) Promenljive se moraju deklarisati (jaka tipizacija) Statičko povezivanje: reference objekata moraju postojati u vreme prevođenja. JavaScript Interpretira ga WWW čitač - ne prevodi se. Objektno-baziran jezik. Postoje ugrađeni objekti. Integrisano u HTML dokument Promenljive se ne moraju deklarisati (slaba tipizacija) Dinamičko povezivanje: reference objekata se proveravaju u vreme izvršavanja. 2 Uvod u JavaScript Srđan Pantić, srdjan@pantic.co.yu Sigurne: ne mogu da pišu na hard disk. Sigurne: ne mogu da pišu na hard disk. Kako pokrenuti program pisan u JavaScriptu? JavaScript bez problema izvršavaju Netscape Navigator (od verzije 2.0 gde je i uveden i to na svim platformama) i Internet Explorer (od verzije 3.0), ali će bez sumnje biti podržan i od ostalih manje važnih WWW čitača. Da bi programirali u JavaScriptu morate imati osnovno poznavanje HTML-a, a ne samo JavaScripta. Pozivanje programa unutar HTML dokumenta Ceo program se smešta unutar HTML dokumenta, unutar SCRIPT elementa. Atribut elementa SCRIPT je LANGUAGE, kojim se tačno određuje o kom se skript jeziku radi. Danas postoje dva skript jezika na WWW: JavaScript (Netsape) i VisualBasic Script (Microsoft). Primer 1 Jednostavni JavaScript program <HTML> <HEAD> <TITLE> Jednostavan JavaScript </TITLE> </HEAD> <BODY> Tekst prikazan na uobičajen način. <BR> <SCRIPT LANGUAGE=”JavaScript”> document.write(“<B>Tekst prikazan iz JavaScripta.</B>”) </SCRIPT> </BODY> </HTML> JavaScript se unutar HTML dokumenata uvek mora naći unutar SCRIPT elementa. Obratite pri tome pažnju da ako HTML dokument sa JavaScriptom pokušamo da pogledamo sa nekim WWW čitačom koji nema ugrađenu podršku za JavaScript, gornji dokument će se nepravilno prikazati. Čitač će, prema specifikaciji HTML jezika ignorisati sve oznake unutar “<” i “>” koje ne ume da tumači. Problem koji ovde imamo je što skript zapravo nije unutar “<” i “>”. Stariji WWW čitači bi prema tome sam skript prikazali kao tekst što je efekat koji sigurno ne želimo da izvedemo. Da bi to izbegli, potrebno je sam skript stavljati u oznake komentara “”. Pravilno napisan, primer 1 izgledaće ovako: Primer 2 Jednostavni JavaScript program, koji neće smetati WWW čitačima koji ne podržavaju JavaScript <HTML> <HEAD> 3 Uvod u JavaScript Srđan Pantić, srdjan@pantic.co.yu <TITLE> Jednostavan JavaScript </TITLE> </HEAD> <BODY> Tekst prikazan na uobičajen način. <BR> <SCRIPT LANGUAGE=”JavaScript”>  </SCRIPT> </BODY> </HTML> Komentar u sam skript stavljamo iza dvostruke kose crte (//), ili ih zatvaramo između “/*” i “*/”. Kada WWW čitač prikazuje HTML dokument on ide redom i kada naiđe na skript on će ga i izvršiti ako ima podršku za njega. U gornjem primeru skript samo ispisuje u tekući dokument poruku. Objekat document ovde se odnosi na tekući dokument, a metodom write ispisujemo sam tekst. Pozivanje eksternih skriptova Uključivanje JavaScript programa direktno u HTML dokumenta je dobro rešenje za male skriptove i jednostavne HTML dokumente, ali lako može da izmakne kontroli kada je reč o velikim i kompleksnim skriptovima. Zato je u takvim slučajevima najpogodnije rešenje čuvanje JavaScript programa u posebnom fajlu, odvojenom od HTML dokumenta i njegovom pozivanju od strane HTML dokumenta za koji je skript potreban. Na taj način isti skript možemo da koristimo u raznim HTML dokumentima, bez opterećivanja svih njih istim kodom. 4 Uvod u JavaScript Srđan Pantić, srdjan@pantic.co.yu Da bi to omogućili, uveden je atribut SCR za SCRIPT element. On je važeći od verzije 3.0 Netscape Navigatora. Fajl koji je naveden kao mesto u kome se nalazi JavaScript program se obavezno mora završavati sa ekstenzijom “.js”. <SCRIPT LANGUAGE="JavaScript" SRC="http://www.kombib.com/skript.js"> </SCRIPT> Ako JavaScript program pozivate iz spoljnog fajla, najbolje mesto za SCRIPT element je u zaglavlju HTML dokumenta, kako bi se učitao odmah po preuzimanju HTML dokumenta. Ova tehnika zahteva dodatni pristup HTTP serveru i dodatni njegov odgovor za svaki uključeni spoljni fajl, tako da predstavlja loše rešenje, ako se HTTP server nalazi na sporom linku ka Internetu i ako je veoma opterećen. Tipovi podataka JavaScript prepoznaje sledeće osnovne tipove podataka: • • • • numbers, celi i realni brojevi, booleans, mogu uzeti vrednost true ili false, strings, sadrže niz karaktera, null, koji predstavlja rezervisanu ključnu reč za null objekt i ne predstavlja zapravo tip podatka. U JavaScriptu imena promenljivih se sastoje od sekvenci slova (a-z, A-Z), cifara (0-9) i donje crte (_). JavaScript razlikuje velika i mala slova. U JavaScriptu ne moramo eksplicitno da deklarišemo promenljivu (mada je to dobra praksa) JavaScript je slabo tipiziran jezik. Tipovi podataka će biti automatski konvertovani zavisno od mesta njihove upotrebe u programu. Tako na primer možemo definisati i inicijalizovati sledeću promenljivu var promenljiva=42 a kasnije je možemo predefinisati, dodeljujući joj niz karaktera, na primer promenljiva=”Odgovor za sve tajne svemira je...” Dobra je praksa definisati promenljivu sa var, kada je uvodimo. Specijalna ključna reč null ukazuje da je promenljivoj dodeljena null vrednost. To ne znali da je promenljiva nedefinisana! Promenljiva je nedefinisana kada joj nije dodeljena nikakva vrednost i tada je ne možemo dodeliti drugoj promenljivoj ili koristiti u izrazima, a da ne dobijemo run-time grešku. Primeri ispravnih promenljivih: Broj_pogodaka privremena90 _ime Celi brojevi Celi brojevi u JavaScriptu mogu biti predstavljeni u tri osnove: u decimalnom (baza 10), u oktalnom (baza 8) i heksadecimalnom (baza 16) formatu. 5 Uvod u JavaScript Srđan Pantić, srdjan@pantic.co.yu Decimalni celi brojevi se predstavljaju kao niz cifara (0-9) bez vodeće nule. Oktalni celi brojevi se predstavljaju kao niz cifara (0-7) predvođen sa nulom (“0”). Heksadecimalni celi brojevi se predstavljaju kao niz cifara (0-9) i slova (a-f i A-F) predvođen sa nulom koju sledi slovo x (“0x” ili “0X”). Primer prestavljanja decimalnog celog broja deset (10) u tri brojna sistema: • • • decimalnom: 10. oktalnom: 012. heksadecimalnom: 0xA. Brojevi u pokretnom zarezu Brojevi u pokretnom zarezu imaju sledeće delove: decimalni ceo broj, decimalnu tačku (“.”), deo iza decimalnog zareza (decimalni ceo broj), eksponent (“e” ili “E”, praćen decimalnim celim brojem). Primeri brojeva u pokretnom zarezu: • • • • 3.1415 .1E12 -3.1E12 2E-10 Boolean Promenljive ipa Boolean može da ima samo dve vrednosti: true (tačno) i false (netačno). Stringovi String je niz karaktera sačinjen od nula ili više karaktera zatvorenih u jednostrukim (‘) ili dvostrukim (“) navodnicima. Primeri stringova: • “string” • ‘1234’ • “PRVA LINIJA \n druga linija” Specijalni karakteri U JavaScript stringovima možete koristiti sledeće specijalne znake: • \b, backspace, • \f, form feed, • \n, new line, 6 Uvod u JavaScript Srđan Pantić, srdjan@pantic.co.yu • \r, carriage return, • \t, tab. Takođe je često neophodno koristiti navodnike unutar niza karaktera. To možete uraditi korišćenjem obrnute kose crte. Na primer: var navod=”<P>Sa radošću je čitao Tolkinovog \”Gospodara prstenova \”. ” document.write(navod) JavaScript izrazi i operatori Izraz je ma koji, ispravan, skup konstanti, promenljivih, operatora i izraza koji se može dovesti do jedne vrednosti. Ta vrednost može biti broj (na primer, 7), string (”Mikroračunari”) ili logička vrednost ( true ili false). Operatori koje JavaScript podržava su poznati svima koji su imali prilike da rade u jeziku C ili C++. To su • standardni aritmetički operatori: sabiranje (+), oduzimanje (-), množenje (*), delenje (/), moduo dva broja (deli15 % 5, vraća 2), inkrement (x++ i ++x), dekrement (x-- i --x) i unarna negacija (-x negira vrednost promenljive x). • logički operatori: logičko I ( a && a), logičko ILI (a || b), logička negacija (!a) • binarni operatori: binarni logički operatori (I - a & b, ILI - a | b, ekskluzivno ili XOR - a ^ b) i binarni operatori pomeraja (levi pomeraj - a << n, desni pomeraj sa čuvanjem znaka - a >> n i desni pomeraj sa punjenjen nulama mesta najveće težine - a >>> n; pomeraj bitova promenljive a za n mesta ulevo ili udesno). • operatori poređenja: jednako (a==b), nije jednako (a!=b), veće (a>b), veće ili jednako (a>=b), manje (a<b), manje ili jednako (a<=b). • operatori stringova: konkatenacija, spajanje dva stringa (“ja” + “volim Tanju” nam vraća string ”ja volim Tanju”) Dozvoljeni su i svi oblici skraćenog ispisa operacije i dodele poznati iz jezika C i C++: • • • • • • • • • • • x+=y, što znači x=x+y x-=y, što znači x=x-y x*=y, što znači x=x*y x/=y, što znači x=x/y x%=y, što znači x=x%y x<<=y, što znači x=x<<y x>>=y, što znači x=x>>y x>>>=y, što znači x=x>>>y x&=y, što znači x=x&y x^=y, što znači x=x^y x|=y, što znači x=x|y Kontrola izvršavanja programa JavaScript podržava kontrolne strukture poznate većini programera iz drugih jezika, poput: 7 Uvod u JavaScript Srđan Pantić, srdjan@pantic.co.yu • while petlje, iz koje možemo izaći sa break (primer izračunava sumu svih brojeva od 0 zaključno sa 10) { n=0;Suma=0 while (n<=10) { n++;Suma+=n } } • for petlja (primer ispisuje svih šest nivoa naslova): { for(i=1;i<=6;i++){ document.write(“<H”+i+”> Naslov nivoa “ i “</H”+i+”>”) } } • for .. in, pomoću nje možemo proći kroz sve osobine (properties) nekog objekta. Koliko jedan objekat ima osobina, toliko puta će se izvršiti ova for petlja. { for (prom in obj){ proveri() } } • break, prekida izvršavanje for ili while petlje i nastavlja se izvršenje skripta posle petlje koja je prekinuta: { while(i<5) { if(i==2){ break} } } • continue, prekida izvršavanje bloka naredbi u petlji i nastavlja izvršavanje petlje u sledećoj iteraciji: { while(i<5) { if(i==2){ continue} } } • if..else, poznato svima odranije, može postojati samo u obliku if(uslov){} kao u ilustraciji naredbe continue ili if(uslov){ } else { }: if (n>2){ 8 Uvod u JavaScript Srđan Pantić, srdjan@pantic.co.yu document.write(“N je veće od 2”) } else { document.write(“N je manje ili jednako 2”) } Rezervisane reči Rezervisane reči iz ove liste ne mogu da se koriste kao nazivi promenljivih, funkcija, metoda ili objekata JavaScripta. Neke od ovih reči se koriste u JavaScriptu, dok su druge rezevisane za buduće korišćenje, • • • • • • • • • • • • • • abstract boolean break byte case catch char class const continue default do double else • • • • • • • • • • • • • extend false final finally float for function goto if implements import in instanceof • • • • • • • • • • • • • int interface long native new null package private protected public return short static • • • • • • • • • • • • • super switch synchronized this throw throws transient true try var void while with Osnove JavaScripta Da bi smo mogli da počnemo sa pisanjem programa u JavaScriptu, potrebno je da smo upoznati sa osnovnom strukturom i sintaksom naredbi JavaScripta. Naredbe i struktura JavaScripta veoma podsećaju na onu korišćenu u jezicima Java, C++ i C. JavaScript program je izgrađen iz funcija i naredbi, operatora i izraza. Osnovna jedinica je naredba ili izraz koji se završava sa tačkom-zarezom. document.writeln("Ovo radi!<BR>"); Gornja komanda poziva writeln() metod, koji je deo document objekta. Tačka-zarez ukazuje na kraj komande. JavaScript komanda se može rasprostreti na više redova, sve dok se završava sa tačkom-zarezom. Isto tako, može se više naredbi naći u jednom redu, sve dok se završava sa tačkomzarezom. Komandni blokovi Možemo grupisati naredbe u blokove naredbi, izdvojenih velikim zagradama: { document.writeln("Da li ovo radi? "); document.writeln("Radi!<BR>"); } Blokovi naredbi se koriste u definiciji funkcija i kontrolnim strukturama. 9 Uvod u JavaScript Srđan Pantić, srdjan@pantic.co.yu Izlaz iz JavaScripta Jedna od osnovnih mogućnosti svakog programskog jezika je da pošalje tekst na izlaz. Ni JavaScript nije izuzetak. U JavaScriptu izlaz može biti preusmeren na nekoliko mesta uključujući trenutni prozor dokumenta i pop-up dijalog. Osnovni izlaz je preusmeravanje teksta u prozor WWW klijenta, što se obavlja prosleđivanjem HTML koda. Rezultujući tekst će biti interpretiran kao HTML kod i prikazan u prozoru WWW klijenta. To ostvarujemo sa metodima write (šalje tekst u prozor WWW čitača bez pomeranja) i writeln (isto kao write(), s tim što se posle ispisa teksta kurzor pomera u sledeći red) objekta document: document.write("Test"); document.writeln('Test'); Primer 3 Izlaz HTML elemenata iz JavaScripta <HTML> <HEAD> <TITLE>Izlazni tekst</TITLE> </HEAD> <BODY> Običan tekst.<BR> <B> <SCRIPT LANGUAGE="JavaScript"> <!-document.write("Boldiran tekst.</B>"); // --> </SCRIPT> </BODY> </HTML> Alert() Jedna od velikih ograničenja HTML-a je što je dizajner sa HTML-om ograničen samo na jedan prozor za prikaz dokumenata. Ako bi iz čistog HTML-a želeo da pošalje potvrdu korisniku da je neki tekst ispravno unet u formi (ili slično) to bi zahtevalo prilično žongliranje. Sa JavaScriptom je sve to veoma jednostavno.JavaScript ima mogućnost da kreira male dijaloge za ispis ili unos teksta koji su sadržajem potpuno nezavistan od sadržaja HTML dokumenta, a ničim isti ne remeti. Najjednostavniji način da se prosledi kratka poruka korisniku je korišćenje alert metoda. alert("Kliknite na OK za nastavak."); Sigurno ste primetili da metod alert() nema ime objekta ispred sebe. Razlog za to je što pripada objektu windows, koji je u osnovi stabla objekata Navigatora i zato se uvek podrazumeva kada se negde ispred metoda naziv objekta ne navede. Znači, ”puno” ime za alert() metod bi bilo: windows.alert("Kliknite na OK za nastavak."); 10 Uvod u JavaScript Srđan Pantić, srdjan@pantic.co.yu Generalno, alert() metod se koristi tačno za to - da upozori korisnika na nešto. Na primer, na netačno unet podatak u formu, pogrešan rezultat kalkulacije... Primer 4 Prikaz poruke u dijalogu <HTML> <HEAD> <TITLE>Primer 4</TITLE> </HEAD> <BODY> <SCRIPT LANGUAGE="JavaScript"> <!-alert("Dobrodošli!\n\n Koristite WWW čitač sa JavaScriptom."); document.write('<P>Sve najbolje</P>'); // --> </SCRIPT> </BODY> </HTML> Interakcija sa korisnikom Alert() metoda nam omogućava da pošaljemo poruku korisniku, ali ne i da preuzmemo odgovor od njega. Da bi smo omogućili jednostavnu interakciju sa korisnikom, koristimo metod prompt(). Poput alert() i prompt() kreira dijalog prozor u kome se može proslediti poruka korisniku, ali se formira i polje u koje korisnik može uneti proizvoljan tekst. Moguće je takođe da se predloži vrednost u tom polju, koju korisnik može prihvatiti ili ignorisati. prompt("Unesite Vaše ime:","anonymous"); Ako gornji primer primenimo bez promene u našem programu, primetićemo da ne možemo da pristupimo informaciji u polju koju je uneo korisnik. Ta informacija se vraća kao rezultat metoda prompt(). Da bi smo iskoristili tu informaciju moramo da dodelimo metod prompt() drugom metodu ili promenljivoj. Na primer: 11 Uvod u JavaScript Srđan Pantić, srdjan@pantic.co.yu document.write("Dobronam došli "); document.writeln(prompt("Unesite Vaše ime:","anonymous")); ili ime_korisnika = prompt("Unesite Vaše ime:","anonymous"); Koristeći metod prompt()sad možemo da napišemo “ličniju” verziju programa iz primera 5. Primer 5 Personalizovana verzija pozdravne poruke <HTML> <HEAD> <TITLE>Primer 5</TITLE> </HEAD> <BODY> <SCRIPT LANGUAGE="JavaScript"> <!-document.write("<H1>Dobrodošli, "); document.writeln(prompt("Unesite Vaše ime:","anonymous")); document.write(" u svet JavaScripta!</H1>"); document.write('<P>Čestitamo</P>'); // --> </SCRIPT> </BODY> </HTML> Funkcije Funkcije predstavljaju jednu od osnova JavaScripta. Čim budete počeli da pišete složenije programe, brzo ćete otkriti potrebu da određene poslove i akcije izvršavate više puta tokom izvršavanja programa. Tu do izražaja dolaze funkcije. Funkcije su slične metodima kod objekata (više o objektima možete naći kasnije u poglavlju, u delu Objekti u JavaScriptu), s tim što ne pripadaju nijednom objektu. Možete kreirati proizvoljan broj funkcija u programu. Funkcija u JavaScriptu predstavlja skup naredbi koje obavljaju određen posao i koja može da vraća neku vrednost, bilo podatak ili objekt. Funcije mogu da imaju parametre koji se prenose po vrednosti. 12 Uvod u JavaScript Srđan Pantić, srdjan@pantic.co.yu Dopuštena je rekurzija. U HTML dokumentu možete koristiti sve funkcije koje su definisane u njegovom okviru. Generalno se funkcija može smestiti bilo gde u okviru jednog HTML dokumenta, ali je dobra praksa..."

You need to upgrade your Flash Player , or try to enable javascript in order see this document properly.