JavaScript

Capitolul IV .............................................................................................................................. 1
JavaScript ................................................................................................................................. 1
4.1. Rol i funcionalitate ..................................................................................................... 1
4.2. JavaScript i specificaiile ECMA ............................................................................... 4
4.3. Structura scripturilor ................................................................................................... 5
4.3. Elemente lexicale i structuri sintactice ..................................................................... 7
4.3.1. Tipuri, operatori i expresii................................................................................... 7
4.3.2. Operatori JavaScript ............................................................................................. 9
4.3.3. Structuri de control al fluxului de execuie........................................................ 11
4.5. Funcii i obiecte .......................................................................................................... 14
4.5.1. Caracteristicile obiectelor i funciilor ............................................................... 14
4.5.2. Obiecte fundamentale .......................................................................................... 14
4.5.3. Obiecte Browser ................................................................................................... 19
4.6. Navigarea i evenimentele browser ........................................................................... 24
4.7. Dynamic HTML ...................................................................................................... 27
4.7.1. Obiectele HTML i modelul DOM ..................................................................... 27
4.7.2. Manipularea obiectelor........................................................................................ 29
4.8. Procesarea codului JavaScript................................................................................... 35
4.8.1. Legturile dinamice n scripturi ......................................................................... 35
4.8.2. Examinarea i validarea formelor ...................................................................... 36
4.9. Crearea i manipularea obiectelor............................................................................. 38
4.9.1. Soluia JavaScript ............................................................................................... 38
4.9.2. Utilizarea variabilei length i extinderea instanelor ........................................ 41
4.9.3. Funciile metod i this ......................................................................................... 41
4.9.4. Obiectele ncapsulate.............................................................................................. 42
4.9.5. Funcii cu numr variabil de argumente ........................................................... 45
4.10. Fiiere externe i baze de date cu JavaScript ......................................................... 45

Capitolul IV

JavaScript

4.1. Rol i funcionalitate

Limbajul JavaScript este un limbaj descriptiv, compact, orientat-obiect, dezvoltat de Netscape

pentru realizarea aplicaiilor client-server pe Internet. Internet Explorer sau Mozila
interpreteaz scripturile Java, incluse ntr-o pagin HTML n raport cu evenimentele activate
de utilizator (click-ul de mouse, completare de cmpuri ntr-un formular, navigare, etc.).
Netscape a inventat JavaScript, limbaj care s-a utilizat pentru prima data de browsere
Netscape.
Spre deosebire de acesta, Java este o platform orientat-obiect independent de limbaj,
dezvoltat de Sun Microsystem i utilizat pentru a aduga funcionaliti suplimentare
paginilor Web sau pentru dezvoltarea unor aplicaii complexe care sunt proiectate pe
principiile aplicaiilor de business. Limbajul JavaScript este asemntor cu applet-urile Java,
dar nu ofer o gam att de diversificat de funcionaliti aplicaiilor sale. Astfel JavaScript a
preluat majoritatea expresilor sintactice i a construciilor de control de baz dar n contrast cu
sistemul de clase Java care sunt compilate pe server naintea execuiei propiu zise, scripturile
Java sunt interpretate de ctre client (Netscape), i manipuleaz un numr restrns de tipuri de
date (valori numerice, booleene i string), fr a deine tipurile statice i verificarea puternic
a tipurilor oferite de appleturile Java. Programele Java sunt alctuite exclusiv din clase i

1
 JavaScript

metodele acestora, cunoscut fiind faptul c declararea claselor i a interfeelor, scrierea

metodelor asociate fac programarea mai complex dect n cazul scripturilor. Acesta este
argumentul major pentru care o serie de programatori Web prefer utilizarea unor instrumente
simplificate n realizarea documentelor Web sau a aplicaiilor multimedia.
Conceput pe principiile programrii obiectuale, are predefinite un set de obiecte legate ntr-o
varietate de componente ale unei pagini HTML, mpreun cu relaiie dintre acestea. Pentru a
vizualiza i manipula structurile diverselor obiecte se solicit utilizatorului precizarea
proprietilor i metodelor acestora.

JavaScript are un model de obiecte, bazat pe instane simple, oferind i capaciti

semnificative (utilizarea funciilor fr cerine speciale de declaraii). Funciile pot fi
proprietiile obiectelor i se execut ca metode, iar scripturile Java complementeaz
appleturile Java prin expunerea proprietiilor folosite de appleturi, deoarece aceste scripturi
permit obinerea i stabilirea proprietilor expuse pentru a interoga starea sau pentru a
modifica perfomana unui applet sau plug-in. Fr a intra n prea multe detalii, JavaScript este
interpretativ, destinat elaborrii scenariilor la fel ca i PERL dar spre deosebire de Perl, unde
scenariile se execut pe server, scenariile JavaScript sunt executate de ctre browser (Internet
Explorer, Mozila, Opera, Firefox), care reprezint astfel interfaa dintre utilizator i Web.
[Reyn_96]. Prin funcionalitate LiveConnect JavaScript i Java comunic ntre ele. Din
JavaScript, se pot instania Java obiecte i se pot accesa metodele publice i cmpuri iar din
Java , se pot accesa obiecte JavaScript, proprieti i metode. Astfel nucleul JavaScript poate
fi extins n diverse scopuri prin suplimentarea cu obiecte adiionale, realiznd astfel
interactivitatea client-side respective server-side.

Client-side JavaScript extinde nucleul limbajului prin suplimentare cu obiecte de control al

browser-ului (Navigator sau oricare altul) precum i Document Object Model (DOM). In
acest mod extensiile client-side permit aplicaiilor plasarea elementelor n forme HTML form
i rspund la evenimente utilizator (mouse click, introducere de date n formulare input,
navigarea n pagin.

Server-side JavaScript extinde nucleul limbajului prin suplimentare cu obiecte relevante

pentru a rula pe server, permind unei aplicaii s comunice cu baze de date relaionale, s
furnizeze continuitatea informaiilor dintr-o invocare a altor aplicaii, s manipuleze fiiere de
pe server.

Modul de funcionare a unui script JavaScript se bazeaz pe paradigma cerere rspuns [4.1]:
utilizatorul declaneaz un eveniment (click de mouse, selectia unei legturi sau
editare ntr-un cmp, etc.);
prin manipulatorul de eveniment asociat, este apelat funcia inclus n tagul
<script>function funct() {...}</script>
funcia funct() utilizeaz obiectele HTML existente, obiectele Browser precum i
obiectele fundamentale (String, Math, Date) cu proprietile i metodele acestora i
efectueaz o aciune pe baza datelor (dac exist) furnizate de navigator;
scriptul returneaz rezultatul obinut i l formateaz astfel ncat s fie inteligibil de
ctre serverul Web;
aciunea asociat poate fi interogarea unei baze de date, calcularea unei variabile
sau apelarea unui program rezident pe sistem.
serverul Web recepioneaz rezultatul de la script i l trimite navigatorului care l
formatez i l afieaz utilizatorului.

2
 JavaScript

Utilizator

Eveniment Aciune
utilizator

Manipulator
eveniment
Ierarnie Funcie
Java Script
Obiecte Obiecte
Browser definite de
utilizator Metode ale
obiectelor

Proprieti ale
Obiecte obiectelor
Obiecte
HTML
Fundamentale

Figura 4.1. Modul de funcionare a scripturilor

O comparaie dintre JavaScript i Java ne permite s afirmm c apar similitudini dar i

diferene:
JavaScript este un limbaj OO (Object-oriented) care nu face distincie ntre tipul
obiectelor. Motenirea este realizat printr-un mecanism prototip, iar properietile i
metodele pot fi adugate n mod dinamic oricrui obiect. Java este un limbaj bazat pe clase
(Class) iar obiectele sunt mpite n clase i instane printr-un mechanism de motenire ce-i
are baza n ierarhia de clas. Clasele i instanele nu pot avea properietile i metodele
adugate n mod dinamic.
JavaScript posed variable a cror tipuri de dat nu se declar, ci sunt dinamice
(dynamic typing) iar Java posed variable a cror tipuri de dat trebuie declarate (static
typing).
Ambele limbaje nu pot scrie direct pe disc.
JavaScript poate fi att limbaj client-side ct i server-side depinzd de locul unde
este procesat scriptul. Astfel scriptul client-side este procesat ("ruleaz") n mod client (pe
browser), fr a primi/trimite date de la/spre server. Spre deosebire de acestea, scriptul server-
side este procesat n relaie cu aplicaiile server i poate primi/trimite date de la/spre server.
Majoritatea scripturilor JavaScript sunt client-side.
La fel ca i Java, JavaScript este cross-platform, codeul putnd rula pe o varietate de
platforme, folosind calculatoare diverse cu diferite systeme de operare, obinnd aceleai
rezultate ale execuiei.

3
 JavaScript

4.2. JavaScript i specificaiile ECMA

JavaScript este nume dat de Netscape, utilizat pentru prima oar n Netscape 2.0, cel mai
popular limbaj scriptural, versiunea curent fiind 1.5. JScript este inventat de Microsoft ca
limbaj scriptural n comptiie cu JavaScript. ECMAScript reprezint standardul international
de facto JavaScript, acoperind nucleul limbajului. De la versiunile 4 browserele Netscape i
Internet Explorer, recunosc JavaScript i JScript avnd aceleai funcionaliti de baz.
Ambele posed nucleul limbajului inclus n standard ECMA. In timp ce IE recunoate JScript
i JavaScript, Netscape nu, n timp ce tag-urile eseniale sunt aceleai iar scripturile JavaScript
ruleaz pe ambele browsere. Exist totui cteva diferene ntre codul JavaScript i JScript n
contextual scriptului propriu zis.

Netscape a cooperat cu ECMA (European Computer Manufacturers Association) pentru a

pune la dispoziie un limbaj de programare standardizat, international bazat pe nucleul
JavaScript. ECMA este asociaia international de standarde pentru sisteme informaionale i
de comunicaii. Versiunea standardizat JavaScript, denumit ECMAScript, devine support de
aplicaii iar firmele pot folosi limbajul deschis standard pentru a-i dezvolta propriile
implementri de JavaScript. Prima versiune de standarde ECMA este regsit n specificaiile
ECMA-262 1 , standard agreat de ISO (International Organization for Standards) as ISO-
16262. Specificaiile ECMA Web site nu descriu Document Object Model (DOM),
standardizat de World Wide Web Consortium (W3C). The DOM definete modul n care
obiectele sunt incluse n documentul HTML i comunicarea cu script-ul.

Relaiile dintre JavaScript i versiunile ECMA

Netscape a conlucrat cu ECMA pentru realizare specificaiilor ECMA. Astfel ECMA-262,

Edition 1 se bazeaz pe 1.1. iar JavaScript 1.3 este complet compatibil cu ECMA-262,
Edition 1, JavaScript 1.3 soluioneaz inconsistenele pe care le avea JavaScript 1.2 cu
ECMA-262, pstrnd toate caracteristicile din JavaScript 1.2 cu excepia == and !=,
modificate conform ECMA-262. JavaScript 1.4 s-a lansat nainte ca a treia versiune de
specificaii ECMA-262, Edition 3 iar JavaScript 1.5 este complet compatibil ECMA-262,
Edition 3. Core JavaScript Reference indic acele caracteristici ale limbajului ce sunt
compatibile ECMA, dar furnizeaz funcionaliti suplimentare. Documentul ECMA nu are ca
scop sprijinul programatorilor deoarece terminologia i sintaxa sunt nefamiliare
programatorilor dar limbajul JavaScript suport toate funcionalitile precizate de ECMA. In
schimb documentaia JavaScript descrie aspecte de limbaj familiare programatorilor:
Obiectele globale nu sunt tratate n documentaia JavaScript deoarece nu sunt utilizate
direct. Metodele i proprietile obiectelor globale apar n documentaii denumite funcii i
proprieti de nivel nalt (top-level).
Constructotul fr parametru (zero-argument) pentru obiecte Number i String nu sunt
tratate n documentaia JavaScript deoarece constructorul Number fr argument ntoarce +0,
iar String "" fr argument ntoarce (ir vid).

JavaScript versiunea 1.5 pune la dispoziie cteva elemente funcionale i particulariti:

1
Versiunea PDF a standardului ECMA-262 se gsete pe site-ul mozilla.

4
 JavaScript

Runtime errors care sunt transmise ca excepii (similar cu Java).

Formatarea numerelor a fost modifiat pentru a include formatarea pe baz de
protptip i apelul metodelor de conversie pe baza prototipului:
Number.prototype.toExponential, (metoda de conversie la exponenial,
Number.protoytpe.toFixed ( fix) i Number.prototype.toPrecision (precizia de reprezentare.
Expresiile simple au fost modificate pentru a permite cuantificatorilor +, *, ? i
{} s poat fi urmai de ? , fornd evaluare. Parantezele necapturate (?:x) pot fi utilizate n
locul parentezelor capturate (x). Utilizarea parantezelor necapturate, permite marcarea
subexpresiilor care nu sunt disponibile ca referine ulterioare (back-reference)
Atribuirile pozitive i negative sunt deja accesptate, ambele depinznd de ceea ce
urmeaz dup marcator, spre exemplu intrri pentru: x(?=y) i x(?!y)
Flag-ul m este adugat n expresii de atribuire, care se pot extinde pe mai
multe linii.
Permite declaraii de funcii n expresii conditionale (funcii declarate n clause if)
sau funcii ce pot fi declarate n interiorul unei expresii..
Clauzele multiple catch sunt deja premise n a structuri de tip try...catch
Programatorii JavaScript pot aduga Getter-i i Setter-i propriilor obiecte,
caracteristic a implementrii C n JavaScript.
Implementarea C n JavaScript permite definirea de constante (Constants) read only.

4.3. Structura scripturilor

JavaScript poate fi ncorporat ntr-un document HTML n dou situaii: ca declaraii i funcii,
folosind elementul <script> respectiv sau ca metode de tratare a evenimentelor folosind
elementele HTML, cu meniunea c orice browser ce nu suport JavaScript, ignor secvenele
de instruciuni precizate ca i comentarii.

Exemplu:
<!DOCTYPE html>
<html>
<body>
<h1> Pagina Web</h1>
<p id="demo">Paragraf</p>
<button type="button" onclick="myFunction()">Try it</button>
<script>
function myFunction()
{
document.getElementById("demo").innerHTML="My First JavaScript Function";
}
</script>
</body>
</html>

Un script este inclus n documentul HTML cu elementul <script> iar ntre eticheta e nceput
(<script>) i cea de sfrit (</script>) pot fi incluse oricte declaraii JavaScript, atributul
LANGUAGE fiind optional. In primul exemplu am folosit funcia document.write pentru a
trimite un mesaj ctre browser, unde <BR> execut CR i LF. JavaScript este sezitiv la tipul
de caractere. Specificnd fiierul sub forma unul URL (spre exemplu: file://c:\cale) se poate
deschide fiierul i se pot executa liniile JavaScript.
Comentariile JavaScript permit explicarea scenariilor i a modului de realizare a aplicaiei:

5
 JavaScript

/*Acesta este un comentariu */

//Si acesta
//*Este tot un comentariu dar multilinie*/
Este de dorit ca funcile JavaScript s fie definite la nceputul documentului (n seciunea
head). Faptul c head este lansat totdeauna primul, garanteaz lansarea funciilor nainte ca
utilizatorul s aib o ans s produc un eveniment care ar putea s apeleze o funcie.
Exemplu:
<html><head>Test JavaScript </head>
<body>
function line() {
document.write("<hr align='center' width=50%>)
}
</script>
</body></html>

Intr-un document HTML se pot combina texte afiate cu HTML i cele afiate cu JavaScript
utiliznd metoda write a obiectului document.
Exemplu:
</head><body>
<script>
document.write(line());
</script>
Celebrul Hello!
</body></html>
Rezultatul:
______________
Celebrul Hello!

Dac un script utilizeaz metoda document.write pentru afiarea ieirii, browserul red ieirea
documentului curent. Pentru coordonarea ieirii scriptului Java cu cea a documentului HTML,
metoda document.write utilizeaz atributele curente de font, dimensiune i stil. Pentru a crea o
caset simpl de mesaj, se folosete funcia alert, deoarece metoda document.write sau
document.writeln permite afiarea ieirii ca text inclus n documenul HTML.
Exemplu:
<html>
<head>
<script >
<!- Aici se scriu toate funciile utilizate -
alert ('Cnd suntei dispus s optai pentru un tip de asigurare')
//end of script->
</script>
</head>
<body bgcolor= white>
Tastai OK i precizai detalii !
</body>
</html>

Practic un ablon de realizare a unei pagini cu JavaScript presupune utilizarea a minim trei
componente:
 Funcia JavaScript din interiorul blocului <script> inclus n seciunea <head> a
documentului HTML;
 <body> cu comenzi non-interactive;
 interaciunea HTML cu agentul de evenimente prin atribute a cror valori sunt funcii
JavaScript.

6
 JavaScript

Codul JavaScript nu se execut pur i simplu prin citirea i verificarea sintactic a erorilor din
blocul SCRIPT dat fiind faptul c browserul recunoate codurile i funciile JavaScript,
salvnd definiiile acestora pentru o utilizare ulterioar. In JavaScript funciile sunt apelate
doar de evenimente.

4.3. Elemente lexicale i structuri sintactice

4.3.1. Tipuri, operatori i expresii

Setul de caractere Unicode, care se folosete n locul setului de caractere standard ASCII
permite reprezentarea caracterelor pe 16 biti, n timp ce setul de caractere ASCII folosete
numai 8 biti. Cele dou subseturi de caractere sunt compatibile, vechiul standard ASCII fiind
un subset al setului Unicode. Aceast necesitate de extindere a setului de caractere -
determinat de nevoia de a reprezenta mai mult de 256 de caractere - a aprut din dorina de a
reprezenta literele ce exist n diferite alfabete de pe glob.

Cuvintele cheie sau cuvintele rezervate, sunt identificatori utilizati n JavaScript ntr-un mod
bine precizat prin gramatica limbajului, fiind interzis utilizarea lor n alte scopuri. Un
identificator este o secvent de litere, cifre i alte caractere n format Unicode, primul caracter
fiind obligatoriu o liter, un caracter underscore (_) sau simbolul dolar ($). Acetia trebuie s
fie diferii de cuvintele cheie i se utilizeaz pentru a desemn variabile, obiecte i metode.

Literalii se folosesc pentru a desemna valori constante n cadrul unui script Java i au la baza
doua categorii de date: numere i caractere. Literalii numerici se mpart n dou subcategorii:
ntregi (cu format: zecimal, hexazecimal, octal) i flotani (numere cu parte fracionar). Un
caracter literal se refer la o singur valoare din setul de caractere Unicode, n timp ce un ir
de caractere se refer la o succesiune de unul s mai multe caractere. Pe lng acetia mai
exist caracterul boolean, literal considerat numeric pentru compatibilitate cu limbajele C i
C++, iar valorile de adevar true i false n C i C++, sunt reprezentate prin valorile intregi 1 i
0, JavaScript putnd accepta valori diferite de 0 pentru true.
Constantele literale pot fi exemplificate astfel:

Intregi
+75 ntreg zecimal
O15 ntreg octal
Ox12FE4 (hexazecimal case-sensitive)
Virgul mobil:
4.5, 3.14159
-1.4e12 - constante cu exponent
Booleene: true, false
Constante caracter
(Escape) \' apostrof simplu
\ continuare n linia urmtoare \" apostrof dublu
\n linie nou \ddd form octal
\t tab orizontal \xdd form hexa
\r carriage return \uddd caracter unicode
\f form feed "exemplu" sir de caractere
\\ backslash

Separatorii, delimitatorii i terminatorii sunt caractere utile interpretorului pentru detectarea

elemente lexicale, dar nafar de spaii, tab-uri mai exist i alti separatori, denumii
delimitatori sau terminatori, care particip la construciile sintactice ale limbajului. O parte
dintre acetia au un rol activ n structurile sintactice ale limbajului i ar putea fi considerati

7
 JavaScript

operatori.

O variabil reprezint o adres de memorie n care se pstreaz o valoare de un tip prestabili,

fiecare variabil fiind inclus n declaraii de forma:
var identificator[, identificator];.
La ntlnirea unei declaraii de acest fel, compilatorul creeaz pentru fiecare identificator din
list cte o variabil avnd numele identificator i tipul tip. Dup crearea unei variabile, i se
poate atribui o valoare iar tipul variabilelor nu este explicit ci este interpretat n context
diferit. In JavaScript exist doua categorii de tipuri: simple care nu sunt construite cu
ajutorul altor tipuri, ntreg, flotant, boolean i caracter i tipurile compuse (agregate) care se
creaz pe baza unor agregri de tipuri simple: tablourile i obiectele. Domeniul de
aplicabilitate al variabilei este n zona de program unde este recunoscut, de la declararea
acesteia pn la finalul blocului sau funciei.
Exemple:
var x=7; var lk="Vedem";
var x,y1="19"; var y=null;
Valoarea null se folosete n general la iniializarea oricrei variabile i nu d tipul implicit
null, deoarece la conversia n numr devine 0, la conversia n ir devine "', iar la conversia
boolean este false. Acesta este singurul caz n care se permite schimbarea tipului explicit dup
ce este declarat.
Exemplu:
var lx=lk+y; // lx="Vedem" var w=x+y;// w=19
JavaScript accept conversii de tip ir+numr care prin concatenare dau rezultat ir respectiv
numr+ir unde rezult numr dac se poate face conversia i eroare n caz contrar. Se
recomand primul tip de conversie pentru a nu produce erori n execuia scripturilor. Fiind un
limbaj descriptiv, structura sa este divizat n colecii de instruciuni, organizate n funcii,
pentru a manipula variabile i evenimente HTML, care nglobeaz scripturi n lucru, cu
scopul realizrii unui anume obiectiv.

4.3.2. Operatori JavaScript

Operatorii sunt folosii pentru a realiza anumite operaii elementare ntre obiecte, fiecare
operator joac i rolul de separator ntre dou elemente lexicale i au proprieti similare cu
cei din C: precedena (ordinea n care sunt interpretai) i asociativitatea (direcia de evaluare).
[Laur-98]

Operatori Precedena
Accesoriu de clas, variabil, metod
Aritmetici
++ Preincrement, postincrement
__ Predecrement, postdecrement
* Multiplicare
/ Impartire
+ Adunare,concatenare iruri Stnga la dreapta
- Scdere, negare unar Stnga la dreapta
% Modulo
Logici
< Mai mic
> Mai mare
<= Mai mic sau egal
>= Mai mare sau egal
== Test de egalite

9
 JavaScript

Operatori Precedena
!= Test not equal
! Negaie logic
&& AND
|| OR
? Selecie condiionat
, Concatenare logic
<< Deplasare stnga Stnga la dreapta
>> Deplasare dreapta
>>> Deplasare dreapta cu umplere cu 0 Stnga la dreapta
~ Complement unar
& Si binary
^ XOR binary
| OR binary
Atribuiri
=,+,=,-=,*=,/+,%=,&=,^=,|=,<<=,>>=
A operand b Echivalent cu a=a operand b
A+=b echivalent cu a=a+b
[ ] Accesoriu de tablou
( ) Casting Stnga la dreapta

Tabelul 4.1. Operatori JavaScript

In continuare ncercm s prezentm cteva particulariti de limbaj:

 Dac rezultatul calculelor este de tip ntreg i operandul este long se realizeaz
conversia la tipul long, n rest rezultatul este int;
 Imprirea unor cantiti ntregi d rezultat ntreg;
 n=-m; //echivalent cu nmultirea cu -1;
 Operatorul % d restul mpririi i este utilizat la ntregi; semnul rezultatului este cel al
dempritului (Exemplu: -21%4=-1 i nu 3);
 Operatorii de incrementare/decrementare simplific adunarea i scderea simpl.
Exemplu:
var x=10;
y=++x; //x=11 i y=11
z=x++; //x=11 i z=10
 If (x=3) // x=3 se consider atribuire i se recomand if (3=x) sau if (3==x) plasnd
constantele n partea stng n expresii, ndeosebi constanta null.
 Operatorii de comparare acioneaz asupra irurilor i numerelor, iar la nivel de ir
compararea se face folosind dicionarul:
Exemplu: "Bunuri"<"servicii" rezultat true

Evaluarea lene (lazy evaluation) este realizat de la stnga la dreapta pentru regula i-sau a
operatorilor i este folosit cu precdere n interiorul buclelor for i loop. Operatorii de
atribuire i agregare pot fi combinai cu operatorii aritmetici sau logici astfel:
x+=7;//x=x+7
y*=19.4; //y=y*19.4
z|=OxAA7700; // zVOxAA7700
w>>>=10; //shift (fr semn) cu 10 bii a lui w
Ordinea de evaluare este dat de operatorii de preceden, singura excepie o constituie
incrementul i decrementul, operatori unari care oblig la preincrementare sau
predecrementare naintea tuturor.

10
 JavaScript

Operatori speciali
Ca orice limbaj orientat obiect, posed civa operatori special ce permit manipularea
expresiilor sau obiectelor:
?:Condiie reprezint un tip de structur if...else unde condiia este plasat nainte
de (?) iar valoarea este plasat n fiecare parte a (:);
, (Virgula-Comma) este utilizat n procesarea n serie a expresiilor;
delete Delete terge un obiect, proprietate, sau element dintr-un tablou
in In este utilizat pentru a inspecta coninutul unui obiect specificat;
instanceof Instanceof testeaz dac un object este instan a unui obiect specificat;
new New creaz o instan a unui obiect specificat;
this This refer obiectul curent;
typeof Typeof identific tipul valorii ce este evaluat;
void Void evalueaz o expresie fr a ntoarce o valoare;

4.3.3. Structuri de control al fluxului de execuie

La fel ca i n C++ sau alte limbaje de generaia a IV-a JavaScript respect principalele
sreucturi de control if, for, while,etc. oferind cadrul relizrii unor aplicaii structurate,
orientate obiect.

Instruciunea IF
if <explL> {
instruciuni1 ;
[else } if <expl2> {
instruciuni2;
}else {
instruciuni3 ;]
}
Instruciunea execut primul set de instruciuni <instruciuni1> dac <expL1>=true
(adevarat) i daca <expL1>=false (fals) se execut setul de dup else (adic unul sau mai
multe teste if imbricate, condiionate <expL2>, sau setul de instruciuni <instruciuni3> .
Cnd else nu este specificat se execut instruciunea de dup }. Se pot imbrica mai multe
comenzi if succesive, marcate ntre paranteze {} iar evaluarea se face de sus n jos.
Exemple:
if ((x<10) && (-10<x)) { //test
y=(x*x*x);
ystr="Volumul produsului comandat este"+ x +"este"+y;
}
if ((x<10) && (-10<x)) { //test
y=(x*x*x);
ystr="Volumul produsului comandat este "+ x +"este"+y;
} else {
y=null;
ystr="Volumul produsului comandat este"+ x +" nu se poate calcula";
}

Varianta else if este specific pentru a verifica multiple2 condiii, incluznd multiple stucturi
else if pentr a obine rezultatul dorit.

2
soluie adaptat de Andrew i Jonathan Watt

11
 JavaScript

Spre exemplu presupunem c ntr-o firm de consultan exist mai muli experi: Albu Ana,
Pop Ion, Bob Petre iar utilizatorul fizeaz ntlnirea n funcie de ora la care poate veni.
Creem o funcie
function consultant () {

}
Definim variabile locale i initializm valoarea acestora:
var text1 = "Intalnirea de consultanta are loc cu expertul";
var text2 = " la ora";
var nowDate = new Date();
var cDate = nowDate.getDate();
var c=cDate.toString();
Variabilele text1 i text2 sunt definite de utilizator iar nowDate i cDate sunt instane de
objecte JavaScript.
if (cDate < 5) {
document.write(text1 + text2+ c);
}
else if ((cDate < 12) && (currDate > 4)) {
document.write(text1 + text2+ c);
}
else if ((cDate < 19) && (currDate > 11)) {
document.write(text1 + text2+ c);
}
else {
document.write(text1 + text2+ c);
}
Variabila c convertete obiectul Date() n ir pentru a-l putea afia n documentul HTML.
Instruciunea while
while (exprL) {
instruciuni;}
Instruciunea while permite execuia grupului de instruciuni pn cnd expresia logic expL
evaluat este adevrat.
Exemplu:
var x=1;
var xsuma=0;
while (x<10){
xsuma+=x;
x++; }
Terminarea forat a ciclului poate fi realizat cu instruciunea break plasat n interiorul
corpului de instruciuni.

Instruciunea break
break ;
Instruciunea break determin ntreruperea fluxului normal de execuie i se folosete n
corpul instruciunilor switch, while, do, for. Controlul se trece la prima instruciune de dup
cele condiionale sau repetitive (switch, while, do, for).
Exemplu:
var x=1;
var xodsum=0;
var xtrup=0;
var ultimx=0;
while (true){
xtrup+=xodsum+x;
if (xtrup>100)

12
 JavaScript

break;
xodsum+=x;
x+=2;
}
ultimx=x;
Ciclul infinit este evitat prin omiterea structurilor de tip while (true) i asigurarea condiiei de
ieire din ciclu.

Instruciunea continue
continue ;
Instruciunea continue este similar cu break i se folosete n corpul instruciunilor iterarive
ca: while, for. Controlul este redat la sfritul blocului unde se afl aceasta. Intr-o bucl while,
expresia boolean este evaluat imediat dup continue, iar dac este plasat ntr-o bucl for,
naintea evalurii expresiei booleene nu se mai execut incremetarea/decrementarea.
Exemplu:
var x=0;
var xsum=0;
var salt=0;
while (salt++,100){
x++;
if ((x%5)==0) // diviziunea cu 5
continue;
xsum+=x;
}
Toate instruciunile ce se execut pas cu pas n ciclu se plaseaz naintea lui continue.
Uzual se folosete expresia (!(x%5)) dei creaz confuzii aparente pentru c x%5 este numeric
iar (!(x%5)) este boolean.

Instruciunea for
for (expresie1; exprL; expresie2) {
instruciuni;}
Instruciunea for (de ciclare) execut grupul de instruciuni, pornind de la expresia1, pn
cnd este ndeplinit condiia dat de expresia boolean expL, cu pasul (incrementul) dat de
expresie2.
Exemplu:
var xsum=0;
var x;
for (x=1, x<=10, x++) {
xsum+=x; }
Dac se omite condiia de ieire din ciclu, atunci n mod obligatoriu apar instruciuni de
forare a ieirii iar for( ; ; ) este echivalent cu while (true). Dac variabila este utilizat doar
n interiorul unui bloc, for poate fi declarat la nceputul blocului.
for (var x=1, x<=10, x++) {}
Pentru iniializri multiple se folosesc variabile separate prin virgul:
for (var x=1, lcont=0; lcont<100, x<=10; x++, lcont++) {}
unde x i lcont sunt cele dou variabilele din ciclu.

Instruciunea return
return [valoare intoars];
Instruciunea return este utilizat de o metod sau constructor pentru a ntoarce controlul la
apelant i apare n mod uzual la finalul metodei sau constructorului. Dac metoda ntoarce tip
void sau constructorul nu are tip ntors, return este opional. Se poate folosi i pentru a fora
ntoarcerea, ca mod de prevenire a execuiei restului metodei, ceea ce salveaz nivelul

13
 JavaScript

indentrilor, permind un cod uor de citit i n aceste cazuri este inclus n if.

4.5. Funcii i obiecte

4.5.1. Caracteristicile obiectelor i funciilor

Funciile au un nume unic, parametrii transmii i o instruciune de returnare a valorii. Ca i

n cazul datelor, nu exist un tip returnat .
Obiectele organizeaz datele, aa cum funciile organizeaz codul. De fapt, n JavaScript,
obiectele nlocuiesc noiunea de clas, deci nu mai avem obiecte de tipul dat de clas, ci
instanieri ale unui obiect. n afara acestui aspect, paradigma obiectual e respectat. Obiectul
are membrii, care pot fii proprieti sau funcii (metode), iar calificarea se face cu operatorii
punct sau cu paranteze ptrate.
Obiectele reprezint concepte care pot fi ierarhizate sau imbricate. Un obiect se declar
printr-o funcie de construcie i se instaniaz cu valorile dorite pentru parametrii ntr-o
instruciune new. Masivele sunt, de fapt, tot obiecte. Elementele sale sunt considerate
proprieti i pot fi calificate ca membri i vom putea avea masive eterogene. Identificarea
elementelor se face prin index zero-based sau prin specificarea numelui proprietii.
Ca orice alt element manipulat de JavaScript, i funciile sunt vzute ca obiecte, au proprieti
ce indic apelantul (caller) sau argumentele (arguments). Aceste concepte permit utilizarea
funciilor cu numr variabil de argumente.
Obiecte proprii JavaScript sunt : JS Array, JS Boolean, JS Date, JS Math, JS Number, JS
String, JS RegExp, JS Global

4.5.2. Obiecte fundamentale

Obiectele furnizate de JavaScript pot fi clasificate n 3 categorii: obiecte fundamentale,

obiecte HTML i obiecte Browser. Obiectele fundamentale includ: obiectul Boolean, obiectul
Array, obiecte ir (String), obiectul Date, Global, RegExp i obiectul Math. Obiectele
Browser se afl n topul ierarhiei, reprezentnd o scar larg de elemente proprii mediului
curent al browserului i include obiecte ca Window (fereastra curent), history (lista
ultimelor pagini vizitate), navigator, screen i location (URL-ul paginii curente).
Obiecte HTML DOM sunt: DOM Document, DOM Events i DOM Elements. La nivel de
document apar obiecte specifice: DOM Anchor, DOM Area, DOM Base, DOM Body, DOM
Button, DOM Form, DOM Frame/IFrame, DOM Frameset, DOM Image, DOM Input Button/
Checkbox/ File/ Hidden / Password / Radio /Reset/ Submit/ Text/ DOM Link, DOM Meta,
DOM Object, DOM Option, DOM Select, DOM Style, DOM Table, DOM td / th, DOM tr,
DOM Textarea.

Obiectul Boolean este utilizat la conversia unei valori non-Boolean n valoare Boolean (true
sau false).
Proprieti
constructor -ntoarce funcia ce creaz prototip obiect Boolean
prototype- permite adugarea de proprieti i metode unui object
Metode
toString() convertete valoarea Boolean la ir, i intoarce rezultatul
valueOf()- ntoarce valoarea primitiv a obiectului Boolean

Obiectul Array este utilizat pentru a gestiona massive de date

Proprieti
constructor -ntoarce funcia ce creaz prototip obiect Boolean

14
 JavaScript

length-seteaz sau ntoarce numrul de elemente din tablou

prototype- permite adugarea de proprieti i metode unui object
Metode
concat() reunete 2 sau mai multe tablouri, i ntoarce o copie a tablourilor reunite
indexOf()
join() reunete toate elementele dintr-un tablou n ir
pop() terge ultimul element din tablou i ntoarce acel element
push() adaug elemente noi la finalul unui tablou, i ntoarce noua dimensiune
reverse() inverseaz ordinea elementelor ntr-un tablou
shift()- terge primul element din tablou i ntoarce acel element
slice()-selecteaz o parte din array, i ntoarce noul tablou
sort() sorteaz elementele din tablou
splice() adaug /terge elemente din tablou
toString()- convertete valoarea Boolean la ir, i ntoarce rezultatul
unshift()- adaug elemente noi la sfritul unui tablou, i ntoarce noua lungime
valueOf() ntoarce valoarea primitiv a unui tablou
Obiectele ir au fa de constructor i protopype o singur proprietate suplimentar length
(lungimea) care d lungimea irului i multe metode. Aceste metode se divid n 3 categorii:
metode de manipulare a coninutului unui ir, metode de manipulare a apariiei unui ir
metode de conversie a irului ntr-un element HTML.
Metode de manipulare a coninutului unui ir
charAt (idx) ntoarce poziia caracterului
charCodeAt()ntoarce Unicode al caracterului
fromCharCode() convertete valori Unicode la caractere
indexOf (chr) - caut de la nceput de ir
last IndexOf (chr) - caut de la sfrit de ir
substring (from idx1, to idx2) extrage subir de la idx1 la idx2
substr(n1,n2) extrage caractere din ir, ncepnd de la start n1, pn la numrul
specificat n2 de caractere
to LowerCase( ) conversie la litere mari
to UpperCase( ) conversie la litere mici
concat()-unete 2 sau mai multe iruri i ntoarce o copie a irurilor reunite
match() - caut potrivirea unei expresii regulate la un ir, i ntoarce potrivirea
replace() - caut potrivirea unei expresii regulate la un ir, i nlocuiete cu alt ir
potrivirea
search()- caut potrivirea unei expresii regulate la un ir, i ntoarce poziia
slice() extrage o poriune din ir i ntoarce noul ir
split() desparte un ir n tablou de subiruri
valueOf()- ntoarce valoarea primitiv a obiectului String

Exemple:
var sir = " test de utilizare"
indexOf("t") returneaza 1 iar lastIndex Of("t") returneaz 10, deoarece poziia
caracterului este o baz iar sir.charAt(4)="t"
sir.indexOf ("s") 3
sir.lastIndexOf ("i") 7

Metode de manipulare a apariiei irului sunt

bg ( ) - background-ul fundalului
blink() - background-ul legturii

15
 JavaScript

bold ( ) - ngroat
fixed ( ) -fix
fontcolor (color) - ca i atributul <FONT COLOR=col>
fontsize (dim) - ca i atributul <FONT SIZE=dim>
italics ( ) - italic
small ( ) - mic
strike ( ) - tiat
sub ( ) - indice inferior
sup ( ) - indice superior

Metode de conversie:
anchor(numesir) - echivalent cu tagul <A>...</A>
link (hrefsir) - echivalent cu atributul <HREF=...>

Exemplu:
var sir = "sumarul capitolului 4";
var tinta = "Capitol 4"
<a name = "capitol 4"> sumarul capitolului 4 </a>
<hr> Doriti sa selectati <a href="#Capitol4">
Sumarul capitolului 4 </a>
document write (sir.anchor (tinta));
document.write ("<hr>");
document.write ("Pentru "+ sir.link (location +"#"+tinta));
document.write ("<br>");

Obiectul Math este utilizat pentru calcule matematice i reprezint primul exemplu de obiect
static (nemodificabil) caz n care nu se folosete new cu obiectul Math i se refer direct
deoarece este de sine stttor i spre deosebire de sir care este instaniat. Math este sensibil la
litere mari i mici iar proprietile sunt definite cu majuscule. Proprietile obiectului sunt :
E, LN10, LN2, LOG2E, LOG10E, PI, SQRT 1_2, SQRT2.
Metodele acestui obiect sunt:
 abs (min) - valoarea absolut;
 acos (num), asin (sum), atan(x), atan2(y,x) -arccosinus, arcsinus,arctangent;
 sin (), cos() - sinus, cosinus;
 ceil (num) - ntregul superior (mai mic ca numrul num) n virgul mobil;
 exp (num) - funcia exponenial;
 floor (num) - ntregul superior (mai mare numrul num) n virgul mobil;
 log (num) - funcia logaritmic;
 max (n1,n2nk) - maximum;
 min (n1,n2,nk) - minimum;
 pow (n1,n2) - funcia putere;
 round(x)-rotunjete la cel mai mic ntreg
 random ( ) - generator de numere aleatoare.
Exemple:
var x = Math.atan (x/y);
var y = Math.SQRT2;
var x = Math.PI;
var y = Math.sqrt(16);

JS Number este un object acoperitor pentru valori numerice primitive i se creaz cu new
Number().

16
 JavaScript

Sintaxa
var num = new Number(value);
Dac parametrul value nu poate fi convertit n numr, se ntoarce NaN (Not-a-Number).
Proprieti:
constructor - ntoarce funcia ce creaz prototip obiect Number
MAX_VALUE ntoarce cel mai mare numr posibil n JavaScript
MIN_VALUE ntoarce cel mai mic numr posibil n JavaScript
NEGATIVE_INFINITY -( ntoarce la depire)
POSITIVE_INFINITY ( ntoarce la depire)
prototype- permite adugarea de proprieti i metode unui object
Metodele acestui obiect sunt:
toExponential(x) - Converete un numr n notaie exponential
toFixed(x)- Formateaz un numr cu x digiti dup punctual zecimal
toPrecision(x) - Formateaz un numr la lungime x
toString()- Convertete obiectul Number n ir
valueOf()-ntoarce valoarea primitiv a obiectului Number

Obiectul Date are proprieti (constructor i prototype) i are metode. Crearea unei instane
Date este realizat n 4 moduri:
var d = new Date();
var d = new Date(milliseconds);
var d = new Date(dateString);
var d = new Date(year, month, day, hours, minutes, seconds, milliseconds);
Sirul data este de forma "lun, zi, an)" opional HH:MM:SS
var ndata1 = new Date ("November 12, 2003");
var ndata2 = new Date (2003,10,12);
var ndata3 = new Date (2003,10,12,23,50,0) unde 23,50, 0 este ora.

Metodele obiectului Date pot fi sintetizate astfel:

 getDate( ) - returneaz data curent;
 getDay( ) - returneaz ziua curent;
 getHours( ) - returneaz ora curent;
 getMinutes( ) - returneaz minutul curent;
 getMonth( ) - returneaz luna curent;
 getSeconds( ) - returneaz secundele curente;
 getTime( ) - returneaz ora curent;
 getTimeZoneOffSet( ) - returneaz ora curent a zonei;
 getYear( ) - returneaz anul curent;
 setDate( ) - seteaz data;
 setHours( ) - seteaz ora;
 setMinutes( ) - seteaz minutele;
 setSeconds ( ) seteaz secundele;
 setTime ( ) - seteaz timpul;
 setYear ( ), setFullYear() - seteaz anul ( 2 si 4 digii).

Metoda getDate ntoarce ziua ntre 1-31, getDay ntoarce ziua sptmnii 0-6, getMonth
ntoarce luna anului 0-11 i sunt prefixate de instana Date.
Exemple:
azi = new Date ( )
anulc = azi.getYear( );

17
 JavaScript

Alte metode ale obiectului Date:

 to GMT String ( ) relativ la Grenwich Mean Time;
 to LocaleString ( ) conversie la ora local;
 to String( ) - conversie n ir;
 parse (datestr) - conversie a datei n ir;
 UTC (date st) - Universal Coordonated Time (GMT) numr de milisecunde de la
Hristos.
Funcii proprii de conversie:
 escape (str) - convertete cod ESC n convenii HTML
 eval (str) evalueaz expresia str;
 parseFloat(str) convertete irul la variabil n virgul flotant ;
 parseInt (str, radix) - convertete irul la variabil ntreag;
 un Escape (str) - convertete din cod ESC n %XX - coduri HTML.

Exemple:
escape (" ") -> %20
unEscape ("%20") -> " "
parse Float ("10 Negri Mititei")=10
parseInt (103,8)=67
Z=eval("(X*14)-(X%2)+3)"); // eval ncearc s evalueze expresia ir i s-i returneze
valoarea.

Proprieti Globale JavaScript

Infinity - valoare numeric + sau -
NaN -"Not-a-Number" valoare
undefined indic faptul c variabila nu are assignat valoare
Funcii Globale JavaScript
decodeURI() Decodific URI
decodeURIComponent() Decodific un component URI
encodeURI() Codific un URI
encodeURIComponent() - Codific un component URI
escape() terminator de ir
eval() evalueaz un ir i execut daca este cod script
isFinite() - Determin dac valoarea este finit, numr legal
isNaN()- Determin dac valoarea nu numr
Number() Convertete valoarea unui obiect n numr
parseFloat() - Convertete valoarea unui obiect n numr flotant
parseInt() -Convertete valoarea unui obiect n numr ntreg
String() - Convertete valoarea unui obiect n ir
unescape() decodeaza i codeaz un ir

Obiectul RegExp
O expresie regulat este un object ce descrie un pattern de caractere (ablon) i se folosesc la
funcii "search-and-replace" n text.
Sintaxa
var patt=new RegExp(pattern,modifiers); sau var patt=/pattern/modifiers;
pattern specific ablonul expresiei
modifiers - specific dac o cutare este global, case-sensitive, etc.
Modificatorii sunt utilizai pentru case-insensitive sau cutri globale.
i - cutare case-insensitive

18
 JavaScript

g - cutare global
m- cutare multilinie
RegExp conine [ ], metacaractere i cuantificatori.
Proprieti RegExp
global - specific dac modificatorul er "g" este setat
ignoreCase - specific dac modificatorul er "i" este setat
lastIndex - index de la care ncepe urmtoarea cutare
multiline - specific dac modificatorul er "m" este setat
source - text din RegExp pattern
Metode RegExp
compile() compileaz o expresie regulat
exec() Testeaz potrivirile ntr-un ir i ntoarce prima potrivire
test()Testeaz potrivirile ntr-un ir i ntoarce true sau false

4.5.3. Obiecte Browser

Browserul este printele tuturor celorlalte obiecte JavaScript i este responsabil de crearea
tuturor ferestrelor browser. In plus acesta, ca i alte browsere, rspunde la evenimentele
generate de windows. Cu toate acestea, Internet Explorer, Opera, Mozila sau orice alt browser
nu este un obiect vizual ci poate fi accesat cu ajutorul constructorului vizual: windows sau
ferestrele acestuia. Obiectele browser sunt ierarhizate astfel: window - fereastra, document -
reflect structura HTML, location - ULR , navigator care gestioneaz informaii despre tipul
browserului, history - pagina anterioar vizitat, i screen asociat dispozitivului de ieire
(monitorul) Ierarhia este: Window, Navigator, Screen, History, Location

Obiectul window se asociaz unei ferestre browser i are ca fii documente, location i
history. Aceste sub-obiecte componente nu se refer explicit, ci prin metodele asociate:
document write( )
window document.write( )
Proprieti location screen
closed name screenLeft
defaultStatus navigator screenTop
document opener screenX
frames outerHeight screenY
history outerWidth self
innerHeight pageXOffset status
innerWidth pageYOffset top
length parent
Metode
alert() focus() resizeTo()
blur() moveBy() scroll()
clearInterval() moveTo() scrollBy()
clearTimeout() open() scrollTo()
close() print() setInterval()
confirm() prompt() setTimeout()
createPopup() resizeBy()
Manipulatori de eveniment
onLoad
onUnload
onFocus
onBlur
onError
onResize

19
 JavaScript

Metodele document pot fi utilizate i n cadrul obiectului window:

alert(sir) - afieaz o caset de dialog;
confirm(mesaj) - afieaz o caset de dialog cu dou butoane OK, CANCEL;
prompt(mesaj) - afieaz un propter.
Dac un document conine cadre (tag <frame> sau <iframe>), browserul creaz cte un
obiect window pentru documentul HTML, i unul adiional pentru fiecare frame. Nu este
standard public dar majoritatea browserelor l suport.
Proprietile ferestrei ntorc valori booleene sau iruri de caractere. Vom trece n revist
propretile cele mai frecvent utilizate n realizarea scripturilor.
closed este utilizat pentru a verifica dac fereastra anterior deschis s-a nchis deja.
Exemplu:
In seciunea <head> 3 a documentului HTML vom poziiona scriptul:
<script type="text/javascript">
<!--
var newWin;

function popNewWin() {
newWin=window.open("","","status,width=200,height=200,top=300,left=300");
}

function checkWin() {
if (!newWin || newWin.closed) {
alert("Fereasta nchis!");
}
else {
newWin.focus();
}
}
//-->
</script>
In seciunea <body> vom intercala codul:
<form>
<input type="button" name="win" value="deschisa" onClick="popNewWin()"><br>
<input type="button" name="win" value="inchisa" onClick="checkWin()">
</form>

Explicaia codului:
Variabla newWin se definete null (fr a o iniializa), valoarea fiind dat n funcia
popNewWin. Dac fereastra nu este nchis scriptul va produce eroare deoarece variabla nu a
fost declarat deja. Funcia popNewWin initializeaz variabila newWin cu metoda
window.open() specific obiectului window, n care este gestionat starea ferestrei i
dimensiunea acesteia.

Bara de stare este localizat n partea de jos a browserului i este controlat de proprietatea
defaultStatus care permite n plus i setarea unui mesaj specific asociat ferestrei deschise.
close( ) - nchide fereastra;
open(sir URL, nume fereastr) deschide o nou fereastr;

Dac alert afieaz dialog box cu mesajul sir i butonul OK, confirm are 2 butoane OK i
3
Pentru o mai bun nelegere a funcionalitii am utilizat unele exemple din The Core JavaScript 1.5.
Reference Manual, care poate fi downloadat n format zip

19
 JavaScript

CANCEL i returneaz true sau false n funcie de selecia utilizatorului. Prompt (mesaj) a
folosit o caset dialog cu un cmp editabil n care utilizatorul introduce irul mesaj, open
permite deschiderea unei noi ferestre, unde sirURL este ULR-ul ncrcat n acea fereastr iar
metoda close nchide fereastra.
Majoritatea componentelor pot fi manipulate n manier yes/no la momentul crerii ferestrei.
Acestea includ: meniuri, bare cu butoane, locaia i starea afiat, lista istoric i scroollbars.
La momentul crerii ferestrei se poate determina dac fereastra poate fi redimensionat sau i
se pot regsi dimensiunile. Dar apare o restrictie pentru c rescriind documentul se pot
modifica elemente componente ale ferestrei i aceast tehnic permite modificarea valorilor
elementelor din formular, a barei de stare, a poziiei pointerilor n lista istoric i a locaiei
(URL-ul afiat n fereastr) n orice moment.

Orice fereastr este asociat obiectului document. Acest obiect conine proprieti pentru
fiecare ancor, legtur sau form a paginii la fel ca i subelemente ale acestor obiecte
componente. De asemenea, conin proprieti pentru title, primplan (fgColor) i fundal
(bgColor), variante legturi de culoare i atribute de pagin.
Metodele asociate:
 clear( ) - terge documentul;
 close( ) - nchide documentul;
 open( ) - deschide documentul;
 write(str) introduce un ir n document;
 writeln(str) introducere <CR>
Exemplu:
<html>
<head>
<title> Manipularea barei de stare</title>
<script>
var aStatWin=null;

function openStatus(defmsg,msg) {
aStatWin=window.open(' ','statWin', toolbar=no, location=no, directories=no, status=yes, scrollbars=no,
resizable=yes, copyhistory=no, width=450, height=2);
if (aStatWin !=null) {
aStatWin.document.write('<form name="dform" > <input type=text
name="dummy"></form>')
aStatWin.document.close
aStatWin.defaultStatus = defmsg
aStatWin.status = msg
setFocus()
}
}

function setStatus() {
if (self.aStatWin ==null)
alert("Status Win inchisa")
else
{self.aStatWin.status=document.statForm.statMsg.value
setFocus()
}
}

function setFocus() {
self.aStatWin.document.dform.dummy.focus()
}

function close() {

20
 JavaScript

self.aStatWin.close()
aStatWin=null
}

function fixup() {
blankWin=window.open(' ','blankWin', toolbar=no, location=no, directories=no, status=yes,
scrollbars=no, resizable=yes, copyhistory=no, width=600, height=240');
blankWin.close()
}
</script>
</head>
<body onload='fixup()'>
<form name='statform'>
.....
<input type=button value="starea ferestrei" onclick='openstatus("starea ok", document.statform.statmsg.value)'>
</form>
</body>
</html>
In exemplul anterior se poate observa cum se deschide o fereastr redimensionabil n care se
afieaz starea.

Obiectul navigator
Acest obiect este utilizat pentru a obine informaii despre tipul de browser ce va fi utilizat la
accesarea pagini, informaii extreme de utile cnd utilizatorul este nevoit s (re) directeze n
diferite pagini sau s execute taskuri specifice, dependente de un browser specific.
Propieti
appCodeName
appName
appVersion
cookieEnabled
platform
userAgent
appCodeName ntoarce numele intern al browserului, dar nu este att important precizarea
browserelor Mozilla n Firefox, Netscape, IE, sau Opera.
appName - ntoarce numele 'oficial' al browserului (spre exemplu IE ntoarce Microsoft
Internet Explorer i Firefox i Netscape ntorc ambele Netscape. Utilizatorii Opera pot
schimba identitatea browserelor, ca s apar ca Netscape, Opera, sau Microsoft Internet
Explorer.
appVersion - ntoarce versiunea browser (IE versiunea 4-6 apare 4.0 iar Netscape 6 ntoarce
5.0. Firefox, ce ruleaza cu browser versiune 1.07, ntorce 5.0 deoarece folosete acelai motor
Mozilla ca Netscape.
cookieEnabled este utilizat pentru a verifica dac browserul accept cookies:
if (navigator.cookieEnabled) {
// code for cookie here
}platform
userAgent - aceast proprietate ntoarce un ir ce conine browser, numr de versiune, sistem
de operare, exceptnd IE, default language pentru browser.
Exemplu:
Mozilla/5.0 (Windows; U; Win98; en-US; rv:1.7.12) Gecko/20050915 Firefox/1.0.7

Proprietile obiectului navigator se pot obine cu script-ul:

var browser="Browser Information\n";
for (var propname in navigator) {
browser += propname + ": "

21
 JavaScript

+ navigator[propname] + "\n"
}
alert(browser);
Metode
javaEnabled() Specific dac browserul este Java enabled
taintEnabled() - Specific dac browserul are data tainting enabled

Obiectul screen
Acest obiect furnizeaz informaii despre video display i setarea culorilor utilizatorului.
Aceste informaii ajut la formarea optim a datelor afiate ecranul pe ecranul utilizatorului.
Proprieti
availHeight
availWidth
colorDepth
height
pixelDepth
width
Aceste 2 proprieti (availHeight, availWidth) ntorc zona actual vizibil n fereastra
browserului (the viewable portion of the screen within the browser), spre deosebire de height
i width care dau dimensiunea actual a ntregului ecran (pixeli). Redimensionarea ferestrei la
valoare maxim poate fi realizat cu scriptul:
window.moveTo (0,0);
window.resizeTo (screen.availWidth, screen.availHeight); //

La nceput browserul se mut stnga sus (0,0) apoi browserul redimensioneaz de la prezenta
poziie sau poate fi mutat cu metoda moveTo i redimensionat din noua poziie
window.moveTo (30,15);
window.resizeTo (screen.availWidth, screen.availHeight);
Exemplu:
if (screen.width < 639) {
document.write("Hello ")
}
else if (screen.width == 640) {
document.write("<img src=630px.gif>")
}
else if (screen.width == 800) {
document.write("<img src=750px.gif>")
}
else (screen.width >= 1024) {
document.write("<img src=850px.gif>")
}

Obiectul history este utilizat pentru a referi liste istoric ale URL-urilor vizitate anterior i are
o proprietate length care indic numrul de URL-uri nmagazinate sau lista istoric.
Metodele proprii sunt:
 back - deplasare la URL-ul anterior;
 foreward ( ) - deplasare la pagina urmtoare;
 go (where)
Metoda go este utilizat pentru navigarea n lista istoric, argumentul where este
numeric sau sir. Un numr pozitiv deplaseaz nainte i cel negativ deplaseaz napoi; where
poate fi un ir = URL.
Exemplu:
<form>
<input type="Button" name="back" value="Go Back"

22
 JavaScript

onClick="history.back()"> // inapoi
<input type="Button" name="forward" value="Go Forward"
onClick="history.forward()"> // inainte
</form>

history.go(1) // inainte
history.go(-2) // inapoi 2 pagini

Obiectul location descrie URL-ul documentului i are proprieti reprezentnd variante

componente ale URL: partea de protocol, partea hostname, path, numr port. Metoda toString
se utilizeaz pentru conversia la ir. Location ine informaii despre URL-ul unde acceseaz
browserul i conine parametri ai HTML-ului examinat via butonul Submit sau prin procedur
submit.
Proprieti
hash
host
hostname
href
pathname
port
protocol
search
Metode:
assign()- ncarc un nou document
reload()- rencarc un document
replace()- nlocuiete un nou document cu altul nou

In Netscape obiectul location const din urmtoarele pri:

protocol://hostname:[port] pathname search hash
unde:
protocol - este protocolul utilizat pentru fiier (http, ftp, gopher, telnet, file,
mailto);
hostname i port - sunt valide numai dac documentul este pe un server la
distan i conine nume_domeniu sau adres IP a serverului respectiv portul
serverului;
pathname -d calea fiierului pe care l afieaz browserul;
search - include POST parametri;
hash - reprezint o legtur cu o ancor local.

Obiectul location are proprietatea host constnd din combinaii hostname i port, precum i
href ce conine ntregul URL.
Exemplu:
<html>
<head>
<title> Obiectul location </title>
<script>
document.write (location.href)
document.write (location.protocol)
document.write (location.hostname)
document.write (location.host)
document.write (location.port)
document.write (location.pathname)
document.write (location.search)
document.write (location.hash)
</script>

23
 JavaScript

</head>

</html>
Metoda reload rencar pagina curent n browser, mai complex i mai putin dependent de
funcia similar (reload button) din browser. Utlizd metoda reload() se ncarc din cache,
innd form-ul intact. Utiliznd reload(true) pagina se rencarc de pe server, tergnd
coninutul cmpurilor din form i ncrcnd o copie nou a paginii.
Examplu:
location.reload();
sau
location.reload(true);
Metoda replace() nlocuiete pagina curent din browser history astfel nct utilizatorul nu
poate naviga back la ea. Este util la pagini ce se acceseaz cu password sau registration, care
nu mai in urma URL n lista history a browserului.
Examplu:
<form>
<input type="Button" name="change" value="Change page"
onClick="location.replace('newFile.html')">
</form>
E recomand plasarea acestor evenimente n funcii apelate din pagin astfel:
function changePage() {
location.replace("newFile.html");
}
Then place this in the body section:
<form>
<input type="button" value="Change page"'
onClick="changePage()">
</form>

4.6. Navigarea i evenimentele browser

Prin tag-urile de legtur ale documentelor HTML, referina este specificat ca locaie URL
fie cu protocol WWW fie cu mailto sau ftp, Gopher etc.
Exemplu:
<a href="http://www.site.com">Pagina test </a>
JavaScript definete tipul URL JavaScript folosind history:
<a href ="javascript:history.go(-1)">napoi </a>
La click pe legtur browserul deplaseaz la pagina anterioar din lista istoric. Protocolul
evalueaz expresia ca o locaie, iar irul de caractere poate reprezenta o locaie.
Exemplu:
var locatie="http://www.netscape.com"
<a href="javascript.location">
Protocolul about: utilizat ca locaie de legtur furnizeaz informaii despre Navigator. Fr
argumente d rezultat identic ca i selectarea About Netscape din meniul Help. Argumentul
plug-ins permite afiarea paginii la fel ca i Plug-Ins din fereastra Help. Argumentul plug-ins
permite afiarea paginii la fel ca i Plug-Ins din fereastra Help iar argumentul cache permite
afiarea statisticilor de disponibilitate pe disc.
Exemplu:
<html><head><title> Despre about </title>
</head>><body>
<p> protocolul about
<ul><li>
<a href="about:"> despre: </a><li>
<a href="about.cache">about: cache </a><li>

24
 JavaScript

<a href="about.plug-ins">about:plug-ins </a><li>

<ul>
</body></html>
Proprietile obiectului link sunt accesibile prin:
document.links[index].property_name
Numrul de index asociat fiecrui obiect link este ncrcat de browser pornind de la o (prim
legtur), 1 - a doua, etc.
Folosind atributul name n legtur se acceseaz proprietile prin:
document.nume.proprietate
Exemplu:
<a name="leg1" href=http://www.macromedia.com>alteinf </a>
document.leg1.pathname sau document.leg1.protocol
De cte ori de folosete atributul NAME n cadrul JavaScript se adaug o nou
ancor.Obiectul link recunoate i evenimentele onClick i onMouseOver.
Exemplu:
<a name="numep" href="http://www.alfa.cdec.ro"
onMouseOver="Window.status='Vizitati site-ul firmei' ; return true "> Alfa </A>
Prin aceasta, n bara de stare se afl mesajul: "Vizitai site-ul firmei" de oricte ori mouse-ul
se afl pe hyperlink. Dac se utilizeaz bara de stare, trebuie inclus return true. Aceasta nu
ine seama de faptul c multe browsere afieaz URL-ul n bara de stare la acest eveniment.
Dac se folosete o legtur de tip: http://www/cris.com/~raydaly/sponsors.html
n bara de stare se afieaz mesajul "hiperlink cu sponsorul".
Evenimentul onClick se folosete n acelai format ca i onMouseOver.
Exemplu
<a name="mesaj" href="http//www.altsite.com"
onClick="alert ('Multumim de vizit')">Vizitai site-ul </a>

Observaii:
 Cnd se ataeaz href ca atribut n link este afiat n bara de stare.
 Utiliznd onClick se poate seta href pentru un alt URL. Citind bara de stare utilizatorul
se asigur c se deplaseaz spre primul URL, dar codul JavaScript l trimite ctre URL-ul
specificat n onClick. Pentru a evita confuzia se recomand adugarea evenimentului
onMouseOver.
Exemplu:
<a name="cutare" href="http://www.yahoo.com"
onClick="this.href='http://www.infoseek.com'"
onMouseOver="Window.status='Vom face o nou cutare; return true">
Cutare pe Internet dup topic </a>

Modificarea legturii nu i a textului afiat poate fi realizat prin funcii JavaScript ca i n

exemplul urmtor:
<html>
<head><script>
function Text1( ){
azi=new Date( )
ora=azi.getHours( )
if (ora>18){
nouURL="http://www.yahoo.com/"
}else{
nouURL ="http://www.Yahoo.com/text/"
}
return nouURL
}

25
 JavaScript

</script><head>
<body>
<a name="legtura Yahoo" HREF=" "
onClick="this.href=Text1()"
onMouseOver="window.status='Hyperlink Yahoo' ; return true ">
Yahoo </a>
</body>
</html>

URL-ul nu este ntotdeauna Web ci poate fi chiar o adres e-mail:

Exemplu:
<html><head></head>
<body>
<form>
<B> Ce furnizor cutai? <B> <BR>
<input type="radio" NAME="tip"
onClick="furnizor=''mailto:codec@codec.com'"> Firma Codec <BR>
<input type= " radio" NAME = " tip"
onClick="furnizor = ' mailto: transart @ transart.ro' " >Firma TransArt <Br>
</form>
<A NAME="comanda" HREF= "mailto: info @ site.com"
onClick="this.href=furnizor"> Email la furnizor </A>
</body></html>

Cu ajutorul proprietii search se pot realiza operaii de cutare precizate dup ? i se poate
fora ncrcarea paginii setnd URL-ul obiectului location corespunztor respectivei pagini.
<html>
<head>
<title> Rencarcarea paginii </title>
<script>
function reload() {
astr=document.Forma1.Nume.value
astr=self.location.pathname +?+astr
self.location=astr
}
function clear() {
self.location= self.location.pathname
}
if (self.location.search !=null && self.location.search!= )
{
document.write(self.location.search)
}
</script >
<head>
<body>
<form name="Forma1">
Numele: <input type="text" name="nume" size="20">
<input type="button" name=reloadbt value="Reincarcarea paginii"
onClick=reload()>
<input type="submit" name=submitbt value="Examinez"
onClick=this.form.submit()>
<input type="button" name=clearbt value="sterg" onclick=clear()>
<input type="hidden" name=hidebt >
</form>
</body>
</html>
JavaScript organizeaz aceste obiecte n structur ierarhic prin title ca proprietate a
documentului (obiect) respectiv anchor, forms, links - proprieti de document. Toate
proprietile obiectului link sunt subiruri extrase ale proprietii HREF i reprezint: hash,

26
 JavaScript

host, hostname, href, pathname, port, protocol, search, target.

Exemple:
document.anchor [0]
document.links [0]
document.forms [0]
Proprietatea anchor sub forma "text".anchor("ancotext") este echivalent cu tag-ul HTML
<a name = "ancortext">text </a> iar proprietatea link "text".link("textleg") este echivalent
cu <a href = "textleg"> text </a>
Exemple:
Ancora n JavaScript
<a name = "seciunea 2">Startul</a>
Avar = "Startul"
Avar.anchor ("seciunea2") sau "Startul".anchor ("seciunea2")

Legtur n JavaScript
var textleg = "Ford"
var URL ="http://www.Ford.com"
document.open ( )
document.write ("Aceasta este o legtur"+ textleg.link (URL))
document.close( )
Echivalent cu:
Aceasta este o legtur la <a aref = "http://www. Ford.com">Ford </a>

Asupra irurilor incluse n ancore i legturi se pot aplica diferite metode de formatare
corespunztoare cu cele cunoscute din tagurile HTML. Alte metode de formatare i afiare
folosesc structura "text".metod (argument).
Exemple:
document.write ("text".blink( ).toUpperCase ( ).bold ( ) ) echivalent cu
TEXT (blink, bold)

4.7. Dynamic HTML

4.7.1. Obiectele HTML i modelul DOM

Standard W3C definete tabloul de elemente ca fiind component a formularului

elements[] ntoarce un tablou cu toate elementele din form

Propertietile Obiectului Form

acceptCharset Seteaz sau returneaz valoarea atributului accept-charset din form
action - Seteaz sau returneaz valoarea atributului action din form
enctype Seteaz sau returneaz valoarea atributului enctype din form
lengthReturneaz numrul elementelor din form
method - Seteaz sau returneaz valoarea atributului method din form
name - Seteaz sau returneaz valoarea atributului name din form
target - Seteaz sau returneaz valoarea atributului target din form

Metodele Obiectului Form

reset() - reseteaz un form
submit() trimite datele din form

Evenimentele Obiectului Form

27
 JavaScript

onreset
onsubmit

HTML DOM Obiecte Frame i IFrame

Obiectul Frame - reprezint un cadru HTML.

Tag-ul <frame> definete un cadru (fereastr) particular - window (frame) dintr-un set de
cadre -frameset. Fiecare tag <frame> creaz un obiect Frame.

Obiectul IFrame - reprezint un cadru interior HTML (inline).

Tag-ul <iframe> definete un cadru inline ce conine alt document.
Fiecare tag <iframe> creaz un obiect IFrame.

Propertietile Obiectului Frame/IFrame

align iframe
contentDocument- Seteaz sau returneaz documnetul din frame/iframe
contentWindow- Seteaz sau returneaz valoarea obiectului Window generat de frame/iframe
frameBorder- Seteaz sau returneaz valoarea atributului frameBorder din frame/iframe
Semnificaie corespondent au proprietile:
height noResize
longDesc scrolling
marginHeight src
marginWidth width
name

Evenimentul Obiectului Form este onload

DOM Obiect Frameset - represents un set de cadre HTML care gestioneaz 2 sau mai multe
cadre. Fiecare element frame reine un document separat. Elementele HTML frameset
statuteaz modul n care coloanele i rndurile sunt dispuse n frameset.

Propertieti
cols - Seteaz sau returneaz valoarea coloanelor din frameset
rows - Seteaz sau returneaz valoarea rndurilor din frameset
Eveniment: onload

JavaScript plaseaz formele ntr-un tablou forms. Fiecare form este accesat prin indexul
acestui tablou (o baz). Obiectul form (ca subobiect al documentului), are la rndul lui
subobiecte.Accesarea informaiilor despre aceast form se realizeaz cu ajutorul conveniilor
corespondente cu opinile HTML: action - din ACTION, element - din INPUT, endcoding -
din ENCTYPE, method - din METHOD, target - din TARGET.
Exemplu:
<html>
<head>
<title> Proprietile obiectului form </title>
<head>
<body>
<a name = "inceput"> inceputul paginii </a>
<hr>
<script >
<form name="forma1"
method= post action= "mailto:lrusu@econ.ubbcluj.ro">

28
 JavaScript

<p>numele: <input type="text" name="num" size="20">

</p>
<input type="reset" name=reset value="renunt">
<input type="submit" name=submit value="ok">
</form>

document.forms[0].method="GET"
document.write(document.forma1.method)
-->
</script>
</body>
</html>
In exemplul de mai sus s-a modificat metoda din POST n GET i rezultatul afiat va fi GET.
Metodele i proprieti ale formelor se pot obine folosind conveniile DOM 4 :
forma.Numepropr.
forma.Nume metod (parametrii)
forma[index].numepropr
forma[index].Numemetod (parametrii)

Forma1.Num.value valoarea obiectul text Num din forma Forma1

forms[0]. elements [0]. name (numele - Num al cmpului - din atributul NAME).

4.7.2. Manipularea obiectelor

Definim funcia getObject(obj), cu layout:

function getObject(obj) {
var theObj;
if(document.all) {
if(typeof obj=="string") {
return document.all(obj);
} else {
return obj.style;
}
}
if(document.getElementById) {
if(typeof obj=="string") {
return document.getElementById(obj);
} else {
return obj.style;
}
}
return null;
}
O variant mult mai simpl este:

function getObject(obj) {
var theObj;
if(document.all) {if(typeof obj=="string") {return document.all(obj);}
else {return obj.style;}}
if(document.getElementById)
{if(typeof obj=="string") {return document.getElementById(obj);}
else {return obj.style;}}return null;}
In acest caz se folosesc proprietile documentului i metoda getElementById(obj) .

4
DOM=Document Object Model

29
 JavaScript

DOM Image
Obiectul Image reprezint o imagine inclus. Fiecare tag <img> din documentul HTML,
determin crearea unui obiect Image, care nu este etnic inserat n HTML, ci doar legat de
pagina HTML. Tag-ul <img> tag creaz un spaiu reinut pentru imaginea refereniat.

Propertieti
align
alt
border
complete- intoarce momentul cnd browserul a terminat de ncrcat o imagine
height
hspace
longDesc
lowsrc
name
src
useMap
vspace
width

Evenimente
onabort- ncrcarea unei imagini este nterupt
onerror eroare la ncrcarea unei imagini
onload-- ncrcarea unei imagini s-a terminat

Zonele de text au funcionalitate multipl de la tip text, text multilinie (textarea) la cmpuri
ascunse i cmpuri parol.
 Imagini Rollover
n continuare este prezentat sursa pentru o pagin HTML, cu un script ce duce la modificarea
unei imagini grafice cnd cursorul este poziionat pe aceasta. Elementul cel mai important al
scriptului este c exist dou versiuni pentru fiecare imagine: imagine on (corespunztoare
cursorului poziionat deasupra imaginii) i imaginea off (corespunztoare cursorului
poziionat n exteriorul imaginii).
<script>
<!- -
//Dorim s obinem o imagine care s se modifice la poziionarea cursorului
logo_on = new Image(); // aloc spaiu pentru imaginea "on"
logo_off = new Image(); // i, de asemenea, pentru imaginea "off"
logo_on.scr = 'logo_on.gif ';// definete imaginile respective
logo_off.scr = 'logo_off.gif ';
function activate(image) { // comut imaginea din "off" n "on"
imagescr = eval (image +'_on.scr' );
document [image].scr = imagescr;
}
function deactivate (image) { // comut imaginea din "on" n "off"
imagescr = eval (image +'_off.scr' );
document [image].scr = imagescr;
}
//end of script -->

30
 JavaScript

</script>
<center>
<a href= logo.htm1
onmouseover="activate( 'logo' ); return true;"
onmouseout="deactivate( 'logo' ); return true;">
<img scr = logo_off.gif alt="[company logo]" border=0 name='logo'></a>
</center>
De exemplu, se doreste ntroducerea n pagin a unui buton, care la apsare va reciti
penultima pagin cerut.
<input type=button VALUE="Back 2" onClick="history.go(-2)">
ntre ,dup onClick pot fi puse mai multe comenzi JavaScript, desprtite cu ";" .

Obiectul text este utilizat pentru introducerea tipurilor diferite de informaii cu sintaxa:
<input type="text name=nume value="valoare" size=ntreg
[onBlur="text aciune1"] [onChange="text aciune2"] [onFocus="text aciune3"]
[onSelect="text aciune4"]>
Proprieti:
defaultValue- Seteaz sau returneaz valoarea atributului name din password
maxLength- Seteaz sau returneaz numrul maxim de carectere din password
readOnly- Seteaz sau returneaz valoarea atributului read-only
size- Seteaz sau returneaz valoarea atributului size din password
Metodele associate sunt: select iar manipulatorii de evenimente sunt: onBlur, onChange,
onFocus, onSelect.
Exemplu
<form>
<input type="text" name="datazilei" value=" "
size="5" onBlur="getDate( )" onChange="setDate( )"
onForms="alert('Introducei data')"
onSelect="alert('Dorii modificarea datei?')">
</form>

Obiectul textarea este utilizat pentru introducerea mai multor linii text i posed aceleai
proprieti i metode ca i obiectul text:
<text area name="zonatext" rows=ntreg
cols=ntreg wrap=on/off /physical/virtuale [onblur="text aciune1"]
[onfocus="text aciune2"] [onchange="text aciune3"]
[onselect="text aciune4"] text de afiat
</textarea>

DOM Input Button

Fiecare instan de tag <input type="button"> din form HTML, creaz un obiect Button.
Accesul la obiectul Button se poate realiza prin elements[] ca array din form, sau folosind
document.getElementById().

Proprieti:
form ntoarce referin la form-ul ce conine input button
name - Seteaz sau returneaz valoarea atributului name din input button
type - Returneaz tipul de button din form
value - Seteaz sau returneaz valoarea atributului value din input button
Aceste proprieti sunt valabile la urmtoarele obiectele din Form

31
 JavaScript

Obiectul button este declarat cu tag-ul INPUT:

<input type="button" NAME="nume" VALUE="valoare"
[onClick="text_actiune"]>
Exemplu:
<script>
function valid(){
.
}
</script>

<input type="button" name="avertiz" value="Apas"

onClick="valid( )">

El poate fi apelat ca: avertiz.name sau avertiz.value.

Obiectul FileUpload
Obiectul FileUpload reprezint un input control single-line text i un buton browse din
formularul HTML i permite ncrcarea fiierului pe uploading to a server. Prin Click se
deschide fereastra de dialog ce permite userului selecia fiierului de ncrcat. Fiecare tag
<input type="file"> determin crearea unui obiect FileUpload. Accesul la obiect se poate
realiza prin elements[] ca array din form, sau folosind document.getElementById().

Proprieti:
accept- Seteaz sau returneaz lista, separat cu virgule a coninuturilor acceptate

Obiectul Hidden
Pentru crearea formelor interactive se folosesc adesea obiecte ascunse pentru a transfera
informaia spre server, atunci cnd forma este examinat. Acestea sunt de obicei informaii
despre utilizator (ultimul acces la pagin, preferine generate de setri n forma anterioar
etc.). Aceste cmpuri sunt, de obicei, utilizate n locul "cookies" ale Netscape-ului pentru a
realiza compatibilitatea cu browserele care nu suport specificaia cookie. Cmpurile ascunse
conin informaia text care nu sunt afiate pe ecran odat cu restul formei i se declar:
<input type="hidden" name="nume" [value="textval"]>
Exemplu
<form>
<input type="hidden" name="unul" value="aici">
</form>
document.write(unul.value);
Cmpurile ascunse se folosesc pentru a plasa un "rest ascuns" n site-ul Web care poate fi
regsit de ori cte ori se examineaz forma. Servarul poate citi acest text ntr-un script CGI i
s dea rspuns utilizatorului. O alt modalitate de utilizare este cea n jocuri Web sau teste
Web la care punctajul este pstrat ntr-o locaie i este transmis de fiecare dat cnd
utilizatorul se deplaseaz ntr-o alt locaie.

Obiectul Password (parol) este folosit n special la accesarea condiionat a unui site i se
declar:
<input type="password" name="nume" size=intreg [value="val.text"]>
Proprieti:
defaultValue- Seteaz sau returneaz valoarea atributului name din password
maxLength- Seteaz sau returneaz numrul maxim de carectere din password
readOnly- Seteaz sau returneaz valoarea atributului read-only
size- Seteaz sau returneaz valoarea atributului size din password

32
 JavaScript

Metode: select() Selecteaz coninutul password

Exemplu:
<script>
function verpar (parola){
if(notpass){
alert("Ati greit parola!");
parola.focus();
parola.select();
}
function notpass {
//test validitate
}
<form onSubmit="verpar(this)">
<input type="password" name="parola">
</form>

Obiectul Checkbox ia valori on/off i selecia lui este marcat cu x sau alt tip de marcator
selectat, fiind declarat cu sintaxa:
<input type="checkbox" name="nume" value="valoare" [checked]
[onClick="text_aciune"]>text de afiat
Proprietile acestuia sunt: checked (true/false) - utilizat la verificarea checkbox,
defaultchecked - atunci cnd checkbox este verificat la ncrcarea paginii, name- nume,
value - valoare. Metodele proprietii sunt accesate analog cu button.
Exemplu:
<html><head>
<script >
function starea() {
document.forma1.VER.checked)?
alert("caseta selectata!"):
alert("Nu este selectata caseta!"):
}
</script> </head><body>
<form name=forma1 >
<input type="checkbox" NAME="ver" VALUE="Part time"
onClick="starea()">
</form>
</body></html>

Obiectul Radio permite selecia unei opiuni din multitudinea oferit.

<input type = "radio" name="nume" [checked]
[onclick="text_aciune"]>Textul afiat
Accesarea informaiilor butonului RADIO este puin diferit fa de checkbox datorit
posibilitilor de selecie.

Utilizarea seleciilor este realizat pornind de la sintaxa:

<select name="nume selecie" [size="ntreg"][multiple]
[onblur="textaciune1"]
[onchange="textaciune2"] [onfocus="textaciune3"]
<option value="valori optiuni"[selected]
text afiat
<option> [text afiat]
</select>

Tag-ul select are un atribut name obligatoriu care mpreun cu valorile asociate n opiunile
option sunt trimise serverului cnd forma este examinat. Atributul name poate fi folosit ca

33
 JavaScript

ancor iar atributul multiple permite selecia unora sau mai multor elemente. Acest tip de list
se numete scrolling list. Listele de secie au asociai handleri de tip onChange, onBlur i
onFocus.

DOM Option
Option Object reprezint o opiune din lista dropdown dintr-un form HTML. Fiecare tag
<option> creaz un obiect Option. Accesul la obiect se poate realiza prin elements[] ca array
din form, sau folosind document.getElementById()

Proprieti:
defaultSelected- Returneaz referina la valoarea atributului selectat
form
index- Seteaz sau returneaz index de poziie a opiunii din dropdown list
selected- Seteaz sau returneaz valoarea atributului selected
text- Seteaz sau returneaz text la atributului option
value- Seteaz sau returneaz valoarea ce va fi trimis pe server

DOM Select
Obiectul Select reprezint list dropdown dintr-un form HTML. Dropdown list permite
userului selecia uneia sau mai multor opiuni dintr-un numr limitat de posibiliti. Fiecare
tag <select> creaz un obiect Select. Accesul la obiect se poate realiza prin elements[] ca
array din form, sau folosind document.getElementById()

Select Object Collections

options- Returneaz o colecie de opiuni din dropdown list

Proprieti:
form
length- Returneaz numrul de opiuni din dropdown list
multiple- Seteaz sau returneaz itemi multimpli din dropdown list
name
selectedIndex- Seteaz sau returneaz indexul opiunii selecteate din dropdown list
size - Seteaz sau returneaz numrul opiunilor vizibile din dropdown list
type- Returneaz tipul de element din dropdown list

Metode
add()
remove()
Aceste obiecte asigura posibilitatea de a crea meniuri dinamice

Obiectul Submit n HTML este butonul formal utilizat pentru a trimite forma spre server. In
JavaScript acest buton poate fi utilizat pentru a trimite informaiile colectate ntr-o form ctre
o alt fereastr sau n aceeai fereastr, ceea ce determin modificarea coninutului acesteia.
La click pe butonul submit se ncarc ntotdeauna noua pagin chiar dac este deja submis.
<input type="submit" name="nume" value="text" [onclick="text aciune"]>

Obiectul Reset permite utilizatorului readucerea cmpurilor de intrare la valorilor iniiale:

<input type="reset" name="nume" value="text" [onclick="text aciune"]>
Accesul la metode i proprieti se face similar cu celelalte butoane.

34
 JavaScript

4.8. Procesarea codului JavaScript

4.8.1. Legturile dinamice n scripturi

Un alt aspect important este legtura dinamic sau static. Multe limbaje compilatoare ca i
C, C++ sau Java insist deseori asupra legturii statice, ceea ce implic faptul c ele solicit s
gseasc toate numele la momentul compilrii programului, cu ajutorul bibliotecilor alocate
dinamic. JavaScript utilizeaz forme libere i legturi dinamice 5 . Aceasta nseamn c decide
asupra numelui la momentul utilizrii acestuia, dat fiind faptul c interpretorul face legtura
abia la momentul execuiei codului.
Un avantaj major al legturii dinamice o constituie faptul c ofer posibilitatea adugrii
facile de noi funcii. Avnd nevoie un event handler (intermediar de evenimente) pentru
fiecare eveniment posibil, se ncepe cu unul sau doi manipulatori crora gradat li se adaug
funcii complexe. Dezavantajul este dat de faptul c JavaScript citete coduri cuprinde ntre
<script> i </script> prelucrnd i verificnd n timpul execuiei, ceea ce conduce la
detectarea tardiv a erorilor i la analiza exhaustiv a codului.
Exemplu:
<html><head>
<script>
function nuapasa() {
alert("ati ales!")
}

</script> </head><body>
<form method="post" action="mailto:lucia.rusu@econ.ubbcluj.ro">
<input type="button" name="verific" value="nu"
onclick="nuapasa()">
</form>
</body></html>

Handlerul de evenimente creaz un buton pereche cu funcia JavaScript din blocul script iar
dac schimbm declaraia intermediar cu: onClick="apasa()" se observ la execuie cum
funcioneaz legtura dinamic. JavaScript nu tie la execuie c funcia apasa() nu
corespunde nici unei definiii i ncearc s o gseasc, ceea ce a determina o eroare. Tehnic
vorbind funcia apasa() este desfcut (unbound).
Fa de aceste inconveniente tratate, apar cteva avantaje semnificative:
 Obiectele pot fi definite i refcute "din zbor", n mod dinamic;
 Legtura dinamic permite referirea lucrurilor care nu exist, dar care apar n
momentul cnd sunt activate de handler;
 Ofer posibilitatea modificrii tipului de variabil, care ns poate deveni o capcan
periculoas n programare;
 Codul se analizeaz la regsirea n blocul SCRIPT i se execut condiionat de
eveniment;
 Numele sunt rezolvate atunci cnd sunt executate nu atunci cnd sunt analizate.

Agentul asociat evenimentului mouseOver nu este asociat tag-ului <body> ci acioneaz cnd
utilizatorul plaseaz mouse-ul peste o referin (HREF), cu meniunea c JavaScript are
evenimente asociate referinelor i nu ancorelor.
Exemplu:
<html><head>
<script >
<!--

5
Late binding sau runtime binding

35
 JavaScript

function afisez(leg) {
alert("Legtura selectata:");
.
}
</script> </head>
<body>
<HR> Verificam legatura cu
<a href="http://www.econ.ubbcluj.ro" onMouseOver="afisez(this)"> ECON </a>
<a href="http://www.ubbcluj.ro" onMouseOver="afisez(this)"> UBB </a>
</body></html>
In exemplul de mai sus s-a creat o pagin legat cu ECON respectiv UBB cu alte dou pagini.
Cuvntul rezervat this este utilizat pentru a referi obiectul curent. La apelul funciei de
afiare parametrul leg este completat cu obiectul care reprezint legtura. Evenimentul click
se utilizeaz fie pentru avertizarea utilizatorului, fie pentru abandonarea legturii.

4.8.2. Examinarea i validarea formelor

Incluznd n tag-ul <form>, atributele METHOD i ACTION se permite utilizarea agentului

onSubmit pentru examinarea formei, declannd o aciune la nivel general (al ntregului
coninut) dei este posibil specificarea acestei aciuni doar la nivelul butonului Submit din
form. Utilizarea natural a agentului onSubmit este validarea de coninut.
Exemplu:
<html><head><title> Exemplu de validare</title>
<script>
function verifica() {
var strval=document.formam.textm.value;
var intval=parseInt(strval); //conversie la intreg.
if ((0 < intval) && (intval <10)) {
return(true);
} else {
alert("valoarea introdusa"+strval+"depaseste intervalul");
return(false);
}
}
</script> </head>
<body>
Verificam legatura cu

<body>
<form name=formam" method=post onsubmit=verifica()">
<p> optam pentru primele 9 teste
<input type="text" name='textm" value='1' size="10"></p>
<br> <input type='submit">
</form>
</body></html>
Explicaiile codului: var strval=document.formam.textm.value; presupune obiectul document,
forma denumit formam, cmpul text textm i valoarea acestuia value. Primul tag INPUT
definete un cmp de editare text iar al doilea un buton submit controlat de funcia verific().
Aceast funcie convertete valoarea n ntreg (prin parseInt) i testeaz validitatea datelor
introduse.
Butoanele genereaz evenimente click iar textul i selecia elementelor de list genereaz
evenimente focus, blur, select i change. Prima excepie se aplic listelor de selecie care de
vreme ce nu au cmpuri editabile, nu genereaz evenimente select. Dac tag-ul poate avea
atribute de declarare focus, blur, change, OPTION nu genereaz evenimente proprii. A doua
este dat de cmpurile ascunse (hidden) care nefiind vzute, nu genereaz nici un eveniment.
Un grup de butoane poate fi testat printr-un index unic asociat acestora.

36
 JavaScript

Exemplu:
<html><head><title> Doua selectii</title>
<script>
function verplata() {
var eordin=document.formam.plata[1].checked;
var easig=document.formam.asigura.checked;
var ok=null;
//test de plata
if (eordin= true && easig !=true) {
ok=confirm("Doriti asigurare?");
if (ok==true) {
document.formam.asigura.checked=true;
}
}
}
</script> </head>
<body>
<form name='formam" method=post>
<strong> optiuni de plata </strong><br>
<input type="radio" name='plata" value='1' checked onclick="verplata()"> cec
<input type="radio" name='plata" value='2' checked onclick="verplata()"> ordin de plata
<hr> <input type="checkbox" name="asigura" value="asig">asigura?
</form>
<hr>
</body></html>
In exemplul de mai sus am definit doua butoane radio plata i un checkbox asigura validate
prin functia verplata. Pentru cmpurile text apare evenimentul focus, la click mouse sau
deplasarea tab n interiorul cmpului editat, blur, cnd focus pierde cmpul, change la
introducerea sau tergerea unui caracter din text sau la o nou selecie (pentru listele de
selecie) respectiv select pentru selectarea unui cmp (click-and-drag, double-click),
eveniment care este nsoit i de efectul vizual asupra cmpului selectat. Pentru TEXTAREA
dac utilizatorul nu tiprete nimic sau nu acioneaz click evenimentul blur nu apare.

Exemplu:
Ancorele se utilizeaz pentru deplasarea rapid n cadrul documentului, sub controlul
evenimentelor focus i select. Frecvent apar n chestionar la care rspunsul la o ntrebare
condiioneaz alte ntrebri sau la etichete ce permit salt n cadrul documentului.
Exemplu:
<html><head><title>Exemplu ancor </title>
<script >
<!--
function salt2 (form) {
if (form.q1.value>11)>{
alert ('Se sare peste ntrebarea 12');
form.q2.value="FREE";
window.location="#a12";
}
if (form.q1.value<0){
alert('Nu v putei ntoarce aici');
form.q1.value=" ";
form.q1.focus ( );
form.q1.select ( );
}
}
</script></head>
<body><form>
<input name="q1" type="text" onblur="salt2 (this.form)"> <br>
<a name="a2">

37
 JavaScript

<b>2.
<input name="a2" type="text"> <br>
<input name="q2" type="text" onblur="salt2 (this.form)"> <br>
.. Intrebri

<a name="a12"><input name="q12" type="text">
...
</form>
</body>
</html>

4.9. Crearea i manipularea obiectelor

4.9.1. Soluia JavaScript

Obiectul Link
Reprezint un element de legtur HTML i trebuie plasat n interiorul seciunii head din
documentul HTML, cu specificarea legturii spre resursa extern. Utilizarea comun a tag-
ului <link> este link la style sheets extern.

Proprieti
charset- Seteaz sau returneaz valoarea setului de caractere din documentul de legtur
href - Seteaz sau returneaz valoarea atributului URL din din documentul de legtur
hreflang- Seteaz sau returneaz limbajul
media- Seteaz sau returneaz tipul media
rel- Seteaz sau returneaz relaia dintre documentul curent i cel legat
rev- Seteaz sau returneaz relaia invers dintre documentul de legtur i cel curent
type- Seteaz sau returneaz tipul de coninut a documentului de legtur

DOM Meta
Tag-ul <meta> trebuie plasat n n interiorul seciunii head din documentul HTML i conine
metadate ale acestuia. Meta-elementele conin descrierea paginii, keywords, autorul
documentului, ultima modificare (last modified), etc. i pot fi folosite de browsere pentru a
indica modul n care se afieaz coninutul paginilor rencrcate , de motoarele de cutare
(search engines prin keywords), sau alte web services.

Proprieti
content- Seteaz sau returneaz valoarea atributului din meta element
httpEquiv - Seteaz sau returneaz header HTTP pentru informaii din atributul content
name- Seteaz sau returneaz header HTTP pentru informaii din atributul content
name - Seteaz sau returneaz valoarea atributului name pentru informaii din atributul
content
scheme- Seteaz sau returneaz modul cum atributul content trebuie interpretat

JavaScript este un limbaj orientat-obiect, motiv pentru care are predefinite un set de obiecte.
Obiectele sunt legate prin intermediul unor relaii ntr-o varietate de componente ale unei
pagini Web. Pentru vizualizarea i manipularea acestor structuri, se utilizeaz proprietile, ce
pot fi reutilizate ca obiecte JavaScript pentru nmaazinarea datelor i funciilor. Uzual se
folosesc funcii pentru a manipula n od specific datele ca metode ale obiectului JavaScript
va lega resurse i obiecte att la client ct i la server. Obiectul Date spre exemplu
nmagazineaz data i timpul. Relaiile ntre obiecte i instanele unui obiect sunt similare cu
relaiile ntre tipuri de date i variabilele acestor tipuri de date.

38
 JavaScript

Obiectul Object
Obiectul object reprezint un element obiect HTML.
Tag-ul <object> include obiecte ca image, audio, videos, Java applets, ActiveX, PDF, and
Flash in webpage.

Proprieti
align
archive- Seteaz sau returneaz un ir ce poate fi folosit la implementarea unei arhive
funionale proprii
border
code- Seteaz sau returneaz URL ce conine clasa compilat Java
codeBase- Seteaz sau returneaz URL-ul componentei
codeType
data
declare
form- Returneaz o referin la printele object parent (form)
height
hspace
name
standby- Seteaz sau returneaz un mesaj la ncrcarea obiectului
type- Seteaz sau returneaz content type la datele downloadate via atributul data
useMap
vspace
width

DOM Style
Obiectul Style reprezint un stil individual. El poate fi accesat din document sau din
elementele cruia I se aplic stilul.
Sintaxa de utilizare a proprietilor obiectului Style:
document.getElementById("id").style.property="value"
Alte categorii de proprieti:
Background
Border/Outline
Generated Content
List
Misc Margin/Padding
Positioning/Layout
Printing
Table
Text

Obiecte proprii

Definirea unui obiect poate fi realizat n mai multe moduri:

Produs Obiectfunction Produs(den, um, pret, cant) {
this.denumire=den;
this.unitmas=um;
this.pu=pret;
this.cant=cant;
}

39
 JavaScript

Instanierea unui obiect se realizeaz cu new:

var calculator= new produs("Pentium", "buc", 31000000, 3);
Instana calculator se trateaz ca orice variabil i se definete utiliznd var. Proprietile
obiectelor i tipul acestora similare cu variabilele, iar JavaScript utilizeaz indexarea o baz
calculat, tratnd obiectele ca tablouri astfel:
calculator [0] = "pentium";
calculator [1] = "buc";
calculator [2] = 31000000;
calculator [3] = 3;
Pentru obiectul anteritor definit scriem funcia de afiare a proprietilor acestuia:
function showprodus(unprodus)
for (var iter=0; iter < 4; iter ++) {
document.write ("<BR> "Proprietatea"+iter + "este" +unprodus [iter] );
}
document.write ("<BR>");
}
Nu se poate apela showprodus(produs) iar eroarea de referire a unei proprieti inexistente
este: out of bounds error. Spre exemplu unprodus[4] se evit incluznd dimensionarea
proprietilor n cadrul obiectului prin proprietatea length; aceasta va deveni prima
proprietate a obiectului nou creat.
Exemplu:
function produs (den, um, pret, cant) {
this. length = 5; // 4 proprieti active i lungimea
this. denumire = den;
this. unitate = um;
this. preta = pret;
this. cantitate = cant;
}

function showprodus (unprodus){

var limita = unprodus. length;
for (var iter = 0; iter < limita; iter++){
document.write ("<BR>proprietatea"+iter+"este"+
unprodus [iter]);
}
document.write ("<BR>");
}
Toate proprietile semnificative se deplaseaz cu 1 astfel nct
Calculator = new produs ("Pentium", "buc", 31000000, 3) va da reprezentarea:
calculator[0] = 5;
calculator [1] = "pentium";
calculator [2] = "buc";
calculator [3] = 31000000;
calculator [4] = 3;
Lungimea obiectului este pus ntr-un singur loc n codul acestuia. Proprietile obiectului pot
fi referite nu numai ca tablou indexat ci i prin numele elementelor de tablou.
calculator [denumire] = "pentium";
calculator [unitate] = "buc";
calculator ["preta"] = 31000000;
Observaie:Tablourile JavaScript sunt accesate prin index ntreg sau proprietatea nume.

40
 JavaScript

Acesta este case-sensitive iar indexul este limitat la dimensiunea tabloului.

4.9.2. Utilizarea variabilei length i extinderea instanelor

Extensia dinamic realizeaz o completare local cu instane particulare. Aezarea obiectului

i alte instane trecute, prezente i viitoare nu sunt afectate. JavaScript d posibilitatea
extinderii dinamice a instanelor prin ataarea unor proprieti noi.
Exemplu
altprodus = new produs ("imprimant", "buc", 6000000, 1);
altprodus.canti = 3;
altprodus.cantc = 5;
altprodus are dou proprieti canti i cantc iar calculator are 4 proprieti. Dac nu se
modific dimensiunea obiectului cele 2 proprieti nu sunt afiate aa c se impune
modificarea dat de proprietatea length:
alt produs. length +=2;
Cnd proprietile obiectului sunt elemente de tablou i acestea sunt referite utiliznd indexri
numerice este uor s se foloseasc funcii de creare a tablourilor cu dimensiune variabil i
coninut. Numrul irului este primul argument i valoare iniial este al doilea argument.
function tablousir (cat, vali) {
this. length = cat;
for (var i = 1, i < = cat; i++){
this [i]=vali;
}
}
Apelul este realizat: obiectul meu = new tablousir (10, "nume"); iar actualizarea dimensiunii:
obiectulmeu [11] = "altul";
obiectulmeu [12] = true;
obiectul meu.length+=3;

Structura for poate fi utilizat la crearea obiectelor pe baza sintaxei:

for (numevar in nume obiect){..}
Exemplu:
function showany (unobj){
for (var iter in unobj){
document.write ("<BR> proprietatea"+iter+"este" +unobj[iter]);
}
document.write ("<BR>");}

4.9.3. Funciile metod i this

Cel mai puternic aspect al programrii JavaScript obiectuale este abilitatea de a crea obiecte
cu proprieti funcionale denumite metode. Funciile metod se refer la obiectul curent.

Exemplu:
function produs (den, um, pre, cant){
this.length=5;
this.denumire=den;
this.unitate=um;
this.pretad=pre;
this.cantitate=cant;

41
 JavaScript

this. show=arataprod;
}
/*Aceast funcie arat metoda obiectului produs*/
function arataprod (){ ///vid
var nprop = this.length;
for (var iter = 1; iter <nprop; iter++) {
document.write ("<BR>Proprietatea "+iter+this [iter]);
}
document.write ("<BR>");}

Utilizarea metodei poate fi realizat astfel:

calculator.show( );
altprodus.show( );
arataprodus (calculator);
Funciile metod pot lua orice argumente i pot returna valori.
Exemplu:
function stoc(cantitate){
if (cantitate <=0)
return ("stoc negativ");
return ("Continu achiziia/vanzarea");}
Observaie: Dac exist funcii scop care opereaz doar cu instanele unui obiect, acestea sunt
metodele acelui obiect.

4.9.4. Obiectele ncapsulate

Unul din principiile fundamentale ale programrii orientate pe obiect este reutilizarea
obiectului. In acest sens se definete un obiect cu proprieti comune, ncapsulate n cadrul
acestuia, iar obiectul se include ca proprietate a unuia sau mai multor obiecte. Acest tip de
structur, n care obiectele i instanele sunt coninute unul n cellalt este definit ca ierarhie
obiectual [Lemay].
Spre exemplul agenia de valori imobiliare are ca obiect de activitate intermedierea
operaiilor de vnzare-cumprare de imobile (terenuri, case, apartamente etc). Descrierea
iniial a obiectului teren conine lungimea i limea terenului, lungimea i limea casei
descg (lg, lag, lc, lac) i metoda de calcul a suprafeei grdinii suprgr( ).

Lg Teren Obiectul
Teren

Proprieti Metode
Lc Casa Calculul suprafeei
Lungime Lg terenului- SuprG
Lime - Lag (Lg,Lag)
Lac Zona -zona
Pre - pret

Figura 4.2. Reprezentarea obiectual a datelor unei agenii imobiliare

42
 JavaScript

function descg (lg, lag, lc, lac){

//caracteristicile imobilului
this.length = 5;
this.lungr = lg;
this.latgr = lag;
this.lungc = lc;
this.latc = lac;
this.suprgr = suprgr; //metoda de calcul a suprafeei grdinii
}
function suprgr( ) {
var flg, flag, flc, fluc;
flg=this.lungr;
flag = this.latgr;
flc = this.lungc;
fluc = this latc;
if (flg <=0) //se prefera if(0<flg)
return (0);
return (flg * flag - flc * fluc);
}
Definim dou obiecte Teren cu proprietile: lungime teren-lg, lime teren-lag, zona, pre i
obiectul Casa care motenete att metodele i proprietile obiectului Teren ct i cele proprii
(figura 4.3.).

Figura 4.3. Soluia obiectual Obiectul

propus Teren

Sub-Obiectul
Casa

Metode
Proprieti
Calculul vechimii
Lungime Lc Calulul suprafeei
Lime - Lac locuite (Lc, Lac)
Stil - st
Camere cam
Anul
construciei-an

function descter (lg, lag, zona, pret){

//caracteristicile imobilului
this.length = 5;
this.lungr = lg;
this.latgr = lag;
this.zona = zona;
this.pret = pret;
this.suprgr = suprgr; //metoda de calcul a suprafeei grdinii
}
function suprgr( ) {

43
 JavaScript

var flg, flag;

flg=this.lungr;
flag = this.latgr;
if (0<flg)
return (flg * flag);
}
function casam (lc,lac,cam, st, an, gar, desci) {
this.length = 5;
this.lunc = lc;
this.latc = lac;
this.camere = cam;
this.stil = st;
this.dencon = an;
this.garaj = gar;
this.desca = desci; //instan - proprietate
this.show = show; // metod - proprietate
this.vechime = vechime; // metod - proprietate
}

function finisaj(fai, gre, cen, term, alte, casami) {

this.length = 5;
this.fai=fai;
this.gre =gre;
this.term=term;
this.alte=alte;
this.casamia=casami;
}

La momentul crerii instanei casam, care conine sub-obiecte toate instanele i metodele ce o
compun trebuie s existe:
var idesc;
var icasa;
var gradina;
var plus;
idesc = new descgr (20, 16, Andrei Muresanu, 30000)
icasa = new casam (12, 8, 4, "clasic", 1970, true, idesc);
gradina = icasa.desca.suprgr();
plus= new finisaj(true, true, true, false, icasa);
arata=icasa.show();
veche=icasa.vechime();

document.write ("<BR>" "locuina are"+ icasa.vechime(2003)+"ani");

document.write ("<BR>" Suprafaa grdinii este"+ gradina + "mp");

JavaScript a mprumutat de la Pascal structuri ce permit manipularea unui set de obiecte ca i

un singur obiect astfel:
with (nume obiect){
instruciuni
}
unde: nume obiect - numele unei instane sau obiectului;

44
 JavaScript

proprietile obiectului sunt referite prin prefixare cu numele obiectului.

Observaii:
Blocul with trebuie s fie ct de scurt
Instruciunile incluse s nu posede referiri ambigue ale variabilelor locale sau
proprietilor altor obiecte.

4.9.5. Funcii cu numr variabil de argumente

Funciile JavaScript au dou proprieti de baz: apelul i argumentele. Proprietatea de

argumente permite utilizatorului descrierea ei cu un numr variabil de argumente i este
opional. Proprietatea de apel permite funciei identificarea i apelul n conjunctura n care
este chemat.
Exemplu:
function demsum (sir1){
var nrpar = demsum.arguments.length;
var sirret;
var sum=0;
for (var i=1; i< nrpar, i++){
sum += demsum.arguments [i];
}
nrpar =nrpar-1;
sirret="s-au adunat"+nr par+"valori"+"rezultnd suma de: "+sum";
return (sirret);
}
Apelul
var sir1 = demsum ("aici", 5, 10, 15, 20);
var sir1 = demsum ("Nimic");

Dei nrpar = 5 totui argumentele sunt demsum.arguments[0] pn la demsum.arguments [4]

i suma se face de la al doilea argument opional, proprietatea de lungime nefiind calculat.

Rezult:
S-au adunat 4 valori rezultnd suma de 5o; respectiv
S-au adunat 0 valori rezultnd suma 0

4.10. Fiiere externe i baze de date cu JavaScript

Live Wire furnizeaz obiectul File care permite aplicaiilor s scrie pe file server. Este vorba
de o msur de securitate deoarece JavaScript pe browser nu permite salvarea datelor n
fiiere system dar Live Wire Pro permite acces la baze de date SQL: Oracle, Sybase i BD
Microsoft. Obiectul file poate fi creat cu sintaxa standard pentru crearea a unui obiect:
Fiier_propriu = new File ("cale")
Calea este relativ la directorul aplicaie, nu este un URL dar utilizeaz formatul standard al
fiierelor de pe server: /director/fiier.
Metodele puse la dispoziie sunt: open(), read(), write(), getPosition(), setPosition() iar
operaiile de citire i scriere sunt similare cu cele de la obiectul document, particularitatea
constnd n utilizarea metodei flush care golete bufferul.
Metoda open permite deschiderea unui fiier i ntoarce rezultat true dac s-a finalizat cu
succes i false n caz contrar. Dac fiierul este deschis, operaia este abandonat iar fiierul
original rmne neschimbat i deschis. Fiierul este deschis pentru citire i/sau scriere. Se

45
 JavaScript

poate crea un fiier nou, aduga la sfritul unui fiier existent sau nlocui un fiier existent cu
un alt fiier.
Exemplu:
result = fisierpropriu.open ("mode");

Mode poate lua una din valorile:

 r - deschide un fiier ca fiier text i returneaz true dac exist. Dac nu exist
returneaz false.
 w - deschide fiierul ca fiier text pentru scriere i creaz un nou fiier iniial gol, chiar
dac exist sau nu.
 a - deschide fiierul ca fiier text pentru adugare i scrie la sfritul fiierului. Dac
fiierul nu exist, l creaz.
 r+ - deschide fiierul n citire/scriere. Citirea i scrierea ncepe de la nceputul
fiierului.
 r+ - deschide fiierul n citire/scriere. Creaz un nou fiier iniial gol, indiferent de
fiierul existent (sau nu).
 a+ - deschide fiierul pentru citire/scriere. Citirea i scrierea ncepe de la sfritul
fiierului iar dac fiierul nu exist, el este creat.

JavaScript ofer posibilitatea de a salva fiierul (implicit text) n format binar prin adugarea
opiunii (b) n oricare din aceste moduri. [Somn-98]
Poziionarea n fiier se face la nceputul fiierului, cu excepia modurilor a, a+ pentru care
poziionarea la deschidere este la sfritul fiierului. Metoda de poziionare este
x=fiier.getPosition( ). Primul byte este 0 i orice alt poziie este un numr pozitiv. Pentru o
eroare de poziionare se returneaz -1.
Metoda setPosition ( ) permite modificarea poziiei relativ la nceputul fiierului, sfritul sau
poziia curent din fiier.
Sintaxa: fiier.setPosition (poziie[,referin])
unde: - referina este valoare numeric
0 relativ la nceputul fiierului;
1 relativ la poziia curent;
2 relativ la sfritul fiierului.
Exemple:
fiier.setPosition (-3,2)
fiier.setPosition (5,0)
fiier.setPosition (-1,1)
Scrierea n fiiere este permis cu metoda write accesat n trei variante:
fiier.write (sir) - un ir
fiier.writeln (ir) - un ir urmat de \n ..
fiier writeByte (ir) - un byte
Metoda write cu sintaxa: write (obiect_fisier) afieaz numele fiierului.
Cum n majoritatea limbajelor datele sunt nmagazinate n buffer pentru a crete eficiena,
acesta le scrie pn este plin sau pn cnd fiierul este nchis respectiv bufferul este golit cu
metoda flush.
Citirea este permis prin 3 metode de citire care returneaz true dac s-au desfurat cu succes
i false n caz contrar.
fiier.read (count)
fiier.readln ( )
fiier.read byte ( )
Cum n sistemul Windows, fiierele text au la sfritul fiecrei linii (\r\n), n Unix (\n)

46
 JavaScript

iar pentru a deservi ambele sisteme JavaScript utilizeaz ambele variante cnd se folosete
writeln( ) depinznd de platforma server.
Exempul:
vfisier = new File(textvechi.txt)
noufisier = new File(textnou.txt)
rezultat1= vfisier.open(r)
rezultat2= noufisier.open(w)
until vfisier.eof() {
rezultat3= noufisier.writeln(vfisier.readln())
}
rezultat4= vfisier.close()
rezultat5= noufisier.close() }

Datele nmagazinate n fiiere au format text ASCII sau binar. Obiectul File are dou metode
pentru conversia datelor dintr-un format n altul, ambele statice fr obiecte:
 fiier.StringToByte(ir) - metoda de conversie a primului caracter dintr-un ir. Restul
caracterelor sunt ignorate. rezultatul este valoarea primului caracter sau 0 dac nu exist
posibilitatea conversiei.
 fiier.byteToString(numr) - convertete ntr-un ir un numr dat ca parametru.

Erorile aprute n manipularea informaiei pot fi gestionate cu diverse metode:

 exists( ) permite verificarea existenei fiierelor i returneaz true dac fiierul exist i
false n caz contrar.
 getLength( ) returneaz un numr de bytes dintr-un fiier iar pentru un fiier text
returneaz numrul de caractere; n caz de eroare -1.
Exemplu: nfisier.get Length( )
 error( ), clearError( ) permit verificarea erorilor aprute la manipularea fiierelor
precum i tergerea acestor erori.
Exemplu: nfisier.error( ) sau nfisier.clearError( )
 eof() testeaz sfritul fiierului.

Directive Parametri Descriere Exemple

Cea mai utilizat directiv SSI , ce
permite includerea ntr-un document a
coninutului altui document. Se specific <!--#include
file or
Include fiierul sau parametrii virtuali (HTML, virtual="header.html"--
virtual
text, script, etc). Parametrii fiiereului >
sunt furnizai cu cale relativ la rdcina
documentului.
Directiva execut un program, script,
sau comand shell pe server. cmd este <!--#exec cgi="/cgi-
comanda server-side; cgi este parametru bin/foo.cgi"-->
Exec cgi or cmd la calea unui script CGI. PATH_INFO i or
QUERY_STRING din scriptul current <!--#exec cmd="ls -l"--
SSI sunt trimii la scriptul CGI. "include >
virtual" este echivalent cu "exec cgi".
Directiva afieaz coninutul unor
<!--#echo
Echo var variabile de mediu HTTP specificate. var="REMOTE_ADDR" -->
Variabilele include

47
 JavaScript

HTTP_USER_AGENT,
LAST_MODIFIED, i
HTTP_ACCEPT.
<!--#config timefmt="%y
%m %d" -->
Directiva configureaz formatul de or
timefmt,
afiare a datei,timpul, dimensiunea <!--#config
config sizefmt, or
fiierelor, i mesajele de eroare sizefmt="bytes" -->
errmsg or
(returnate cnd eueaz comanda SSI ).
<!--#config errmsg="SSI
command failed!" -->
Directiva afieaz data cnd a fost <!--#flastmod
modificat documentul sau specific virtual="index.html"-->
flastmod file or
dimensiunea document. Parametrii or
or fsize virtual
fiireului sunt furnizai cu cale relativ <!--#fsize
la rdcina documentului. file="script.pl"-->

Directiva d ca ieire lista tuturor

variabilelor i valorile lor, incluznd
printenv <!--#printenv -->
cele de mediu i cele ale user-ului. Nu
are attribute.

Bibliografie
1. Buraga, S.(coord.), Alboiae, L., Alboaie, S., Dumitriu, S., Grdea, M., Gorea, D.,
Tanciuc, S.(2006), Tendine actuale n proiectarea i dezvoltarea aplicaiilor Web,
Editura Matrix Rom Bucureti
2. www.w3schools.com/js/default.asp
3. www.w3schools.com/jsref/default.asp
4. www.javascriptsource.com/
5. www.enable-javascript.com
6. www.ecma-international.org/./

48