Sunteți pe pagina 1din 103

1.

Adaugarea JavaScript intr-o pagina HTML


Pentru a insera JavaScript ntr-un document HTML deja existent, este necesara
introducerea n fisier a etichetei<script> si </script>. Aceasta eticheta necesita aributul
"type", sau atributul "language" (acesta din urma este depreciat in standardul XHTML)
care va specifica browser-ului limbajul folosit pentru interpretarea codului inclus.
In interiorul etichetei <script> ... </script> vom scrie codul nostru.
Pentru scrierea si executarea programelor JavaScript avem nevoie de un editor simplu de
texte (cum ar fi Notepad pentru Windows sau emacs pentru Unix) si un browser (ex. Mozilla
Firefox, Internet Explorer).
- Atributul "language" (care insa nu este folosit in XHTML, ci doar in paginile web standard
HTML) va avea urmatoarea sintaxa: language="JavaScript", aceasta specifica browserului ce limbaj este folosit
- Atributul "type" inlocuitorul lui "language" va avea urmatoarea
sintaxa: type="text/javascript", aceasta spune browser-ului ca scriptul este scris in
format plaintext.
Putem, de asemenea, sa introducem instructiunile JavaScript intr-un alt fisier, extern, care
va avea extensia ".js", pentru editarea acestui fisier este nevoie la fel de un editor simplu
de texte. Avantajul fiind ca putem folosi acelasi cod in mai multe pagini HTML si in cazul
necesitatii unei modificari in codul JavaScript, modificam doar datele dintr-un singur fisier
(cel cu extensia ".js"), dezavantajul acestei metode este faptul ca intr-un fisier extern ".js"
nu putem folosi etichete HTML, ci numi instructiuni JavaScript.
In cazul in care codul JavaScript se afla intr-un fisier extern, eticheta <script> din pagina
HTML va trebui sa contina atributul "src" a carui valoare determina locatia fisierului in care
se afla codul JavaScript.
In fisierul extern cu extensia "js" nu trebuie sa scriem eticheta "<script>", scriem direct
instructiunile scriptului.
Iata un exemplu de script JavaScript scris in interiorul unei pagini web (XHTML):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ro">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Cod JavaScript</title>
</head>
<body>
<script type="text/javascript">
document.write("Textul care va fi afisat pe ecran");
</script>
</body>
</html>
Si pt. HTML:
<html>
<head>
<title>Cod JavaScript</title>
</head>
<body>
<script type="text/javascript">
document.write("Textul care va fi afisat pe ecran");
</script>
</body>
</html>
Comanda document.write este folosita pentru a tipari ceva in pagina.
Rezultatul acestui script, afisat in pagina web (XHTML si HTML) va fi urmatorul:
Textul care va fi afisat pe ecran
Daca dorim sa incarcam scriptul dintr-un fisier extern (de exemplu "cod.js"), codul nostru in
documentul HTML va arata astfel:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="ro">


<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Cod JavaScript</title>
</head>
<body>
<script src="cod.js" type="text/javascript">
</script>
</body>
</html>
- Iar fisierul "cod.js" va contine :

document.write("Textul care va fi afisat pe ecran")

Rezultatul afisat in pagina web va fi acelasi ca-n exemplele anterioare.


Recomandarea HTML 4.01 specifica introducerea unei etichete <meta> in portiunea
<head> a documentelor care folosesc scripturi JavaScript. Aceasta eticheta specifica
limbajul prestabilit folosit in toate scripturile din pagina. Eticheta ar trebui sa arate astfel :
<meta http-equiv="Content-Script-Type" content="text/javascript">
- Totusi, aceasta eticheta nu este obligatorie, scripturile functionand foarte bine si fara ea.
2. Ascunderea codului in browserele vechi
Unele browsere nu recunosc scripturile si le afisaza n pagina web ca text. Pentru a evita
acest lucru putem folosi eticheta HTML pentru comentarii <!-- ... //--> delimitand cu
aceasta instrictiunile JavaScript, astfel evitam aparitia scriptului in pagina web:
Acest lucru se face precum puteti vedea in exemplul urmator:
<script type="text/javascript">
<!-Codul scriptului
//-->
</script>
3. Conventii de sintaxa
In orice limbaj, scrierea are conventii si reguli de sintaxa. Chiar si scrierea n limba
romna are regulile ei de sintaxa: orice propozitie incepe cu litera mare, se termina cu un
semn de punctuatie, etc.! La fel si limbajele de programare au regulile si sintaxa lor.
In continuare vor fi prezentate regulile de sintaxa ala limbajului Java Script.

1. Case-sensitive - se face diferenta intre literele mari si mici, astfel cuvinte


precum "exemple, Exemple" vor fi tratate diferit.

2. Punct si virgula (;) - Toate declaratiile trebuie sa se termine cu un caracter


"punct si virgula" (;) (Exemplu" var1 = 3; var2 = 8;).

3. Spatiile libere - JavaScript ignora spatiile libere, tab-urile si liniile libere care
apar n instructiuni, acestea sunt utile pentru a face codul mai bine structurat si
usor de citit. Recunoaste doar spatiile care apar n string-uri (sirurile de
caractere). Exemplu: "var1 = 2 ;" este la fel cu "var1=2;".

4. Ghilimelele - Ghilimelele simple ('') si duble ("") sunt folosite pentru a delimita
sirurile de caractere (string). (Exemplu: "Invat JavaScript" sau 'Invat JavaScript').

5. Caractere speciale - cand scriem scripturi, apare necesitatea de a folosi in


cod sau in datele de iesire, un caracter special sau o apasare de tasta , cum ar fi
tasta TAB , sau o linie noua. Pentru aceasta folosim caracterul backslash "\" in fata
unuia din codurile Escape , astfel :

\b - backspace
\f - indica o pagina noua
\n - linie noua
\r - indica un retur de car
\t - indica o apasare a tastei TAB
\\ - caracter backslash
\' - indica un apostrof (ghilimele simple)
\" - indica ghilimele duble

o
- De exemplu, daca dorim sa afisam un text,
folosind document.write(), iar acel text trebuie sa contina ghilimele si
caracter backslash "\", si anume textul (Curs "JavaScript" \ MarPlo.net),
pentru a nu "deruta" scriptul in interpretarea codului, deoarece
ghilimelele si backslash fac parte din sintaxa, adaugam \ in fata acestor
caractere din interiorul sirului. Comanda de afisare a sirului va fi
astfel: document.write("Curs \"JavaScript\" \\ MarPlo.net");

6. Comentarii - comentariile in interiorul codului sunt necesare cand dorim sa


specificam rolul anumitor functii si variabile, pentru o mai usoara intelegere
ulterioara a scriptului. Pentru a adauga un comentariu, pe o singura linie, in
interiorul codului, incepem scrierea acestuia cu succesiunea // (Exemplu: //
Comentariu). Daca dorim sa scriem comentarii pe mai multe randuri, se
foloseste /* la inceputul comentariului si */ la sfarsitul acestuia (Exemplu: /* ...
comentariu pe mai multe randuri ... */)

7. Numele variabilelor si functiilor - numele dat variabilelor si functiilor


trebuie sa respecte urmatoarele reguli:
o

- primul caracter trebuie sa fie o litera, un caracter de subliniere (_) sau


semnul $
- primul caracter nu poate fi un numar
- numele nu trebuie sa contina spatii libere
- nu se folosesc cuvinte rezervate, care fac parte din limbajul JavaScript
(cum sunt "array", "status", "alert"), deoarece interpretorul programului
nu va face diferenta intre aceste nume si comenzile JavaScript cu
aceleasi nume.

Notiuni de baza

In aceasta lectie veti invata notiunile de baza ale programari, care sunt necesare
pentru a scrie un script. Aceste notiuni sunt similare cu cele din PHP si alte
limbaje de programare.

1. Folosirea variabilelor
Intr-un script (sau program) se folosesc date constante dar si date variabile care isi
schimba valorile in timpul executei programului. Aceste date se numesc variabile.

Variabila = numele unei locatii din memoria calculatorului, folosita pentru a


memora date.

Modul cel mai simplu de a folosi si a face referire la o astfel de data variabila este de a o
denumi. Numele variabilei permite accesul la valoarea ei precum si schimbarea valorii daca
este necesar.
Se poate crea o variabila si sa-i atribuim o valoare prin doua metode:
- Cu declaratia var

var nume = valoare

- Fara declaratia var

nume = valoare

- Unde 'nume' este numele variabilei iar 'valoare' este valoarea pe care i-o atribuim.
Tipuri de variabile - Spre deosebire de alte limbaje (cum sunt Pascal sau C), JavaScript nu
are tipuri fixe de date, adica permite schimbarea tipului unei variabile in cadrul scriptului,
acesta poate recunoaste singur cand datele sunt de tip "sir", numerice sau alt tip.
De exemplu:

var x = "xyz";
x = 8;

- Observati ca valorile de tip 'sir' (formate din litere) se scriu intre ghilimele, iar cele
'numerice' pot fi scrise si fara ghilimele.
Durata de viata a unei variabile - O variabila scrisa in cadrul unei functii este o variabila
locala, valoarea ei fiind recunoscuta numai in cadrul acelei functii, cand se iese din functie
variabila este distrusa. Astfel, o alta functie poate declara si folosi o variabila cu acelasi
nume, JS (Java Script) trateaza cele doua variabile ca fiind diferite (functiile si lucrul cu
acesta vor fi explicate in lectiile urmatoare).
Se pot declara si variabile, in afara oricarei functii, care sa fie folosite de toate functiile,
acestea se numesc variabile globale si sunt valabile de la incarcarea paginii web pana la
inchidere, in orice script JS.
2. Operatori
Pentru a lucra cu datele introduse intr-un script si a manipula valorile variabilelor se
folosesc operatori
Operatorii sunt simboluri si identificatori care determina felul in care sunt modificate datele
si modul in care este evaluata o combinatie de expresii si variabile.
JavaScript recunoaste :

- operatori binari - care necesita existenta a doi operanzi in expresie.

- operatori unari - care au nevoie doar de un operand.

Operatori sunt de mai multe tipuri:

Operatori aritmetici
Operatori de atribuire
Operatori de comparare
Operatori logici (numiti si booleeni)
Operatori pentru siruri
Operatori typeof
Operator conditional ?

- Operatori pentru functii


- Operatori pentru structuri de date
Operatorii

Cu ajutorul operatorilor manipulam, combinam si modificam datele dintr-un


program sau script. Acestia sunt de mai multe feluri, in aceasta lectie sunt
prezentati tipurile de operatori folositi in JavaScript.

1. Operatori aritmetici
Putem spune ca operatorii aritmetici sunt principalii operatori folositi cu numere, acestia
efectueaza operatiile aritmetice
cunoscute: adunare (+), scadere (-), inmultire (*), impartirere (/). Pe langa acesti
patru operatori, in programare sunt folositi inca trei operatori aritmetici :

Modulul (%) - acesta determina restul impartirii a doua numere


Exemplu:
o

8%3 da rezultatul 2
10%2 da rezultatul 0

Incrementare (++) - Acest operator creste valoarea cu o unitate, este des folosit
in programare, in lucrul cu variabile.

De exemplu, daca avem variabila 'i', putem folosi operatorul de incrementare


astfel: i++ care este similar cui = i+1.
Exemplu:
o

x = 7;
x++;
rezultatul va fi x = 8

Decrementare (--) - Acest operator scade valoarea cu o unitate.

De exemplu, daca avem variabila 'i', putem folosi operatorul de decrementare


astfel: i-- care este similar cui = i-1.
Exemplu:
o

x = 7;
x--;
rezultatul va fi x = 6

Cei doi operatori de incrementare (++) respectiv decrementare (--) pot fi folositi
atat ca prefix (in fata variabilei) ++i respectiv --i cat si ca sufix (dupa numele
variabilei) i++ respectiv i--. Valoarea obtinuta este aceeasi, insa ordinea operatiei
si rezultatul atribuirii valorii sunt diferite.

Folosirea operatorului ca prefix determina in primul rand modificarea valorii si


apoi are loc atribuirea acesteia.

In cazul folosirii operatorului ca sufix, intai este atribuita valoarea variabilei si apoi
variabila este incrementata (sau decrementata).

2. Operatori de atribuire
In cazul acestui operator JavaScript actioneaza mereu de la dreapta la stanga ; se
evalueaza operandul din dreapta iar valoarea se atribuie variabilei din stanga semnului "="
.
Mai jos puteti vedea un tabel din care puteti intelege modul de lucru si actiune al
operatorilor de atribuire
Operator

Exemple

Este acelasi cu

x=y

x=y

+=

x += y

x = x+y

-=

x -= y

x = x-y

*=

x *= y

x = x*y

/=

x /= y

x = x/y

x %= y

x = x%y

%=

3. Operatori de comparare
Expresiile care folosesc acesti operatori pun o intrebare despre doua valori pe care le
compara. Raspunsul poate fi TRUE sau FALSE.
Un operator de comparatie des folosit este operatorul de identitate (egalitate), reprezentat
prin doua semne egal "==". Este diferit de simplul "=", operatorul '==' compara doua
valori determinand daca acestea sunt identice, adica egale atat ca valoare cat si ca tip.
Operatori de comparatie sunt prezentati in tabelul urmator:
Operator

Semnificatie

Exemple

==

Egal

3 == 8 returneaza FALSE

!=

Diferit

3 != 8 returneaza TRUE

>

Mai mare

3 > 8 returneaza FALSE

<

Mai mic

3 < 8 returneaza TRUE

>=

Mai mare sau egal

3 >= 8 returneaza FALSE

<=

Mai mic sau egal

3 <= 8 returneaza TRUE

4. Operatori logici (booleeni)


Similar cu operatori de comparatie, operatorii logici compara doua expresii si returneaza
TRUE sau FALSE.
Acesti operatori sunt:

&& - si (and) - Compara doua expresii si returneaza TRUE daca amandoua sunt
adevarate, in caz contrar returneaza FALSE.
Exemplu:
o

|| - sau (or) - Compara doua expresii si returneaza TRUE daca cel putin una din ele
este adevarata, in caz contrar returneaza FALSE.
Exemplu:
o

x=5
y=8
x<7 && y>3
(returneaza TRUE)

x=5
y=8
x>7 || y<3
(returneaza FALSE)

! - not - este operator unar, foloseste o singura expresie si returneaza TRUE daca
expresia este falsa, daca expresia este adevarata returneaza FALSE.
Exemplu:
o

x=5
y=8
!(x==y)
(returneaza TRUE deoarece 'x' nu este egal cu'y')

5. Operator pentru string (sir)


Un string este in general un sir de caractere, intre ghilimele.
Pentru a alatura (concatena) doua variabile string impreuna se foloseste operatorul
de concatenare a sirurilor +
Exemplu:

t1 = "Astazi este o zi"


t2 = "frumoasa"
t3 = t1+t2
(Variabila 't3' va contine sirul "Astazi este o zifrumoasa")

Observati ca nu este saptiu intre 'zi' si 'frumoasa'. Pentru a adauga spatiu intre siruri, sunt
doua modalitati:

1 - Adaugati spatiu intre variabilele string


Exemplu:
o

t1 = "Astazi este o zi"


t2 = "frumoasa"
t3 = t1+" "+t2
(Variabila 't3' va contine sirul "Astazi este o zi frumoasa")

2 - Adaugati spatiu in una din variabilele string


Exemplu:
o

t1 = "Astazi este o zi"


t2 = " frumoasa"
t3 = t1+t2
(Variabila 't3' va contine sirul "Astazi este o zi frumoasa")

6. Operatorul typeof
Acest operator returneaza tipul de date continut la momentul respectiv de operandul
sau. Este util in special pentru a determina daca o variabila a fost definita cu un anumit tip
de date.
Studiind tabelul urmator puteti intelege modul de operare al acestuiai operator :
Operator

Descriere

typeof parseFloat

returneaza sirul 'function'

typeof 33

returneaza sirul 'number'

typeof "un anume text"

returneaza sirul 'string'

typeof true

returneaza sirul 'boolean'

typeof window

returneaza sirul 'object'

7. Operatori pentru functii


Functiile vor fi explicate in una din lectiile urmatoare, totusi este util sa fiti familiarizati
cu doi operatori:
1. Primul se numeste operator de apelare si este reprezentat printr-o pereche de
paranteze rotunde () care urmeaza intodeauna dupa numele functiei, astfel o functie va fi
declarata astfel:
function nume_functie() {
// Corpul functiei
}
Apoi operatorul de apelare este folosit din nou cand functia este apelata in interiorul
scriptului:

nume_functie()

Parantezele aratand ca este folosita o functie.


Al doilea operator pentru functii este virgula "," - care se foloseste pentru a separa mai
multe argumente pe care le primeste o functie.
Argumentele sunt scrise intodeauna in interiorul parantezelor rotunde si sunt separate prin
virgula.
Astfel o functie cu doua argumente ar arata:
function nume_functie(arg1, arg2) {
// Corpul functiei
}
8. Operatori pentru structuri de date (obiecte)
Acesti operatori sunt necesari atunci cand lucram cu structuri de date, sau obiecte
In JavaScript obiectele sunt folosite la gruparea informatiilor pentru a servi unui scop
specific.

1. Un operator care ar trebui cunoscut bine este punctul "." , numit operator pentru
membrul unei structuri. Acesta ne permite sa ne referim la un membru ( variabila ,functie
sau obiect ) care apartine obiectului specificat.
Sintaxa este urmatoarea :

numeObiect.nume_Variabila
numeObiect.nume_Functie()
numeObiect.alt_Obiect

Aceasta modalitate de referire la o informatie, numita notatie cu punct, returneaza


valoarea variabilei, functiei sau obiectului aflat cel mai in dreapta.
2. Operatorul pentru element din matrice, numit si operator indice al tabloului, se
foloseste pentru a accesa o data specifica, o cheie, dintr-un tablou de date. Acesta este
simbolizat printr-o pereche de paranteze drepte [ ] , si permite sa ne referim la orice
membru al unui tablou.
Tablourile sunt obiecte JavaScript si vor fi detaliate in lectiile urmatoare.
Sintaxa de folosire a operatorului pentru tablou este :

nume_tablou[cheie]

9. Operatorul conditional "?"


JavaScript contine si un operator conditional ? : care atribuie o valoare unei variabile pe
baza unei conditii.
Sintaxa de folosire a acestui operator este urmatoarea:

variabila = (conditie)?val1:val2

Modul de operare este urmatorul - se evalueaza conditia, daca este adevarata atunci
variabila ia valoarea 'val1', altfel ia valoarea 'val2'.
Iata un exemplu:
<script type="text/javascript">
vizitator = "barbat"
mesaj = (vizitator=="barbat")?"Stimate domn":"Stimata doamna"
document.write(mesaj) </script>
Daca variabila "vizitator" este egala cu 'barbat', variabila "mesaj" primeste valoarea 'Stimate
domn", altfel primeste valoarea "Stimata doamna". Iar instructiunea de afisare
"document.write()" va afisa valoarea lui "mesaj".
10. Precedenta operatorilor
Cand in expresii se folosesc mai multi operatori, JavaScript tine cont de precedenta
(importanta) predefinita a fiecarui operator. Precum in aritmetica, intr-o ecuatie cu adunare
si inmultire ( 2+3*4 ), daca nu sunt paranteze, se executa intai inmultirea, aceasta avand
precedenta superioara fata de adunare. La fel e si cu operatorii in programare.
Daca apar mai multi operatori cu aceeasi precedenta, JavaScript ii va evalua de la stanga
spre dreapta.
In tabelul urmator sunt prezentati operatorii in ordinea precedentei lor, unde operatorii din
partea de sus a tabelului au precedenta maxima :
Operator

Nume operator

() [] .

de apelare, pt. structuri de date

! ++ -* / %

de negare, incrementare
de inmultire, impartire

+ -

de adunare, scadere

< <= > >=


== !=

de comparatie
de egalitate

&&

SI logic

||

SAU logic

?:

conditionnal

= += -= *= /=
%=
,

de atribuire
virgula

Instructiuni conditionale

Partea cea mai interesanta, dar si dificila, in scrierea unui script este proectarea
acestuia astfel incat sa ia decizii in timp ce este executat.
Cu ajutorul instructiunilor conditionale putem face programele sa testeze diferite conditii
dupa care sa decida modul de executie a datelor.
In Java Script sunt urmatoarele instructiuni conditionale:

if - executa comenzile dorite cand o conditie este adevarata.

if ... else - executa anumite comenzi cand o conditie este adevarata si alte
comenzi cand aceasta este falsa.

switch - selecteaza care comanda va fi executata.

1. Instructiunea "if"

Se poate spune ca instructiunea "if" este una din cele mai des folosite.
Forma generala a acestei instructiuni este urmatoarea :

if (conditie) {
codul care va fi executat daca este adevarata conditia
}

- Unde 'conditie' poate fi orice expresie logica.


Daca rezultatul conditiei este TRUE se executa codul dintre acolade, in caz contrar, cand
conditia returneaza FALSE, se trece peste acest cod.
Iata un exemplu practic. Urmatorul script afiseaza "Buna ziua" daca ora este mai mare decat
11.
Se foloseste obiectul Date care determina data curenta (va fi explicat mai amanuntit in alta
lectie).
<script type="text/javascript">
<!-// daca ora > 11,
// va scrie n fereastra Buna ziua!
var d = new Date()
var time = d.getHours()
if (time>11) {
document.write("<b>Buna ziua!</b>")
}
//-->
</script>
- Am definit variabila 'd' a carei valoare este data curenta, apoi variabila 'time' preia numai
ora din variabila 'd'. Conditia din instructiunea "if" verifica daca ora este mai mare decat 11
si in caz adevarat executa comanda dintre acolade, care afiseaza mesajul.
Daca ora este mai mica decat 11 scriptul nu va executa instructiunea dintre acolade.
2. Instructiunea "if ... else"
In exemplul anterior am vazut ca este afisat "Buna ziua!" daca ora > 11 iar in caz
contrar nu se intampla nimic.
Folosind instructiunea "if ... else" putem stabili comenzi care sa fie executate cand
conditia instructiunii "if" este FALSE.
Forma generala a instructiuni "if ... else" este urmatoarea :

if (conditie) {
codul care va fi executat daca este adevarata conditia
}
else {
codul care va fi executat daca conditia este falsa
}

- Unde 'conditie' poate fi orice expresie logica.


Daca rezultatul conditiei este TRUE se executa codul dintre primele acoladele, care apartin
de "if", in caz contrar, cand conditia returneaza FALSE, sunt executate comenzile din a doua
grupa de acolade (dupa else).
Iata din nou exemplul de mai sus, de asta data folosindu-se instructiunea "if ... else".
Scriptul afiseaza "Buna ziua!" daca ora este mai mare decat 11, in caz contrar afiseaza 'Este
ora ...'.
<script type="text/javascript">
<!--

// daca ora > 11,


// va scrie n fereastra Buna ziua!
// Alfel afiseaza "Este ora ..."
var d = new Date()
var time = d.getHours()
if (time>11) {
document.write("<b>Buna ziua!</b>")
}
else {
document.write("<b>Este ora " +time+ "</b>")
}
//-->
</script>
- Am definit variabila 'd' a carei valoare este data curenta, apoi variabila 'time' preia ora din
variabila 'd'. Conditia din instructiunea "if" verifica daca ora este mai mare decat 11 si in caz
adevarat executa comanda dintre primele acolade.
Daca ora este mai mica decat 11 scriptul va executa comanda din grupul de acolade
determinat de "else". (Observati folosirea operatorului de concatenare +).
3. Instructiunea switch
Aceasta instructiune e folosita pentru a compara o valoare cu altele dintr-o lista.
Sintaxa generala a instructiuni "switch" este urmatoarea.

switch (expresie) {
case valoare1:
cod executat daca
break
case valoare2:
cod executat daca
break
case valoare3:
cod executat daca
break
default :
cod executat daca
valoare3
}

expresie = valoare1
expresie = valoare2
expresie = valoare3
expresie e diferit de valoare1, valoare2 sau

- Prima data este evaluata expresia scrisa intre paranteze rotunde, apoi valoarea expresiei
este comparata pe rand cu fiecare valoare determinata de "case". Daca se gaseste o
identitate se executa codul asociat acelui "case". Apoi se iese din instructiunea "switch".
Daca, parcurgand fiecare "case", nu se gaseste o egalitate, se executa codul de dupa
"default".
Prin folosirea lui "break" se opreste parcurgerea corpului instructiunii atunci cand s-a gasit o
valoare egala cu 'expresie' si se iese din "switch".
Iata un exemplu de script care afiseaza un mesaj in functie de zilele saptamanii:
<script type="text/javascript">
<!-var d = new Date()
var ziua = d.getDay()
switch (ziua) {
case 5:
document.write("Astazi e vineri");
break

case 6:
document.write("Astazi e sambata");
break
case 0:
document.write("Astazi e duminica");
break
default:
document.write("Mai e pana sambata");
}
//-->
</script>
- Am definit variabila 'd' a carei valoare este data curenta, apoi variabila 'ziua' care preia
numarul zilei din variabila 'd' (duminica = 0, luni = 1, ...). Se intra in corpul instructiunii
"switch" si se verifica, pe rand, fiecare valoare "case" cu valoarea variabilei 'ziua', cand se
gaseste egalitatea se executa comanda asociata acelui 'case' si se iese din "switch".
Daca nici una din valorile 'case' nu este egala cu valoarea variabilei 'ziua', se va executa
comanda de dupa 'default', care afiseaza mesajul: "Mai e pana sambata".
Iata inca un exemplu cu "case", de data aceasta foloseste valori de tip sir (string).
<script type="text/javascript">
<!-var nume = "Marius";
switch (nume) {
case "Cristi":
document.write("Coleg");
break
case "Marius":
document.write("Frate");
break
case "Maria":
document.write("Sora");
break
default:
document.write("Altcineva");
}
//-->
</script>
Va returna Frate.
Dar in general "case" e recomandat sa fie folosit cu valori numerice.

Instructiuni ciclice (repetitive)

Instructiunile repetitive se folosesc atunci cand se doreste efectuarea unei comenzi de


mai multe ori.
In java script putem folosi urmatoarele instructiuni ciclice:

for - la fel ca si in alte limbaje de programare, executa codul de un numar


specificat de ori
for ... in - executa cate un set de instructiuni pentru fiecare proprietate dintr-un
obiect
while - repeta codul atata timp cat o anumita conditie este adevarata
do ... while - intai executa o data codul apoi il repeta atata timp cat o anumita
conditie este adevarata

1. Instructiunea for
Aceasta are urmatoarea forma generala:

for (incepere_nr; conditie_nr; ciclu) {


cod care va fi executat
}

- Unde "incepe_nr" e folosit la 'initializare' pentru a da o valoarea initiala numarului de


repetari, de multe ori prin aceasta se declara o variabila care poate fi folosita ca un contor al
ciclului.
"conditie_nr" verifica daca numarul de cicluri se incadreaza intr-o anumita valoare si daca
rezultatul este TRUE se executa inca o data codul dintre acolade.
"ciclu incrementeaza sau decrementeaza valoarea la care a ajuns contoarul ciclului, apoi
aceasta valoare este verificata din nou de "conditie_nr" pana cand rezultatul este FALSE.
Aceste trei expresii dintre parantezele rotunde sunt optionale, dar daca este omisa una din
ele, caracterul punct si virgula ";" trebuie sa ramana pentru ca fiecare expresie sa ramana la
locul ei.
In interiorul instructiunii for (ca si la instructiunea "if"), intre acolade, pot fi introduse si alte
instructiuni "for", sau alte instructiuni conditionale, acest lucru se numeste imbricarea
instructiunilor.
Iata un exemplu simplu de utilizare a instructiunii "for":
<script type="text/javascript">
<!-for (x=1; x<5; x++) {
document.write("<br /> x este "+x);
}
//-->
</script>
- Se atribue lui 'x' valoarea 1, se verifica conditia (x<5) care este adevarata si se executa
corpul instructiunii (dintre acolade, care afiseaza "x este 1) apoi se incrementeaza valoarea
lui 'x' cu o unitate (x++), acum 'x are valoarea 2. Se verifica din nou conditia (x<5) si fiindca
este adevarata, se executa iar corpul instructiunii apoi se incrementeaza valoarea lui 'x', ...,
si tot asa pana cand 'x' va ajunge sa aibe valoarea 5 care la verificarea conditiei returneaza
FALSE, moment in care se termina executia instructiunii "for".
Acest script va afisa urmatorul rezultat:
x
x
x
x

este
este
este
este

1
2
3
4

2. Instructiunea for ... in


Pentru utilizarea acestei instructiuni trebuie sa aveti cunostinte despre obiectele
JavaScript asa ca va trebui sa reveniti asupra ei dupa ce le veti invata - in lectiile
urmatoare .
Cu "for ... in" se executa cate un set de instructiuni pentru fiecare proprietate dintr-un
obiect. Acest ciclul se poate executa cu orice obiect JavaScript, indiferent daca are sau nu
proprietati. Pentru fiecare proprietate se executa cate o iteratie, daca obiectul nu are nici o
proprietate nu se desfasoara nici un ciclu.
Instructiunea "for ... in" are urmatoarea forma generala:

for (nume_proprietate in obiect) {


instructiuni
}

- Unde "nume_ proprietate" este un literal de tip sir generat de JavaScript. Pentru fiecare
repetare a executiei instructiunii, lui "nume_proprietate" i-se atribuie urmatorul nume de
proprietate continut in "obiect", pana cand sunt folosite toate.
3. Instructiunea while
Aceasta instructiune repeta un cod atata timp cat conditia este adevarata.
Comanda actioneaza similar cu instructiunea "for", dar nu include functiile de initializare si
incrementare a variabilelor.
Instructiunea "while" are urmatoarea forma generala:

while (conditie) {
codul care va fi executat
}

Iata exemplu anterior, de la instructiunea "for", aici este scris in varianta instructiunii
"while":
<script type="text/javascript">
<!-var x = 1;
while (x<5) {
document.write("<br /> x este "+x);
x++;
}
//-->
</script>
- Prima data am declarat variabila 'x' dandu-i valoarea 1.
Instructiunea "while" verifica conditia (aici x<5) care este adevarata si permite executarea
corpului functiei dintre acolade care afiseaza "x este 1" si incrementeaza valoarea lui 'x' cu o
unitate. Acum 'x' are valoarea 2, se verifica conditia, care este adevarata si se executa iar
codul dintre acolade, ..., si tot asa pana cand la verificarea conditiei rezultatul este FALSE,
moment in care se termina rularea instructiunii "while".
Acest script va afisa urmatorul rezultat:
x
x
x
x

este
este
este
este

1
2
3
4

4. Instructiunea do ... while


Forma generala a acestei instructiuni este:

do {
codul care va fi executat
}
while (conditie)

Asemanatoare in mare parte cu instructiunea "while", instructiunea "do ... while" intai
executa codul din corpul instructiunii, dupa care verifica conditia, apoi il repeta pana cant
conditia returnbeaza FALSE. Astfel corpul functiei este executat cel putin o data, chiar daca
conditia nu este adevarata.
Iata un exemplu din care puteti intelege mai bine aceasta instructiune:
<script type="text/javascript">
<!-var x = 8;
do {
document.write("<br /> x este "+x);
x++;
}
while (x<5)
//-->
</script>
- Aceasta functie afiseaza "x este 8".
Observati ca desi conditia este falsa (x<5), codul dintre acolade este totusi executat o
singura data.

Instructiuni complementare

Pe langa instructiunile "for" si "while" avem si alte instructiuni 'complementare' care pot
fi executate impreuna cu acestea.

break - intrerupe definitiv executia unui ciclu.

continue - sare peste instructiunile care au mai ramas din ciclul respectiv.

label (eticheta) - permite iesirea dintr-un ciclu cu instructiuni ciclice imbricate, la


o locatie specificata a scriptului.

with - se foloseste pentru a fi evitata specificarea repetata la referirea unui


obiect, cand ii accesam metodele sau proprietatile.

1. Instructiunile break si continue

Cand este folosita o instructiune ciclica, aceasta continua sa se repete pana cand
conditia este FALSE. Aceasta excutie poate fi schimbata cu ajutorul
instructiunilor break si continue, care dau posibilitatea intreruperii ciclului sau iesirea din
acesta inainte de a se ajunge la sfarsit (la ultima acolada).

break - intrerupe definitiv executarea ciclului.

Iata un exemplu din care puteti intelege modul de lucru a lui break:
<script type="text/javascript">
for (x=1; x<10; x++) {
document.write("<br /> X este "+x);
if (x==3) {
break;
}
}
</script>
Acest script va afisa urmatorul rezultat:
X este 1
X este 2
X este 3
- Dupa cum puteti observa, nu au fost executate toate ciclurile instructiunii "for", conform
conditiei (pana cand 'x' ar fi avut valoarea 10), executia se intrerupe cand 'x' are valoarea 3.

continue - intrerupe executia repetarii curente, inainte de a fi executate celelalte


operatii din ciclu, apoi se verifica din nou conditia si se continua cu executarea
ciclului.

Studiati si urmatorul exemplu, in care este folosit continue:


<script type="text/javascript">
for (x=1; x<8; x++) {
if (x==3 || x==5) {
continue;
}
document.write("<br /> X este "+x);
}
</script>
Acest script va afisa urmatorul rezultat:
X
X
X
X
X

este
este
este
este
este

1
2
4
6
7

- Observati ca atunci cand 'x' are valoarea 3 sau 5, prin instructiunea "continue" se intrerupe
executia codului care urmeaza dupa aceasta (aici "document.write("<br /> X este "+x);")

din repetarea curenta, dar se continua cu verificare conditiei instructiunii "for" si executia
ciclului.
2. Instructiunea eticheta (label)
Instructiunea label poate fi folosita impreuna cu "break" sau "continue". Aceasta este
utilizata atunci cand folosim instructiuni ciclice imbricate, permitand controlul oricarei
instructiuni care imbrica alte instructiuni.
Studiind exemplul urmator, puteti intelege mai bine modul de utilizare a unei
instructiuni label:
<script type="text/javascript">
loopX:
for (x=1; x<=5; x++) {
for (y=3; y<8; y++) {
document.write("X este "+x+" - Y este "+y+" --" );
if (x==4) {
break loopX;
}
}
document.write("<br />")
}
</script>
- Am etichetat o serie de instructini ciclice imbricate (aici doua "for") cu eticheta "loopX",
care va fi folosita in a doua instructiune "for" imbricata, impreuna cu "break".
Acest script va afisa urmatorul rezultat:
X este 1 este 7 -X este 2 este 7 -X este 3 este 7 -X este 4 -

Y este 3 --X este 1 - Y este 4 --X este 1 - Y este 5 --X este 1 - Y este 6 --X este 1 - Y
Y este 3 --X este 2 - Y este 4 --X este 2 - Y este 5 --X este 2 - Y este 6 --X este 2 - Y
Y este 3 --X este 3 - Y este 4 --X este 3 - Y este 5 --X este 3 - Y este 6 --X este 3 - Y
Y este 3 --

- Observati ca desi "break" este inclus in interiorul celei dea doua instructiune "for", prin
specificarea lui "loopX", care este eticheta intregului ansamblu de instructiuni imbricate, se
va intrerupe executia intregului ansamblu, nu numai instructiunii "for" unde este adaugat
"break". Daca eliminati eticheta "loopX" veti vedea diferenta.
3 Instructiunea with
Aceasta comanda se foloseste pentru a evita referirea in mod repetat la un obiect,
atunci cand ii accesam metodele sau proprietatile de mai multe ori. Orice metoda sau
proprietate dintr-un bloc "with" pe care JavaScript nu o recunoaste va fi asociata cu
obiectul specificat pentru acel bloc.
Sintaxa acestei instructiuni este :

with (obiect) {
instructiuni
}

- Unde "obiect" specifica referirea la obiect care trebuie folosita, daca aceasta nu exista in
blocul "instructiuni". Ajuta mult cand se utilizeaza de mai multe ori functii matematice

avansate, prin intermediul obiectului "Math". (Acest obiect va fi explicat mai tarziu).
In exemplul urmator este prezentat modul de folosire a instructiunii "with" :
<script type="text/javascript">
<!-with(document) {
write("Salut");
write("Acum nu mai este necesara folosirea obiectului ca prefix al functiei");
}
//-->
</script>
Acest script va afisa :
Salut
Acum nu mai este necesara folosirea obiectului ca prefix al functiei
In mod normal, pt. a afisa un text folosim sintaxa "document.write("text ...")", dar aici, prin
folosirea lui 'with' impreuna cu obiectul "document", nu mai este necesara adaugarea
acestuia la metoda "write", astfel se scurteaza codul scriptului.

Ferestre Alert, Prompt si Confirm

Alert, Prompt si Confirm sunt ferestre predefinite de dialog, acestea apartin direct
obiectului "Window" (despre obiecte si ierarhia acestora puteti invata in Lectia 12).
1. Fereastra Alert
Probabil ati intalnit pana acum, de mai multe ori exemple cu "Alert".
Fiind un element simplu si deja cunoscut, voi face o scurta prezentare a sintaxei acestuia.
Crearea ferestrelor alert se face cu sintaxa:

window.alert("mesaj")

- Unde "mesaj" este textul care va apare in fereastra Alert.


Urmatorul exemplu deschide o fereastra cu mesajul "Bine ai venit".
<script type="text/javascript">
<!-window.alert("Bine ai venit");
//-->
</script>
In browser va apare o fereastra ca in imaginea urmatoare

2. Fereastra Prompt

Fereastra Prompt se creaza cu sintaxa:

window.prompt("mesaj", "default")

- Unde "mesaj" este un text care va apare in fereastra, deasupra unei casute de text input;
iar "default" este textul care va apare in casuta input.
Urmatorul exemplu deschide o fereastra "Prompt".
<script type="text/javascript">
<!-window.prompt("Scrieti numele", "Nume");
//-->
</script>
In browser va apare o fereastra ca in imaginea urmatoare

Textul pe care utilizatorul il adauga in campul din fereastra prompt poate fi preluat intr-o
variabila si folosit apoi in script.
Iata un exemplu in care atribuim deschiderea ferestrei Prompt unei variabile (aici "nume"),
care va prelua sirul adaugat in caseta de text, apoi valoarea acestei variabile o introducem
in mesajul unei ferestre Alert:
<script type="text/javascript">
<!-var nume = window.prompt("Scrieti numele", "Nume");
alert("Salut "+nume+"\n Bine ai venit.");
//-->
</script>
- Dupa ce utilizatorul scrie numele in fereastra Prompt si apasa OK se va deschide o
fereastra Alert care contine in mesaj numele adaugat de utilizator.
- Am folosit "\n" pentru a adauga o linie noua, dupa "nume", in textul care apare in fereastra
Alert.
- Incercati si singuri acest exemplu.
3. Fereastra Confi rm
Fereastra de confirmare se creaza cu sintaxa:

window.confirm("intrebare")

In fereastra de confirmare va apare textul "intrebare" si doua butoane "OK" si "Cancel".


Aceasta fereastra este folosita pentru a fi executata o comanda cand este apasat butonul
"OK" (returneaza TRUE) si alta comanda cand este apasat butonul "Cancel" (returneaza
FALSE)
Urmatorul exemplu deschide o fereastra "Confirm" in care apare intrebarea "Rezultatul lui
0+0 este 0?". Daca este apasat butonul "OK" apare o fereastra Alert cu mesajul "Corect", iar
daca este apasat butonul "Cancel" apare o fereastra Alert cu mesajul "Incorect"
<script type="text/javascript">
<!-intrebare = window.confirm("Rezultatul lui 0+0 este 0?");

if (intrebare) alert("Corect");
else alert("Incorect");
//-->
</script>
In browser va apare o fereastra ca in imaginea urmatoare

Functii - 1

Functiile ajuta la divizarea mai multor sarcini pe care trebuie sa le faca un program.
O functie poate contine mai multe instructiuni si comenzi care ulterior pot fi utilizate usor si
de mai multe ori prin apelarea functiei care le contine.
Daca un program necesita multe linii de cod, folosind functiile putem imparti codul in parti
mai mici pe care le putem utiliza separat acolo unde este nevoie.
Pot fi doua feluri de functii:

predefinite - cum sunt de exemplu: "parseInt(string)", "parseFloat(string)", ...

Create de programator
o

- care returneaza o valoare

- care nu returneaza o valoare

1. Crearea (defi nirea) functiilor


O functie se defineste la inceputul fisierului, in sectiunea head si poate fi folosita in
cadrul paginii prin apelarea ei. Scriptul care contine definirea unei functii se adauga in
sectiunea "head" pentru a fi siguri ca aceasta a fost incarcata inainte de a fi apelata.
Pentru crearea unei functii se foloseste cuvantul function urmat de numele pe care vrem
sa-l dam functiei dupa care putem adauga intre paranteze rotunde argumentele (numite
si atribute) functiei (separate prin virgula daca sunt mai multe) si intre
acolade corpul functiei care contine codul care trebuie executat.
Forma generala a unei functii este urmatoarea:

function nume_functie(argument1, argument, ...) {


codul care va fi executat
}

Argumentele sunt variabile folosite de functie si a caror valoare este preluata la apelarea
functiei.
Atributele nu sun obligatorii, o functie poate fi definita si fara argumente, dar se pastreaza
parantezele rotunde, astfel sintaxa unei functii fara argumente este urmatoarea:

function nume_functie() {
codul care va fi executat
}

2. Instructiunea return
O functie care returneaza un rezultat foloseste pentru aceasta instructiunea return.
Aceasta specifica valoarea pe care o returneaza functia cand este apelata.
Iata un exemplu din care pouteti intelege modul de aplicare a instructiunii return:

function suma(x, y) {
z = x+y;
return z
}

- "suma" reprezinta numele functiei (puteti da orice nume care respecta regulile limbajuli si
nu sunt identice cu cele rezervate, cum ar fi "function"), "x, y" reprezinta argumentele
functiei a caror valoare este data cand functia este apelata. Intre acolade avem codul care
trebuie executat si care, prin instructiunea "return" va returna valoarea lui "z" care
reprezinta suma lui "x" si "y". Astfel valoarea returnata de functia "suma()" va fi valoarea pe
care o are "z".
3. Apelarea functiilor
Dupa ce am creat o functie, pentru a fi folosita, fuctia trebuie apelata.
- O functie care contine argumente se apeleaza in felul urmator:

nume_functie(argument1, argument, ...)

- O functie fara argumente se apeleaza in felul urmator:

nume_functie()

Observati ca la apelul functiei nu se mai folosesc cuvantul "function" si acoladele


In locul in care am apelat astfel o functie va fi executat corpul acelei functii.
4. Exemple de scripturi cu functii
In continuare studiati exemplele de mai jos, care folosesc functii simple, astfel veti
intelege mai bine modul de lucru si executie a unei functii.
- Exemplu 1 - functie fara argument
Urmatorul exemplu prezinta un script care afiseaza un text:
<html>
<head>
<script type="text/javascript">
<!-function exemplu1() {
return document.write("Bine ati venit!")
}
//-->
</script>
</head>
<body>
<script type="text/javascript">
exemplu1()
</script>

</body>
</html>
- Observati ca functia "exemplu1" a fost definita in sectiunea head a documentului HTML si
apoi a fost apelata in sectiunea "body", unde va afisa textul "Bine ati venit!"
- Exemplu 2 - functie cu un argument
Urmatorul exemplu prezinta un script care la apasarea unui buton deschide o fereastra
"alert" care va afisa un text in functie de argumentul transmis.
Specificatie - Sintaxa generala a functiei "alert" din JavaScript este: alert('Text'), aceasta
deschide o fereastra de atentionare in care este afisat mesajul dintre paranteze "Text".
<html>
<head>
<script type="text/javascript">
<!-function exemplu2(text) {
alert(text);
}
//-->
</script>
</head>
<body>
<form>
<input type="button" onclick="exemplu2('Buna dimineata!')" value="dimineata" />
<input type="button" onclick="exemplu2('Buna ziua!')" value="ziua" />
</form>
</body>
</html>
Acest cod va afisa in pagina HTML urmatorul rezultat:

- Studiati cu atentie scriptul si modul in care acesta este apelat.


Textul afisat de "alert" este preluat de la valoarea argumentului functiei "exemplu2" care l-a
randul lui il preia din ceea ce este scris la apelarea functiei.
- "onclick" (la click) este o comanda JavaScript care specifica momentul cand trebuie sa fie
executata functia.
Cand apasati cele doua butoane veti obtine o fereastra 'Alert' cu doua mesaje diferite
(specificate la fiecare apelare a functiei "exemplu2")
- Exemplu 3 - functie cu doua argumente
Urmatorul exemplu prezinta un script care la apasarea unui buton deschide o fereastra
"alert" care va afisa suma a doua numere.

<html>
<head>
<script type="text/javascript">
<!-function exemplu3(x,y) {
var z = 0;
z = x+y;
return alert("Suma lui "+x+" si "+y+" este: "+z)
}

//-->
</script>
</head>
<body>
<form>
<input type="button" onclick="exemplu3(7, 8)" value="Suma" />
</form>
</body>
</html>
Acest cod va afisa in pagina HTML urmatorul rezultat:
- Studiati cu atentie scriptul, modul in care au fost combinate: "alert()", sirul si valoarea
argumentelor "x, y", variabila "z" si modul in care functia "exemplu3" este apelata.
Cand apasati pe buton, veti obtine suma numerelor 7 si 8.
In interiorul functiei pot fi folosite instructiuni complexe, cum ar fi "for", "if", "while"; care pot
lua decizii diferite in functie de argumentele functiei. Depinde doar de cunostintele si
imaginatia dv..

Functii - 2

In aceasta lectie vor fi prezentate trei exemple de scripturi care folosesc functii mai
complexe decat cele prezentate in lectia anterioara.
1. Modifi carea numarului argumentelor
Cand creem o functie ii definim si numarul de argumente pe care le accepta, lucru de
care se tine cont in momentul apelarii ei.
Sunt situatii in care dorim sa transmitem functiei un numar diferit de argumente, care
poate fi mai mic sau mai mare decat numarul de argumente pe care le are functia la
construirea ei.
Intr-o astfel de situatie putem folosi o valoare prestabilita in interiorul functiei, pentru cazul
in care nu sunt transferate argumente.
In continuare va fi prezentat un script care afiseaza un mesaj de salut atunci cand
utilizatorul ajunge la o pagina web. Programul afiseaza un anumit mesaj daca recunoaste
sau nu numele vizitatorului. Daca "utilizator" nu este "null" variabila a fost definita. Acest
lucru este posibil doar daca o valoare, ca " Media", este transferata functiei. Daca variabila
"utilizator" este egal cu "null" atunci scriptul evita folosirea variabilei in mesajul de salut.
<html>
<head>
<script type="text/javascript">
<!-function mesaj(utilizator) {
if (utilizator!=null) {
document.writeln("Salut "+utilizator);

}
else {
document.writeln("Bine ati venit pe site!");
}
}
//-->
</script>
</head>
<body>
<script type="text/javascript">
<!-document.writeln("Prima apelare a functiei mesaj() <br />");
mesaj("Media");
document.writeln("<br />A doua apelare a functiei mesaj() <br />");
mesaj();
//-->
</script>
</body>
</html>
Acest script va afisa in pagina urmatorul rezultat:
Prima apelare a functiei mesaj()
Salut Media
A doua apelare a functiei mesaj()
Bine ati venit pe site!
- Studiati codul functiei si observati diferenta mesajelor din cele ddoua apelari.
In unele situatii unei functii ii sunt transferate mai multe argumente decat au fost specificate
la crearea ei. Valorile argumentelor suplimentare nu sunt pierdute, acestea se stocheaza
intr-un tablou (sau "matrice") numit "arguments" , care exista implicit pentru orice functie.
Toate argumentele sunt pastrate in acest tablou si pot fi extrase in interiorul corpului
functiei.
Argumentele functiei "mesaj" sunt stocate in tabloul "mesaj.arguments". Stocarea se face
intr-o ordine asigurata de o "cheie" a carei prima valoare este 0.
Pentru a extrage primul element din tabloul "arguments" al functiei "mesaj" folosim sintaxa
"arg1 = mesaj.arguments[0]", pentru al doilea "arg2 = mesaj.arguments[1]".
Toate tablourile JavaScript sunt indexate pornind de la 0. Pentru a gasi numarul total de
argumente din tablou putem folosi o instructiune speciala "length" care returneaza
lungimea (nr. de elemente) unui tablou (numit si "matrice").
Urmatorul exemplu atribue variabilei "nrArg" o valoare care reprezinta numarul de
argumente (elemente) din tabloul "mesaj.arguments":

nrArg = mesaj.arguments.length

Folosind instructiunile prezentate mai sus (legate de tabloul "arguments"), putem crea o
noua versiune a scriptului din primul exemplu. Aceasta versiune raspunde mai corect in
functie de cunoasterea sau nu a numelui utilizatorilor.
<html>
<head>
<script type="text/javascript">
<!--

function mesaj(utilizator) {
if (utilizator!=null) {
document.writeln("Salut "+utilizator);
}
else {
document.writeln("Bine ati venit pe site");
}
numarArgumente=mesaj.arguments.length;
if(numarArgumente>1) {
for (var i=1; i<numarArgumente; i++) {
document.writeln(mesaj.arguments[i]);
}
}
}
//-->
</script>
</head>
<body>
<script type="text/javascript">
<!-var utilizator="Marius", extraMesaj="Bine ai revenit";
var utilizator2=null;
var extraMesaj1="Vrei sa devii membru ?";var extraMesaj2="Te poti inscrie online";
mesaj(utilizator,extraMesaj);
document.writeln("<hr>");
mesaj(utilizator2,extraMesaj1,extraMesaj2);
//-->
</script>
</body>
</html>
Acest exemplu va afisa in pagina web urmatorul rezultat:
Salut Marius Bine ai revenit

Bine ati venit pe site Vrei sa devii membru ? Te poti inscrie online
2. Functii recursive
O functie JavaScript poate fi recursiva, adica se poate autoapela.
O metoda buna de a demonstra capacitatea recursiva a functiilor este rezolvarea unei
ecuatii factoriale.
In exemplul urmator avem o functie JavaScript recursiva care afla factorialul unui numar
precizat "n" (aici 7):
<html>
<head>
<script type="text/javascript">
<!-document.writeln("Calculeaza factorialul de 7 prin functie recursiva")

function factorial(n) {
var rezultat;
if (n>0) {
rezultat = n*factorial(n-1);
}
else if (n==0) {
rezultat = 1;
}
else {
rezultat = null;
}
return(rezultat)
}
//-->
</script>
</head>
<body>
<form>
<input type = "button" value = "Factorial 7" onclick="alert(factorial(7))" >
</form>
</body>
</html>
In fereastra browser-ului va apare urmatorul rezultat:
Calculeaza factorialul de 7 prin functie recursiva
- Functia verifica intai daca "n" este mai mare decat 0, apoi in caz afirmativ, "n" se
inmulteste cu rezultatul returnat de auto-apelarea functiei cu argumentul "n-1". Cand "n"
ajunge 0, aparitia cea mai imbricata a functiei se incheie si returneaza prima valoare.
JavaScript incheie fiecare functie imbricata pana ce ajunge la apelarea initiala a functiei
"factorial", apoi intoarce rezultatul final.

Obiectele Java Script - 1

Pentru inceput trebuie sa stiti ce sunt obiectele in programare si care sunt conceptele
fundamentale ale programarii orientate spre obiecte (OOP).
JavaScript nu este un program orientat pe obiecte (OO), cum sunt C++ sau Java, dar este
bazat pe obiecte.
In lumea din jurul nostru obiectele sunt de exemplu: o carte, o masina, un televizor; in
JavaScript obiectele sunt de exemplu: un formular, o fereastra, butoane, imagini ...
Toate elementele dintr-o pagina sunt vazute de JavaScript ca fiind obiecte.
Obiectele au anumite proprietati, de exemplu in lumea reala televizoarele au butoane,
masinile au roti; asa si in JavaScript obiectele au proprietati: formularele au buton,
ferestrele au titluri.
Pe langa obiecte si proprietati, in JavaScript avem si termenul "metode".
Metodele reprezinta functiile pe care un obiect poate sa le faca. Ferestrele se deschid cu
metoda "open()", butoanele au metoda "click()". Parantezele rotunde "()" arata ca se face
referire la o metoda, nu la o proprietate.

Astfel, putem rezuma ca un obiect este o colectie de proprietati si functii (metode)


Sintaxa pentru folosirea obiectelor este:

obiect.prorietate
obiect.metoda()

- Punctul (.) se foloseste pentru a specifica detinatorul metodei sau proprietatii.


Obiectele din JavaScript le putem cataloga in trei categorii principale:

- Obiecte pe partea de client


- Obiecte pe partea de server
- Obiecte esentiale

Astfel avem mai multe tipuri de obiecte care pot fi folosite, pentru incepatori e bine de stiut
in principal obiectele pe partea de client si cele esentiale, cum sunt: "string", "math" sau
cele care vin de la etichetele HTML.
Mai multe astfel de obiecte pot forma o celula (o grupa) numita "clasa", astfel, diferite
obiecte incorporate pentru o executie comuna formeaza un "set de clase" care se mai
numeste si "biblioteca de clase", iar mai exact pentru limbajul JavaScript "biblioteca de
obiecte JavaScript", si pot fi refolosite.
JavaScript are urmatoarele obiecte esentiale, predefinite:

1
2
3
4
5

String
Math
Date
Array
Global

1. Obiectul string
String (sau sir) se foloseste pentru a prelua text.
Proprietatea acestui obiect este:

length - returneaza numarul de caractere dintr-un sir (string)

Metodele obiectului string sunt urmatoarele:

anchor() - Returneaza un sir ca si "anchor"


big() - Returneaza un sir cu text mare
blink() - Returneaza un sir care clipeste
bold() - Returneaza un sir cu litere ingrosate
charAt() - Returneaza un caracter de la pozitia care este specificata
charCodeAt() - Returneaza codul ASCII al unui caracter de la o pozitie
specificata
concat() - Returneaza doua siruri concatenate
fixed() - Returneaza un sir cu caractere tip
fontcolor() - Returneaza un sir cu o culoare specificata
fontsize() - Returneaza un sir cu litere de o anume marime
fromCharCode() - Returneaza valoare Unicode a unui caracater
indexOf() - Returneaza pozitia primei aparitii a unui subsir in un sir, sau daca
subsirul nu e gasit, valoarea -1
italics() - Returneaza un sir in italic (scris aplecat)
lastIndexOf() - Returneaza pozitia primei aparitii a unui subsir in un sir, sau daca
acesta nu e gasit, -1 (Importanr: se incepe din dreapta sirului spre stanga)
link() - Returneaza un sir ca hyperlink
match() - Similar cu indexOf si lastIndexOf, dar aceasta metoda returneaza sirul

specificat sir, sau "null", in locul unor valori numerice


replace() - Inlocuieste intr-un sir unele caractere specificate cu altele noi
specificate.
search() - Returneaza un numar intreg daca sirul contine caracterele specificate,
altfel returneaza -1
slice() - Returneaza un sir incepand de la pozitia index specificata
small() - Returneaza un sir cu caractere mai mici
split() - Imparte un sir in mai multe siruri, in functie de caracterele specificate
strike() - Returneaza un sir taiat cu o linie la mijloc
sub() - Returneaza un sir ca indice
substr() - Returneaza un subsir specificat astfel, exemplu: 12,8 returneaza 8
caractere, incepand de la caracterul al 12-lea (se incepe de la 0)
substring() - Returneaza un subsir specificat astfel, exemplu: 8,12 returneaza
toate caracterele, incepand de la caracterul al 8-lea, pana la al 12-lea
sup() - Returneaza un sir ca putere (superscript)
toFixed(n) - Returneaza sirul numeric rotunjindu-l la o valoare cu 'n' zecimale
toLowerCase() - Converteste un sir in litere mici
toUpperCase() - Converteste un sir in litere mari

In continuare este prezentat un exemplu in care se foloseste proprietatea "length" pentru a


afla cate elemente are un sir si metoda "indexOf" prin care verificam daca un sir dat contine
un anumit cuvant specificat. Daca este gasit cuvantul, se returneaza pozitia primei litere din
el, in caz contrar apare mesajul "Cuvantul nu a fost gasit"
<script type="text/javascript">
var str="MarPlo.net - Cursuri, Jocuri si Anime"
document.write(src+"<br />")
document.writeln("Acest sir are "+ str.length + " caractere")
var pos=str.indexOf("Jocuri")
if (pos>=0) {
document.write("Jocuri incepe de la pozitia: ")
document.write(pos + "<br />")
}
else
{
document.write("Cuvantul nu a fost gasit!")
}
</script>
Primului caracter din sir are pozitia 0, al doilea caracter are pozitia 1, si tot asa ....
Dupa ce este adaugat intr-un document HTML, acest script va afisa in pagina urmatorul
rezultat:
MarPlo.net - Cursuri, Jocuri si Anime
Acest sir are 37 caractere Jocuri incepe de la pozitia: 22

- Iata un alt exemplu in care este foloseste metoda replace().


Avem un sir din care vom pastra doar numerele, eliminand toate celelalte caractere.
<script type="text/javascript">
<!-var sir = 'Un sir test: 123ab 78%';
var sablon = /\D/g;
// \D este echivalent cu [^0-9] iar /g determina urmarirea
sablonului in tot sirul
sir = sir.replace(sablon, '');

document.write(sir);
//-->
</script>
- In acest exemplu avem variabila "sir" ce contine sirul complet si o variabila "sablon" ce
contine o expresie regulata care reprezinta toate caracterele non-numerice, \D fiind
echivalent cu [^0-9] (mai multe detalii despre expresiile regulate gasiti la: RegExp
Javascript).
- Expresia sir.replace(sablon, '') inlocuieste cu '' (adica nimic) caracterele din "sir" care se
incadreaza in "sablon".
- document.write(sir) va afisa sirul care a ramas, adica 12378
2. Obiectul Array (tablou sau matrice)
Obiectul Array (numit si matrice sau tablou de date) se foloseste pentru a stoca mai
multe valori intr-un singur nume de variabila.
Fiecare valoare stocata devine un element al tabloului, acesta are asociat un "numar
index" (sau cheie). Cu ajutorul acestei chei se poate face referire la oricare element din
tablou.
Cu operatorul new se poate crea o "instanta" (incepere) a obiectului Array, ca in exemplul
urmator:

var nume_colegi = new Array(4)

- Unde intre parantezele rotunde este trecut numarul de elemente ale tabloului, aici 4.
Numarul de elemente, cheile, incep implicit de la 0.
Pentru a da valori elementelor din tablou, se scrie numele tabloului urmat de o pereche de
paranteze patrate, in interiorul carora se adauga cheia specifica fiecarui element, apoi
semnul egal si valoarea dorita. Dupa cum puteti vedea in urmatorul exemplu:

nume_colegi[0]
nume_colegi[1]
nume_colegi[2]
nume_colegi[3]

=
=
=
=

"Cristi"
"Ion"
"Simona"
"Adi"

Sau puteti scrie si astfel:

var nume_colegi = Array('Cristi', 'Ion', 'Simona', 'Adi');

- In cazul acesta cheile se subanteleg si sunt aceleasi ca in prima varianta, incepand cu 0.


Pentru a face referire la un anumit element din tablou si pentru a extrage anumite valori din
Array, se scrie numele tabloului si intre parantezele patrate cheia specifica acelui element;
ca in exemplul urmator:

coleg = nume_colegi[0]
colega = nume_colegi[2]

Astfel, variabila "coleg" va avea valoarea "Cristi" si variabila "colega" valoarea "Simona".
Pentru a afla numarul de elemente ale unui Array, se foloseste proprietatea "length", ca in
exemplu urmator:

nr_colegi = nume_colegi.length

Obiectul Array are urmatoarele metode:

concat() - Returneaza un tablou rezultat din concatenarea a doua tablouri


join() - Returneaza un tablou format din toate elementele unui tablou concatenat
reverse() - Returneaza inversul unui tablou
slice() - Returneaza o parte specificata a unui tablou
sort() - Returneaza tabloul ordonat

Urmatorul exemplu foloseste o instructiune "for" care parcurge un tablou (aici tabloul
"nume_colegi"), extrage valoarea fiecarui element si o afiseaza.
<script type="text/javascript">
<!-var nume_colegi = new Array();
nume_colegi[0] = "Cristi";
nume_colegi[1] = "Ion";
nume_colegi[2] = "Simona";
nume_colegi[3] = "Adi";
var nr_elemente = nume_colegi.length;

// Afla nr. elemente din matrice

document.write("Afiseaza numele fiecarui coleg: <br />");


for (i=0; i<nr_elemente; i++) {
document.write(nume_colegi[i] + "<br />");
}
//-->
</script>
- Am definit variabila "nr_elemente" pentru a afla numarul de elemente din matrice, pentru
a-l folosi cu instructiunea "for". Este utila aceasta metoda deoarece de multe ori putem lucra
cu matrici ale caror nr. de elemente nu-l stim exact. - In pagina HTML va fi afisat urmatorul
rezultat:
Afiseaza numele fiecarui coleg:
Cristi
Ion
Simona
Adi

Iata un alt exemplu din care puteti intelege cum se aplica metoda "sort()" si efectul acesteia.
Folosim acelasi exemplu de mai sus.
"sort()" sorteaza elementele din Array in ordine alfabetica (sau crescatoare in cazul valorilor
numerice).
<script type="text/javascript">
<!-var nume_colegi = new Array();
nume_colegi[0] = "Cristi";
nume_colegi[1] = "Ion";
nume_colegi[2] = "Simona";
nume_colegi[3] = "Adi";
var nr_elemente = nume_colegi.length;
// Afla nr. elemente din matrice
nume_colegi.sort();
// Aranjeaza elementele in ordine crescatoare, alfabetic

document.write("Afiseaza numele in ordine alfabetica: <br />");


for (i=0; i<nr_elemente; i++) {
document.write(nume_colegi[i] + "<br />");
}
//-->
</script>
- In pagina HTML va fi afisat urmatorul rezultat:
Afiseaza numele in ordine alfabetica:
Adi
Cristi
Ion
Simona

Obiectele Java Script - 2

In aceasta lectie este continuata prezentarea si explicarea obiectelor esentiale


JavaScript
1. Obiectul Date
Obiectul Date se foloseste pentru a lucra cu data zilei si timp.
Sunt doua lucruri importante pe care trebuie sa le cunoasteti inainte de a folosi acest
obiect:

1. Data initiala (de referinta) este 1-01-1970, nu puteti sa lucrati cu date


anterioare acesteia.

2. Cand creati un obiect "Date", ora folosita de obiect este aceea de pe


calculatorul client (al vizitatorului).

Pentru a crea o instanta a obiectului "Date" se foloseste operatorul new, ca in exemplu


urmator:

var data = new Date();

- Astfel se memoreaza data curenta intr-o variabila, aici cu numele "data".


Dupa ce a fost creata instanta, se pot folosi metodele obiectului.
De exemplu, daca se doreste afisat numarul zilei (care e de la 1 la 31) se scrie urmatoarea
comanda (aici e folosita instanta cu numele "data"):

data.getDate()

Se pot crea si altfel obiecte Date, care pot afisa data si ora intr-un mod specificat:

new
new
new
new
new

Date("Month dd, yyyy hh:mm:ss")


Date("Month dd, yyyy")
Date(yy,mm,dd,hh,mm,ss)
Date(yy,mm,dd)
Date(milliseconds)

- Unde: Month=luna, dd=ziua (cu 2 caractere), y=anul (yy e afisat cu 2 caractere iar yyyy cu
4), h=ora, m=minute, s=secunde, milliseconds=milisecunde.
Astfel se pot crea variabile de data pt. fiecare obiect Date de mai sus, ca in exemplu
urmator:

var
var
var
var
var

data=new
data=new
data=new
data=new
data=new

Date("October 15, 1996 15:16:00")


Date("October 15, 1996")
Date(96,10,15,15,16,00)
Date(96,10,15)
Date(500)

- Metodele obiectului Date:

Date() - Returneaza un obiect Date

getDate() - Returneaza data (ziua) din luna (intre 1-31)

getDay() - Returneaza ziua dintr-un obiect Date (intre 0-6; 0=Duminica, 1=Luni,
etc.)

getMonth() - Returneaza luna dintr-un obiect Date (intre 0-11. 0=January,


1=February, etc.)

getFullYear() - Returneaza anul dintr-un obiect Date (patru cifre)

getHours() - Returneaza ora dintr-un obiect Date (intre 0-23)

getMinutes() - Returneaza minutele dintr-un obiect Date (intre 0-59)

getSeconds() - Returneaza secunda dintr-un obiect Date (intre 0-59)

getMilliseconds() - Returneaza milisecunda dintr-un obiect Date (intre 0-999)

getTime() - Returneaza numarul de milisecunde pana la miezul noptii

getTimezoneOffset() - Returneaza diferenta de timp intre computer si GMT

getUTCDate() - Returneaza data dintr-un obiect Date in (UTC) timp universal

getUTCDay() - Returneaza ziua dintr-un obiect Date in timp universal

getUTCMonth() - Returneaza luna dintr-un obiect Date in timp universal

getUTCFullYear() - Returneaza anul (4 cifre) dintr-un obiect Date in timp


universal

getUTCHours() - Returneaza ora dintr-un obiect Date in timp universal

getUTCMinutes() - Returneaza minutele dintr-un obiect Date in timp universal

getUTCSeconds() - Returneaza secundele dintr-un obiect Date in timp universal

getUTCMilliseconds() - Returneaza millisecundele dintr-un obiect Date in timp


universal

parse() - Returneaza un sir ce are ca valoare numarul de millisecunde pana in


January 01 1970 00:00:00

setDate() - Seteaza luna in un Obiect Date (intre 1-31)

setFullYear() - Seteaza anul in un Obiect Date (four digits)

setHours() - Seteaza ora in un Obiect Date (intre 0-23)

setMilliseconds() - Seteaza millisecundele in un Obiect Date (intre 0-999)

setMinutes() - Seteaza minutele in un Obiect Date (intre 0-59)

setMonth() - Seteaza luna in un Obiect Date (intre 0-11. 0=January, 1=February)

setSeconds() - Seteaza secunda in un Obiect Date (intre 0-59)

setTime() - Seteaza millisecundele dupa 1/1-1970

setUTCDate() - Seteaza data in un Obiect Date, in timp universal (intre 1-31)

setUTCMonth() - Seteaza luna in un Obiect Date, in timp universal (intre 0-11.


0=January, 1=February)

setUTCFullYear() - Seteaza anul in un Obiect Date, in timp universal (four digits)

setUTCHour() - Seteaza ora in un Obiect Date, in timp universal (intre 0-23)

setUTCMinutes() - Seteaza minutele in un Obiect Date, in timp universal (intre


0-59)

setUTCSeconds() - Seteaza secundele in un Obiect Date, in timp universal (intre


0-59)

setUTCMilliseconds() - Seteaza millisecundele in un Obiect Date, in timp


universal (intre 0-999)

toLocaleString() - Converteste un Obiect Date la un sir, ce contine ora curenta

toString() - Converteste un Obiect Date la un sir

Pentru a intelege mai bine obiectul Date si modul de lucru cu metodele lui, studiati si
urmatorul exemplu:
<script type="text/javascript">
<!-var d = new Date()

document.write("Afiseaza data curenta a zilei: <br /> ")


document.write(d.getDate())
document.write(".")
document.write(d.getMonth() + 1)
document.write(".")
document.write(d.getFullYear())
//-->
</script>
Adaugat intr-un document HTML, in sectiunea BODY, acest script va afisa:
Afiseaza data curenta a zilei:
28.1.2014
2. Obiectul Math
Acest obiect include constante matematice si functii.
Nu este nevoie sa fie creat (instantat) un obiect Math inainte de a fi folosit.
Daca, de exemplu dorim sa obtinem un numar aleator intre 0 si 1, scriem comanda:

nr_aleator = Math.random()

- Proprietatile obiectului Math (sunt o lista de constante matematice. Atentie! se scriu cu


litera mare):

E - Returneaza constanta lui Euler (2.7182.......)

LN2 - Returneaza logaritm natural din 2

LN10 - Returneaza logaritm natural din 10

LOG2E - Returneaza logaritm in baza 2 din E

LOG10E - Returneaza logaritm in baza10 din E

PI - Returneaza PI

SQRT1_2 - Returneaza radical din 0.5

SQRT2 - Returneaza radical din 2

- Metodele obiectului Math:

abs(x) - Returneaza valoarea absoluta din x

acos(x) - Returneaza arccosinus din x

asin(x) - Returneaza arcsinus din x

atan(x) - Returneaza arctangenta din x

atan2(y,x) - Returneaza unghiul dintre axa si un punct (x,y)

ceil(x) - Returneaza cel mai apropiat intreg mai mare sau egal cu x

cos(x) - Returneaza cosinus din x

exp(x) - Returneaza valoarea lui E la puterea x

floor(x) - Returneaza cel mai apropiat intreg mai mic sau egal cu x

log(x) - Returneaza log natural din x

max(x,y) - Returneaza maximul dintre x si y

min(x,y) - Returneaza minimul dintre x si y

pow(x,y) - Returneaza valoare a lui x la puterea y

random() - Returneaza un numar aleator intre 0 si 1

round(x) - Rotunjeste pe x la cel mai apropiat intreg

sin(x) - Returneaza sinus din x

sqrt(x) - Returneaza radical din x

tan(x) - Returneaza tangenta din x

Iata si un exemplu practic, urmatorul script rotunjeste o valoare (aici 8.35) la cel mai
apropiat intreg:
<script type="text/javascript">
document.write("8.35 rotunjit este: " + Math.round(8.35));
</script>
Dupa ce este adaugat intr-un document HTML, in sectiunea BODY, acest script va afisa:
8.35 rotunjit este: 8
Obiecte de tip Global
Obiectele de tip Global grupeaza proprietatile si metodele de nivel cel mai inalt, fara un
obiect parinte, cum sunt functiile.
Obiectul Global are trei proprietati:

Infinity - cuvant-cheie care reprezinta plus sau minus infinit

NaN - reprezinta un obiect null, care nu are vreo valoare

undefined - Indica daca o variabila a fost sau nu definita

Metodele acestui obiect (care pot fi considerate si functii JavaScript) sunt:

escape() - Intoarce un obiect sir in care toate caracterele non alfa-numerice sunt
transformate in echivalentele lor numerice

eval() - Accepta un sir de instructiuni Java Script si il evalueaza ca fiind cod sursa

isFinite() - determina daca o variabila are limite finite

isNaN() - determina daca o variabila este sau nu un numar.

Number() - Converteste valoarea unui obiect in numar

parseFloat() - transforma un sir intr-un numar de tip float (cu virgula)

parseInt() - transforma un sir intr-un numar intreg

string() - Converteste valoarea unui obiect in string (de tip sir)

unescape() - ia o valoare hexazecimala si intoarce echivalentul sau in ISOLatin-1


ASCII

Pentru a intelege mai bine, studiati urmatorul exemplu. Aici este folosita de doua ori metoda
"eval()", acesta transforma si interpreteaza argumentul primit in cod JavaScript.
<script type="text/javascript">
function calculeaza(form) {
form.rezultat.value = eval(form.expresie.value);
}
eval("alert('Bine ati venit pe site!')");
</script>
<form>
<p>Introduceti o expresie matematica (adunare, scadere, inmultire, impartire), de
exemplu (7*8 sau 3+8/2): </p>
<input type="text" name="expresie" size="35" >
<input type="button" name="calc" value="Calculare" onclick="calculeaza(this.form)">
<br>
Rezultatul este:
<input type="text" name="rezultat" size="18">
</form>
Acest cod afiseaza la inceput o fereastra Alert apoi in browser va fi afisat urmatorul rezultat:
Introduceti o expresie matematica (adunare, scadere, inmultire, impartire), de exemplu (7*8
sau 3+8/2):

Rezultatul este:

Dupa apasarea butonului "Calculare", prin "onclick" este accestata functia "calculeaza()".
Scriptul JavaScript din HEAD, transfera in campul cu nmele "rezultat", din FORM, valoarea
obtinuta prin evaluarea expresiei adaugate in campul "expresie", calcularea expresiei fiind
posibila datorita folosirii metodei "eval()".

Ierarhia Java Script

JavaScript organizeaza toate elementele unei pagini web intr-o ierarhie. Toate
elementele sunt vazute ca obiecte si fiecare obiect are anumite proprietati si metode sau
alte obiecte.
Cu JavaScript putem manipula usor obiectele. Pentru aceasta este importanta intelegerea
ierarhiei obiectelor HTML.

JavaScript intelege fereastra browser-ului ca pe un obiect window, acesta


contine anumite elemente, cum ar fi de exemplu bara de stare (status bar).

In fereastra browser-ului putem incarca (afisa) un document HTML (sau si de alt


tip, dar aici ne referim la HTML). Aceasta pagina din interiorul navigatorului este
un obiect document.

1. Obiectul document
Acesta este unul din obiectele cele mai importante in JavaScript, este folosit foarte des.
Obiectul Window lasa continutul unui document web in grija obiectului Document, acesta
este responsabil de continutul afisat pe o pagina si se poate lucra cu el pentru afisarea de
paginii HTML dinamice.
Obiectul document contine mai multe proprietati, cum ar fi culoarea de fundal a paginii
(bgcolor) sau alte obiecte, cum sunt tag-urile HTML. De retinut ca toate elementele HTML
sunt proprietati ale obiectului document, si la randul lor acestea sunt obiecte. Un obiect
HTML este de exemplu un formular, o eticheta DIV sau un link.
Pentru a desemna obiectul sau proprietatea curenta pe care dorim sa o folosim, adaugam
cuvantul this urmat de caracterul punct (.) si numele proprietatii, dupa cum vedeti in
urmatoarea sintaxa:

this.nume_proprietate

Astfel aceasta expresie se adreseaza proprietatii "nume_proprietate" din obiectul curent.


Obiectul document are urmatoarele proprietati:

alinkColor - culoarea unei legaturi active

all - tabloul tuturor etichetelor HTML din document

anchors - tabloul de obiecte "Anchor", in ordinea specificata in sursa

applets - tabloul de obiecte "Applet"

bgcolor - culoarea de fundal a documentului

classes - tabloul claselor paginilor cu stiluri

cookie - fisier cookie asociat cu documentul

domain - domeniu al documentului

embeds - tablou de obiecte inglobate

fgcolor - culoarea textului in document

forms[] - tablou de obiecte "Form" (formular)

formName - specifica instanta "Form" care este accesata prin folosirea valorii
atributului "name" din eticheta <form>

height - specifica inaltimea documentului in pixeli

ids - tabloul identificatorilor paginii cu stiluri

images - tablou de obiecte "Image"

lastModified - data cand a fost modificat ultima oara documentul

layers - tablou de obiecte "Layer"

linkColor - culoarea legaturilor

links - tablou de obiecte "Link", ce corespund tuturor link-urilor HREF din


document, in ordinea specificata in sursa

plugins - tablou de obiecte inglobate

referrer - adresa URL (externa) a documentului la care a fost legat documentul


curent

tags - tabloul etichetelor paginii cu stiluri

title - titlul documentului

URL - adresa URL a documentului curent

vlinkColor - culoarea legaturilor vizitate

width - specifica latimea documentului in pixeli

lastModified - URL-ul documentului

Obiectul document are urmatoarele meode:

captureEvents() - captureaza evenimentele care vor fi tratate de document

close() - inchide fluxul datelor de iesire spre document

contextual() - permite sa aplicam in mod selectiv un stil unui element HTML care
apare intr-un anumit context specific

getSelection() - intoarce textul selectat

handleEvent() - apeleaza handlerul pentru evenimentul specificat

open() - deschide fluxul datelor de iesire spre document

releaseEvents() - elibereaza evenimentele capturate de document

routeEvent() - dirijeaza evenimentele capturate spre alte obiecte

write() - adauga text in document

writeln() - adauga text si un caracter linie noua in document (textul pe linia lui)

In urmatorul exemplu puteti vedea cum au fost folosite proprietatile obiectului document
pentru stabilirea culorii de fundal, a textului, link-urilor si titlul unei pagini web:
<script type="text/javascript">
<!-document.bgColor = '#eaeafe'
document.fgColor = '#fe1111'
document.linkColor = '#01ff01'
document.title = "Lectie JavaScript"
//-->
</script>
Acest script seteaza culoarea de fundal a pagini "#eaeafe" (un albastru desechis), culoarea
textului rosu, a legaturilor verde si titlul "Lectie Java Script".
2. Obiectul document si Formulare
Formularele de asemenea pot fi considerate si tratate ca obiecte dintr-un document
HTML, acestea fiind sub-obiecte ale obiectului "document", astfel se apeleaza impreuna cu
acesta.
Penru a intelege mai bine lucrul cu obiectul document si cum se lucreaza cu ierarhia
obiectelor, studiati si urmatorul exemplu:
<html>
<head>
<script type="text/javascript">
<!-function afisare()
{
nume = document.nume_form.nume_camp.value;
return nume
}
//-->
</script>
</head>
<body >
<form name="nume_form">
Name: <input type="text" name="nume_camp" value=""><br>
<input type="button" value="Apasa" name="Buton" onClick="alert('Salut ' +afisare())">
</form>
</body>
</html>
Acest cod va afisa in pagina urmatorul formular:

Name:

Dupa ce scrieti in campul "Name" un nume si apasati butonul "Apasa" va apare o vereastra
Alert cu mesajul "Salut "nume" ".
Ierarhia obiectelor din pagina afisata de acest exemplu este urmatoarea:

document (pagina HTML) -> Forms[0] (sau numele formularului din "name"
- intregul formular) -> {Element[0] (primul camp din
formular), Element[1] (butonul din formular)}

Daca de exemplu doriti sa aflati ce se introdce in primul element din formular, trebuie sa va
ganditi cum sa accesati acest obiect.
Pornim din vrful ierarhiei "document", urmarim calea catre primul formular "forms[0]" pana
la obiectul numit "elements[0]" (se adauga toate numele obiectului pe masura ce le
depasim). Astfel putem accesa primul element prin :

document.forms[0].elements[0]

Pentru a afla ce text a fost introdus, apelam valoarea acelui element. Pentru elemente din
formular (tip "input") se foloseste proprietatea "value". Acesta arata valoarea casetei "input"
respective (aici textul introdus in campul de text). Acum putem afla valoarea cu ajutorul
urmatoruli cod:

name = document.forms[0].elements[0].value;

Valoarea este stocata in variabila "name", pe care o putem folosi in script.


Astfel, putem crea o fereastra cu ajutorul liniei de cod "alert("Salut! " + name)", unde
"name" va fi valoarea variabilei "name" care reprezinta textul introdus in primul element din
primul formular.
Daca aveti formulare de dimensiuni mari, poate deveni dificila apelarea obiectelor dupa
ordinea lor, prin numere intre paranteze patrate. Daca am avea trei formulare si vrem sa
apelam al cincisprezecelea element (camp) din al treilea formular, ar trebui sa scriem
"document.forms[2].elements[14]". Pentru a facilita astfel de apelari, se pot da nume unice
diferitelor obiecte, folosind atributul "name", dupa cum puteti vedea in exemplu urmator:

<form name="nume_form">
Nume: <input type="text" name="nume_element" value="">

Astfel "forms[0]" este de asemenea "nume_form" si in loc de "elements[0]" puteti utiliza


"nume_element" (specificat cu atributul "name" in eticheta <input>).
Prin urmare, in loc de a scrie "name = document.forms[0].elements[0].value;" se poate
scrie:
"name = document.nume_form.nume_element.value;"

Obiecte Navigator, History si Location

In aceasa lectie sunt prezentate obiectele JavaScript de nivel 1: obiectul "navigator


(browser)", obiectul "History" si obiectul "Location"
1. Obiectul Navigator
Obiectul Navigator reprezinta programul, aplicatia browser folosita pentru
vizualizarea rezultatelor.
Cu acest obiect putem gasi informatii despre denumirea si versiunea browser-ului, precum
si alte informatii care pot fi folosite in practica.
Obiectul Navigator are la randul lui doua sub-obiecte (sau obiecte copil) : "Plugin" si
"Mimetype".
- Proprietati ale obiectului "navigator" sunt urmatoarele:

appCodeName - reprezinta numele de cod al browserului

appName - reprezinta numele oficial al browserului

appVersion - versiunea browserului

language - limbajul browserului

mimeTypes - face referire la un tablou de obiecte "Mimetype" care contine toate


tipurile MIME pe care le accepta browserul

platform - un sir care reprezinta platforma pe care ruleaza browserul

plugins - face referire la un tablou de obiecte "Plugin" care contine toate


modulele plugin instalate pe browser

userAgent - sir care reprezinta antetul utilizator-agent

- Metode ale obiectului "navigator" sunt urmatoarele:

javaEnabled() - functie care testeaza daca browserul cunoaste sau nu limbajul


JAVA

plugins.refresh() - cauta orice module plugin nou instalate

preference() - permite citirea si stabilirea diverselor preferinte ale utilizatorului


in browser

taintEnabled() - testeaza daca este activata contaminarea datelor

Urmatorul script afiseaza proprietatile si metodele navigatorului (browser-ului) folosit:


<body>
<script type="text/javascript">
<!-document.write("Nume cod :".bold()+navigator.appCodeName+"<br>");

document.write("Nume browser :".bold()+navigator.appName+"<br>");


document.write("versiune :".bold()+navigator.appVersion+"<br>");
document.write("limbaj :".bold()+navigator.language+"<br>");
document.write("MIME Type :".bold()+navigator.mimeTypes+"<br>");
document.write("Platforma :".bold()+navigator.platform+"<br>");
document.write("Plugin-uri :".bold()+navigator.plugins+"<br>");
document.write("Agent :".bold()+navigator.userAgent+"<br>");
document.close();
//-->
</script>
</body>
In pagina dv. acesta afiseaza urmatorul rezultat:
Nume cod :Mozilla
Nume browser :Netscape
versiune :5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko)
Chrome/32.0.1700.76 Safari/537.36
limbaj :ru
MIME Type :[object MimeTypeArray]
Platforma :Win32
Plugin-uri :[object PluginArray]
Agent :Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko)
Chrome/32.0.1700.76 Safari/537.36
2. Obiectul History
Navigatoarele web au o caracteristica numita "History" care permite urmarirea locatiilor
pe care le-ati vizitat. Acest obiect contine un tablou (Array) cu paginile vizitate de client, in
cadrul unei ferestre, un istoric al paginilor vizitate.
Obiectul History permite navigarea inapoi in lista istoric la paginile care au mai fost
vizitate in cadrul aceleasi ferestre.
- Proprietatile obiectului "history" sunt urmatoarele"

current - face referire la adresa URL curenta din lista istoric

length - intoarce numarul de intrari din lista istoric

next - face referire la urmatoarea adresa URL din lista istoric

previous - face referire la adresa URL anterioara din lista istoric

- Metodele obiectului "history" sunt urmatoarele"

back() - incarca ultima adresa URL din lista istoric

forward() - incarca urmatoarea adresa URL din lista istoric

go(x) - incarca o adresa URL, echivalenta cu un salt la numarul "x" (pozitiv sau
negativ) din lista istoric

Daca dorim intoarcerea inapoi cu 3 pagini in lista istoric, putem folosi o functie si obiectul
"History" ca in exemplul urmator:
<script type="text/javascript">
<!-function inapoi3 {
window.history,go(-3);
}
//-->
</script>
- Unde "inapoi3" este numele functiei si (-3) reprezinta numarul de pagini la care se face
saltul, pornind de la pagina curenta, negativ face saltul inapoi iar daca numarul dintre
paranteze este pozitiv face saltul inainte in lista istoric.
3. Obiectul Location
Acest obiect contine date despre originea unei pagini web, stocheaza informatii despre
o adresa URL dintr-o fereastra specifica.
- Proprietatile obiectului "location" sunt urmatoarele"

hash - reprezinta un nume de ancora in adresa URL, care incepe cu caracterul


diez (#)

host - reprezinta numele calculatorului gazda si numarul de port al adresei URL

hostname - reprezinta partea cu numele calculatorului gazda din adresa URL

href - reprezinta adresa URL completa

pathname - reprezinta partea PATH_INFO a adresei URL

port - reprezinta partea de port a adresei URL

protocol - reprezinta partea de protocol a adresei URL

search - partea de cautare a adresei URL, inclusiv caracterul "?"

- Metodele obiectului "location" sunt urmatoarele"

reload() - reincarca adresa URL curenta in fereastra de browser

replace() - incarca noua pagina transferata in browserul curent

De exemplu, daca doriti sa preluati intr-un script JS parti din adresa URL, si anume domeniul
si calea catre pagina curenta sau toata adresa (fara protcol, care de obicei e "http:" ori
"https":), puteti folosi modelul urmator:
<script type="text/javascript">
<!-function get_url() {
var domeniu = window.location.hostname;
// Preia numele domeniului din adresa

URL
var cale = window.location.pathname;
pagina curenta
var url = domeniu+cale;
(fara protocol)

// Preia cale ce reprezinta directorul si


// Compune variabilele pt. a forma adresa URL

alert("Adresa paginii este: \n" + url);


}
//-->
</script>
<form action=""><input type="button" value="Click" onclick="get_url()" /></form>
- Acest script va avea urmatorul rezultat, va afisa in pagina butonul de mai jos care, dupa ce
veti da click, va afisa o fereastra alert cu domeniul si adresa paginii curente.
- Studiati scriptul si comentariile din codul lui.
Daca doriti sa regasiti portiunea de protocol a adresei URL curente, puteti folosi urmatorul
exemplu :
<script type="text/javascript">
var protocol = window.location.protocol;
</script>

- Observati modul de lucru bazat pe obiecte. Intai se adauga obiectul de rang


superior ( window ) apoi, dupa un caracter punct (.) se adauga urmatorul subobiect in care vrem sa lucram (aici "location"), si dupa un caracter punct adaugam
proprietatea acestui obiect la care vrem sa facem referire.

Mimetype Plughin, Anchor, Area, Applet, Layer si Link

In aceasta lectie sunt prezentate subobiecte ale obiectului "Navigator" si "Document",


care in ierarhia generala pot fi considerate obiecte de nivel doi.
1. Obiectul Mimetype
Numele acestui obiect vine de la Multipurpose Internet Mail Extensions (extensii aduse
serviciului de posta electronica) si este un subobiect al obiectului "Navigator".
Mimetype permite accesarea informatiilor despre tipurile MIME pe care le recunosc
modulele plugin ale browserului.
Acesta, ca si obiectul "Plugin", nu sunt recunoscute de Internet Explorer (cel putin pana in
versiunea 7).
Proprietati ale obiectului "Mimetype" sunt urmatoarele :

description - contine descrierea obiectului "Mimetype"


enabledPlugin - contine modulul plugin pentru un obiect "Mimetype" specific
suffixes - contine extensia de fisier pentru "Mimetype"
type - contine reprezentarea de tip sir a obiectului "Mimetype"

2. Obiectul Plughin
La fel ca si "Mimetype", nici obiectul Plughin nu este recunoscute de Internet
Explorer.
Acest obiect face referire la modulele plugin instalate pentru browser si contine un tablou
de elemente si tipuri MIME tratate de fiecare modul plugin instalat.
Obiectul "Plugin" are o singura metoda legata direct de el : metoda "plugins.refresh()",
care apartine de obiectul "navigator". Aceasta metoda permite reconstruirea tabloului de
module plugin.
Proprietatile obiectului "Plugin" sunt urmatoarele :

description - face referire la o descriere a modulului plugin


filename - face referire la numele fisierului unui program plugin
length - face referire la numarul de tipuri MIME continute in tablou
name - face referire la numele modulului plugin

3. Obiectul Anchor
Acest obiect este un text sau o imagine in pagina HTML care poate fi tinta unei legaturi
hipertext. "Anchor" este un obiect JavaScript foarte putin important si folosit rar, totusi e
bine sa-l cunoasteti
Proprietatie obiectului "Anchor" sunt urmatoarele :

name - nume care ofera acces la ancora de la o legatura


text - textul care apare intre etichetele <a> si </a>
x - coordonata x a ancorei
y - coordonata y a ancorei

4. Obiectul Area
Obiectul Area permite sa definim o suprafata dintr-o imagine ca fiind o harta de
imagini. Atributul "href" al unui obiect "<area>" este incarcat intr-o fereastra tinta atunci
cand vizitatorul executa click pe o locatie specificata.
Mai multe detalii despre hartile de imagini HTML gasiti la pagina Harti de imagini.
Acest obiect are o singura metoda:

handleEvent() apeleaza handlerul de evenimente asociat acestui eveniment

Proprietatie obiectului "Area" sunt urmatoarele :

hash - portiunea de adresa URL care este ancora, inclusiv semnul diez ( # )
host - numele calculatorului gazda (adresa IP) si portul specificat in adresa URL
hostname - numele calculatorului gazda specificat in adresa URL
href - intreaga adresa URL
pathname - calea fisierului specificat in adresa URL, incepand cu simbolul /
port - portul specificat in adresa URL
protocol - protocolul specificat in adresa URL, inclusiv caracterul doua puncte
(:)
search - partea de cautare a adresei URL, inclusiv caracterul initial semnul
intrebarii (? )
target - numele ferestrei tinta in care ar trebui afisata adresa URL
text - textul care apare intre etichetele <area> si </area>

x - coordonata x a suprafetei
y - coordonata y a suprafetei
5. Obiectul Applet
Obiectul Applet reprezinta echivalentul JavaScript al etichetei HTML <applet>.
Acest obiect adreseaza un applet Java. Aceste obiecte JavaScript nu au metode proprii, dar
in practica putem folosi JavaScript ca sa accesam metodele unui anumit applet scris in
limbajul Java.
Proprietatile obiectului "Applet" sunt toate campurile publice ale respectivului applet Java,
iar metodele sunt toate metodele publice ale acestuia.
6. Obiectul Layer
Si acesta este un obiect cu anumite particularitati, este recunoscut doar de browserele
Netscape, Mozilla si permite limbajului JavaScript sa acceseze straturile din interiorul
documentului.
Utilizarea acestui obiect necesita cunostinte DHTML.
Proprietatie obiectului "Layer" sunt urmatoarele :

above - specifica stratul de deasupra


background - face referire la imaginea de fundal a stratului
below - specifica stratul de dedesubt
bgColor - face referire la culoarea de fundal a stratului
clip.bottom - face referire la partea de jos a suprafetei decupate a stratului
clip.height - face referire la inaltimea suprafetei decupate a stratului
clip.left - face referire la partea stanga a suprafetei decupate a stratului
clip.right - face referire la partea dreapta a suprafetei decupate a stratului
clip.top - face referire la partea de sus a suprafetei decupate a stratului
clip.width - face referire la latimea suprafetei decupate a stratului
document - face referire la obiectul "Document" care contine stratul
left - face referire la coordonata X a stratului
name - face referire la numele stratului
pageX - face referire la coordonata X, relativ la document
pageY - face referire la coordonata Y, relativ la document
parentLayer - face referire la stratul containe
rsiblingAbove - face referire la stratul de deasupra in "zIndex"
siblingBelow - face referire la stratul de dedesubt in "zIndex"
src - face referire la adresa URL sursa pentru strat
top - face referie la coordonata Y a stratului
visibility - face referire la starea de vizibilitate a stratului
window - face referire la obiectul "Window" sau "Frame" care contine stratul
x - face referire la coordonata X a stratului
y - face referire la coordonata Y a stratului
zIndex - face referire la ordinea z-relativa a acestui strat in raport cu fratii lui

Metodele obiectului "Layer" sunt urmatoarele :

captureEvent() - specifica tipul de evenimente care sa fie capturate


handleEvent() - apeleaza handlerul pentru evenimentul specificat
load() - incarca o noua adresa URL
moveAbove() - deplaseaza stratul deasupra altui strat
moveBelow() - deplaseaza stratul sub alt strat
moveBy() - deplaseaza stratul intr-o pozitie specificata
moveTo() - deplaseaza coltul din stanga sus al ferestrei la coordonatele
specificate ale ecranului

moveToAbsolute() - modifica pozitia stratului in pagina, conform coordonatelor


specificate in pixeli
releaseEvents() - stabileste ca stratul sa elibereze evenimentele capturate de
tipul specificat
resizeBy() - redimensioneaza stratul cu valorile de inaltime si latime specificate
resizeTo() - redimensioneaza stratul la valorile de inaltime si latime specificate
7. Obiectul Link
Obiectul link permite lucrul cu legaturi (link-uri) in cadrul codului JavaScript. Deoarece
un link reprezinta un URL care face referire la o alta pagina HTML sau la alta destinatie,
este asemanator cu obiectul "Location" (care continea aceleasi informatii pentru pagina
HTML curenta).
Acest obiect are o singura metoda:

handleEvent() apeleaza handlerul pentru evenimentul specificat

Proprietatie obiectului "Link" sunt urmatoarele :

hash - reprezinta o denumire de ancora in adresa URL pentru legatura, care cu


caracterul diez ( # )
host - reprezinta portiunea de calculator gazda din adresa URL asociata cu o
legatura
hostname - reprezinta portiunea de nume al calculatorului gazda din adresa URL
asociata cu o legatura
href - reprezinta adresa URL completa asociata cu o legatura
pathname - reprezinta portiunea numelui de cale a legaturii URL
port - reprezinta portiunea de port a legaturii URL
protocol - specifica portiunea de protocol a legaturii URL
search - reprezinta portiunea de interogare a legaturii URL
target - reprezinta numele obiectului "Window" in care este afisata legatura
x - face referire la coordonata X a legaturii
y - face referire la coordonata Y a legaturii
text - textul folosit pentru crearea legaturii
Button, Checkbox, FileUpload, Hidden, Password, Radio

Obiectele de nivelul 3 sunt subobiecte ale obiectului "Form".


La fel cum imbricati (adAaugati) elementele HTML in interiorul etichetelor <form>, aceste
obiecte sunt imbricate in interiorul obiectului "Form".
1. Obiectul Button
Java Script are trei obiecte buttons: Button, Submit si Reset. Fiecare din ele are o
reprezentare a unei etichetei HTML.
Obiectul Button este un buton generic, la care, pentru a fi folosit pt. o anumita functie,
trebuie sa-i adaugam linii de cod specifice, dar celelalte doua: Submit (trimite datele la un
script) si Reset (sterge datele noi completate in formular); au scopuri specifice. Totusi, se
poate sa folosim un obiect "Button" pentru a avea acelasi rol ca si obiectul "Submit"
(apeland Form.submit()), sau ca obiect "Reset" (apeland Form.reset()).
Proprietati ale obiectului "Button" sunt urmatoarele :

form - returneaza obiectul Form al carui membru este butonul


name - returneaza sirul specificat in atributul name al etichetei HTML <input>
type - returneaza sirul specificat in atributul type al etichetei HTML <input>
value - returneaza sirul care apare in reprezentarea grafica a unui buton, afisata
in browser

Metode ale obiectului "Button" sunt urmatoarele :

blur() - dezactiveaza butonul


click() - apeleaza un eveniment click pentru butonul respectiv.
focus() - eveniment de activare a butonului
handle Event() - transfera un eveniment handlerului de eveniment
corespunzator

2. Obiectul Checkbox
Acest obiect reprezinta caseta de validare HTML dintr-un "Form", care permite
vizitatorului sa specifice o valoare "DA" sau "NU", ori "true" sau "false".
Proprietati ale obiectului "Checkbox" sunt urmatoarele :

checked - returneaza o valoare booleana care determina daca este bifata caseta
de validare
defaultChecked - returneaza o valoare booleana care pastreaza starea initiala a
casetei de validare. Este stabilita cu atributul "checked"
form - returneaza obiectul Form al casetei de validare
name - returneaza sirul specificat in atributul name al etichetei HTML <input>
type - returneaza sirul specificat in atributul type al etichetei HTML <input>
value - returneaza o valoare returnata cand formularul este inaintat

Metode ale obiectului "Checkbox" sunt urmatoarele :

blur() - dezactiveaza caseta de validare


click() - apeleaza un eveniment click pentru caseta de validare respectiva.
focus() - eveniment de activare a caseta de validare
handle Event() - transfera un eveniment handlerului de eveniment
corespunzator

3. Obiectul FileUpload
Acest obiect este echivalentul elementului folosit pentru incarcarea fisierelor.
Cu Java Script nu se poate face prea multe cu acest obiect decat facand referire la
proprietatile sale.
Proprietati ale obiectului "FileUpload" sunt urmatoarele :

form - face referire la obiectul Form ce contine caseta FileUpload


name - contine sirul specificat in atributul name al casetei FileUpload
type - contine sirul specificat in atributul type al casetei FileUpload
value - contine sirul care specifica numele caii fisierului pt. upload

Metode ale obiectului "FileUpload" sunt urmatoarele :

blur() - dezactiveaza caseta FileUpload


focus() - activeaza caseta FileUpload
handle Event() - transfera un eveniment handlerului de eveniment
corespunzator
select() - selecteaza suprafata de adaugare a datelor pentru caseta FileUpload.

4. Obiectul Hidden
Acest obiect se foloseste pentru stocarea anumitor date care vor fi transferate unei
prelucrari pe server. Datele stocate in obiectul "hidden" sunt ascunse, nu apar vzibile in
browser.
Proprietati ale obiectului "Hidden" sunt urmatoarele :

form - face referire la formularul ce contine obiectul Hidden


name - contine numele obiectului Hidden
type - contine sirul specificat in atributul type al casetei Hidden
value - contine sirul specificat in atributul "value" al obiectului Hidden

5. Obiectul Password
Obiectul password este asemanator cu obiectul "text", diferenta fiind ca toate
caracterele introduse in cazeta "Password" sunt afisate cu "*" pentru a nu se vedea textul
introdus.
Proprietati ale obiectului "Password" sunt urmatoarele :

defaultValue - face referire la atributul "value" al casetei pt. parola din


formularul HTML
form - face referire la obiectul Form ce contine caseta pt. parola
name - contine sirul specificat in atributul name al pt. parola
type - contine sirul specificat in atributul type al casetei pt. parola
value - face referire la continutul curent din caseta pt. parola

Metode ale obiectului "Password" sunt urmatoarele :

blur() - dezactiveaza caseta pt. parola


focus() - activeaza caseta pt. parola
handle Event() - transfera un eveniment handlerului de eveniment
corespunzator
select() - selecteaza textul adaugat in caseta pt. parola.

6. Obiectul Radio
Butoanele radio sunt controale dintr-un formular HTML care se anuleaza reciproc, astfel
daca este selectat un buton radio, toate celelalte butoane din set sunt neselectate. Setul
de butoane se defineste avand aceasi proprietate "name" pentru toate butoanele radio.
Proprietati ale obiectului "Radio" sunt urmatoarele :

checked - retrneaza o valoare care determina daca este bifat obiectul radio
defaultChecked - returneaza o valoare care pastreaza starea initiala a obiectului
Radio, care se stabileste cu atributul "checked" al etichetei <input> respective
form - returneaza obiectul Form ce contine obiectul Radio
name - contine sirul specificat in atributul name al etichetei <input>

type - contine sirul specificat in atributul type al etichetei <input>


value - face referire la atributul value al etichetei <input>

Metode ale obiectului "Radio" sunt urmatoarele :

blur() - dezactiveaza obiectul Radio


click() - apeleaza un eveniment "click" pt. obiectul Radio focus() - activeaza un
buton radio
handle Event() - transfera un eveniment handlerului de eveniment
corespunzator

Obiecte Reset, Submit, Select, Text, Textarea si Option

In aceasta lectie se continua prezentarea celorlalte obiecte de nivel 3 si obiectul de


nivel 4, "Option", ale elementelor de formular.
1. Obiectul Reset
Acest obiect este asociat butonului "reset" dintr-un formular HTML, cand butonul este
actionat sterge toate datele noi introduse in formular, stabilind campurile la valoarea lor
initiala.
Proprietati ale obiectului "Reset" sunt urmatoarele :

form - returneaza obiectul Form ce contine butonul


name - contine sirul specificat in atributul name al etichetei <input>
corespunzatoare butonului
type - contine sirul specificat in atributul type al etichetei <input>
value - returneaza sirul adaugat in atributul value din eticheta <input> a
butonului

Metode ale obiectului "Reset" sunt urmatoarele :

blur() - dezactiveaza butonul


click() - apeleaza un eveniment "click" pt. butonul respectiv
focus() - activeaza butonul

2. Obiectul Submit
Acest obiect este asociat butonului "submit" dintr-un formular HTML, cand butonul este
actionat trimite datele din formular spre calea specificata in atributul "action" din eticheta
<form>, pentru a fi procesate (de exemplu, la un script PHP).
Proprietati ale obiectului "Submit" sunt urmatoarele :

form - returneaza datele din intreg formularul ce contine butonul "submit"


name - returneaza sirul specificat in atributul name al etichetei <input>
corespunzatoare butonului
type - returneaza sirul specificat in atributul type din eticheta <input> a
butonului "submit"

value - returneaza sirul adaugat in atributul value din eticheta <input> a


butonului

Metode ale obiectului "Submit" sunt urmatoarele :

blur() - dezactiveaza butonul


click() - apeleaza un eveniment "click" pt. butonul respectiv
focus() - activeaza butonul
handle Event() - apeleaza handlerul pt. evenimentul specificat

3. Obiectul Select
Acest obiect face referire la caseta cu lista de selectare si lista derulanta dintr-un
formular HTML, ambele permit utilizatorului selectarea unor valori dintr-o lista predefinita.
Dintr-o lista derulanta se poate selecta numai o singura valoare iar dintr-o caseta cu lista
de selectare se pot selecta mai multe valori.
. Obiectul select poate apare ca lista derulanta (in mod initial) sau ca lista de selectare
daca se specifica proprietatea "multiple" ca adevarata (true).
Proprietati ale obiectului "Select" sunt urmatoarele :

form - returneaza obiectul Form ce contine lista de selectare


length - returneaza numarul de optiuni din lista de selectare
name - returneaza sirul specificat in atributul name al etichetei HTML
corespunzatoare
type - returneaza sirul specificat in atributul type al etichetei HTML (pentru
instantele select ce contin atributul "multiple" returneaza "select-multiple", iar
pentru cele fara acest atribut returneaza "select-one")
options - returneaza un tablou ce contine toate elementele din caseta de
selectare. Elementele sunt definite cu eticheta HTML <options>. aceasta
proprietate are doua subproprietati: "length" si "selectedIndex"
selectedIndex - returneaza un numar care specifica indicele optiunii selectate
din caseta de selectare

Metode ale obiectului "Select" sunt urmatoarele :

blur() - dezactiveaza caseta de selectare


click() - apeleaza un eveniment "click" pt. caseta de selectare
handleEvent() - transfera un eveniment handlerului de eveniment corespunzator

4. Obiectul Text
Acest obiect este reprezentarea casetei de tip "text" dintr-un formular HTML.
Obiectul text serveste ca unealta de capturare a datelor dintr-o caseta de tip "text".
Proprietati ale obiectului "Text" sunt urmatoarele :

defaultValue - returneaza valoarea casetei de text, specificate de atributul


value. form - returneaza obiectul Form ce contine caseta de text
name - returneaza sirul specificat in atributul name al etichetei HTML
corespunzatoare
type - returneaza sirul specificat in atributul type al etichetei HTML
value - returneaza valoarea afisata in caseta de text

Metode ale obiectului "Text" sunt urmatoarele :

blur() - dezactiveaza caseta de text


focus() - activeaza caseta de tip text
handleEvent() - transfera un eveniment handlerului de eveniment
corespunzator
select() - selecteaza textul din caseta de text

5. Obiectul Textarea
Asemanator cu obiectul "Text", obiectul Textarea este reprezentarea casetei de tip
"textarea" dintr-un formular HTML. Aceasta caseta permite adaugarea mai multor linii de
text in acelasi camp (caseta).
Proprietati ale obiectului "Textarea" sunt urmatoarele :

defaultValue - returneaza valoarea zonei de text, specificate intre etichetele


<textarea>
form - returneaza obiectul Form ce contine caseta textarea
name - returneaza sirul specificat in atributul name al etichetei HTML
corespunzatoare
type - returneaza sirul specificat in atributul type al etichetei HTML
value - returneaza valoarea afisata in caseta textarea

Metode ale obiectului "Textarea" sunt urmatoarele :

blur() - dezactiveaza zona de text


focus() - activeaza zona de text
handleEvent() - transfera un eveniment handlerului de eveniment
corespunzator
select() - selecteaza textul din campul de text

6. Obiectul Option (nivel 4)


Acest obiect este singurul obiect de nivel 4, acesta face referire la elementele <option>
definite intre etichetele <select>.
Obiectul option este un subobiect a obiectului "Select".
Proprietatile obiectului "Option" sunt urmatoarele :

defaultSelected - face referire la optiunea care este selectata in mod prestabilit


in caseta de selectare
index - face referire la locatia indexata a unui element in tabloul "Select.options"
(incepe cu 0)
selected - face referire la valoarea selectata a casetei de selectare
text - face referire la textul pentru optiune
value - face referire la vloarea care este returnata cand este selectate optiunea

Evenimente JavaScript

Evenimentele sunt elemente foarte importante in programarea JavaScript. Acestea sunt


actiuni provocate de cele mai multe ori de vizitatorul paginii.
Daca vizitatorul apasa un buton din pagina se provoaca evenimentul "Click". Daca mouseul este deasupra unui link, se declanseaza un eveniment "MouseOver".
JavaScript poate reactiona la unele evenimente. Aceasta se poate realiza cu ajutorul
"event-handlers" (manageri de evenimente sau gestionar de evenimente).
Handlerele de evenimente se adauga ca atribute ale etichetelor HTML.
De exemplu, daca dorim sa apelam o functie "nume_functie()" de fiecare data cand s-a
modificat un anumit obiect Text, procedam astfel: atribuim functia "nume_functie()"
handlerului de eveniment "onChange" al obiectului Text respectiv, ca in exemplul de mai
jos:

<input type="text" size="25" name="nume"


onChange="nume_functie(this)">

- "onChange" este atribut al etichetei <input>, a carui valoare, intre ghilimele, este functia
"nume_functie()". In locul functiei dintre ghilimele putem sa scriem direct tot codul din
functie, separand prin caracterul ; comenzile JavaScript (acest lucru este nerecomandat in
cazul unui cod mare).
1. Evenimentele JavaScript
In continuare este prezentata o lista cu evenimentele care pot fi folosite in programarea
JavaScript:

onClick - Se executa la apasarea unui click pe un obiect.(document, link, buton,


checkbox, buton radio, buton reset sau submit)
onDblClick - Executa actiunea la efectuarea a doua clickuri unul dupa altul
on MouseOver - Actioneaza cand se pozitioneaza mouse-ul deasupra unui link
sau unei imagini
onMouseOut - Actioneaza cand se muta mouse-ul de pe un hiperlink sau o
imagine
onMouseMove - Actioneaza cand se misca mouse-ul
onMouseDown - Actioneaza cand tinem apasat unul din butoanele mouse-ului,
pe un document, buton sau link
onMouseUp - Actiunea se executa atunci cand este eliberat degetul de pe unul
din butoanele mouse-ului
onFocus - Actiunea apare cand este activat un obiect camp: caseta password,
camp text, bloc de text, camp FileUpload dintr-un formular HTML.
onChange - Actiunea apare cand se modifica continutul unui camp dintr-un
formular HTML (o parola, text, bloc de text, sau FileUpload) si cand acesta pierde
focalizarea
onBlur - Este inversul lui "onFocus()", este declansat atunci cand un obiect nu
mai este activ, prin trecerea la o alta resursa
onLoad - Actioneaza cand browserul a terminat de incarcat un document,
imagine sau toate Frame-urile dintr-un <FRAMESET>
onUnload - Actiunea apare cand se iese din un document si se incarca un altul.

onKeydown - Actiunea apare cand se apasa o tasta


onKeyUp - Actiunea apare dupa ce am terminat de apasat pe o tasta
onKeyPress - Apare la apasarea unei taste (precede "KeyDown")
onSubmit - Actiunea apare la inaintare (trimiterea) unui formular
onReset - Actiunea apare la reinitializarea unui formular
onSelect - Actiunea apare cand utilizatorul selecteaza text dintr-un obiect Text
sau Textarea.
onAbort - Actiunea se executa in momentul in care se renunta la incarcarea unei
imagini, ferestre
onError - Actiunea apare cand actiunea de incarcare a unei imagin sau document
esueaza.
onMove - Actiunea se declanseaza cand se comanda deplasarea ferestrei sau
cadrului
onResize - Actiunea se declanseaza atunci cand se comanda redimensionarea
ferestrei sau cadrului

In continuare sunt prezentate obiectele impreuna cu evenimentele pe care le pot folosi:

Evenimente ale ferestrelor


o

onmousedown
onmouseup
onmousemove
onmouseover
onmouseout
ondblclick
onclick

Evenimente ale formularelor si elementelor acestora:


o

onload
onunloavd - onresize: (in Netscape)
onmove
onabort
onerror
onfocus
onblur

Evenimente de mouse:
o

onsubmit
onreset
onchange
onselect
onclick
onblur
onfocus

Evenimente ale tastelor


o

- onkeydown
- onkeyup
- onkeypress

2. Exemple cu evenimentele JavaScript


Pentru a intelege mai bine modul de folosire a evenimentelor, studiati cu atentie
exemplele de mai jos.

1. - Exemplu "onClick"
Daca dorim executia unei anumite actiuni la apasarea unui click de mouse, folosim
"onClick".
<form>
<input type="button" value="Apasa" onClick="alert('Salut')" />
</form>
Acest exemplu deschide o fereastra alert cand este apasat butonul "Apasa".

2. - Exemplu "OnMouseOver - onMouseOut - onClick"

<html>
<head>
<script type="text/javascript">
function setfocus() {
document.form2.camp.select();
}
</script>
</head>
<body>
<br>
<a href="http://www.marplo.net"
OnMouseOver="this.style.color='red';"
OnMouseOut="alert('Fereastra deschisa cu onMouseOut')">
Apasa aici pentru a vizita MarPlo.net!
</a>
<form name="form2">
<input type="text" name="camp" size="30" value="orice text">
<input type="button" value="Selecteaza" onclick="setfocus()">
</form>
</body>
</html>
Pagina HTML rezultata din acest cod va afisa urmatorul rezultat:
- Cand se pozitioneaza mouse-ul pe legatura "Apasa aici pentru a vizita MarPlo.net!",
culoarea textului devine rosu (datorita expresiei "this.style.color='red'" - "this" face referire
la obiectul curent care e actionat).
Dupa ce mutati mouse-ul de pe link, se va deschide (prin evenimentul "onMouseOut") o
fereastra Alert.
Cand apasati butonul "Selecteaza", va fi selectat textul din campul de text.

Apasa aici pentru a vizita MarPlo.net!


orice text

3. - Exemplu "onKeyUp"

Acest script foloseste evenimentul "onKeyUp" pentru a muta cursorul in alt camp dupa ce a
fost tastat ultimul caracter permis in caseta.
<html>
<head>
<script type="text/javascript">
<!-function urmatorul(elment,text) {
if (text.length==elment.maxLength) {
next=elment.tabIndex;
if (next<document.form3.elements.length) {
document.form3.elements[next].focus();
}
}
}
//-->
</script>
</head>
<body>
- Cursorul se muta automat in urmatoarea caseta atunci cand s-a completat tot campul
precedent (cand se ajunge la lungimea stabilita a campului, aici 4 caractere) <br>
<form name="form3">
<input size="4" tabindex="1" name="field" maxlength="4"
onkeyup="urmatorul(this,this.value)">
<input size="4" tabindex="2" maxlength="4" onkeyup="urmatorul(this,this.value)">
<input size="4" tabindex="4" maxlength="4" onkeyup="urmatorul(this,this.value)">
</form>
</body>
</html>
- Functia "urmatorul(elment,text)", are doua argumente: "element" (care, prin apel, se refera
la caseta "input") si "text" (se refera la valoarea casetei).
In apelul functiei: "urmatorul(this,this.value)", "this" se refera la obiectul curent (reprezinta
primul argument) iar al doile argument "this.value" reprezinta valoarea obiectului curent
(valoarea din camp).
Observati folosirea evenimentului onKeyup, pentru a se trece la urmatorul camp atunci
cand s-a completat ultimul caracter din caseta precedenta.
Pentru a intelege mai bine puteti sa inlocuiti "onkeyup" cu onkeydown pentru a vedea
diferenta.
Pagina HTML rezultata din acest cod va afisa urmatorul rezultat:
- Cursorul se muta automat in urmatoarea caseta atunci cand s-a completat tot campul
precedent (cand se ajunge la lungimea stabilita a campului, aici 4 caractere)

Obiectul image - 1

Folosind JavaScript puteti crea o multime de efecte imaginilor de pe site.


In aceasta lectie si in urmatoarea veti invata sa lucrati cu obiectul image, sa creati efecte
cu ajutorul imaginilor, folosid JavaScript.
1. Imaginile in pagina web
In JavaScript toate imaginile sunt reprezentate intr-o matrice numita images. Aceasta
este o proprietate (si subobiect) a obiectului "document".
Pentru indexarea in matrice (sau tablou), fiecare imagine de pe o pagina web are un
anumit numar (index). Prima imagine are numarul 0, cea de-a doua imagine are numarul 1
si asa mai departe.
Astfel, se poate face referire la prima imagine folosind expresia "document.images[0]".
Fiecare imagine dintr-un document HTML este considarata un obiect Image.
Un obiect Image are mai multe proprietati care pot fi accesate prin JavaScript. De
exemplu puteti vedea dimensiunile unei imagini folosind proprietatile "width" si "height".
Urmatorul exemplu returneaza lungimea (in pixeli) a primei imagini din document:

document.image[0].height

Declararea imaginii care apare in pagina web se face cu sintaxa HTML:

<img src="fisier.gif" name="nume_img" id="id_img" />

Daca sunt mai multe imagini pe o singura pagina, e mai dificil sa se lucreze cu ele folosind
numarul indexului, de aceea se poate atribui fiecarei imagini cate un nume (cu atributul
"name").
O alta metoda este folosirea proprietatii "getElementById("id_element"), unde
"id_element" este id-ul imaginii dat cu atributul "id="..."", ca in exemplu urmator:

document.nume_img.height
o

sau

document.getElementById("id_img").height

Obiectul "image" are o singura metoda:

handleEvent() - reprezinta evenimentul specificat pentru executarea unei


anumite actiunie

Proprietatile obiectului image sunt urmatoarele:

Border - poate fi doar citita si este latimea marginii din jurul imaginii specificata
n pixeli
Alt - specifica textul care va fi afisat in locul imaginii(daca nu poate fi vizualizata
de browser)

Align - unde sa fie plasata imaginea


Complete - poate fi doar citita si este o valoare booleana care permite sa stim
daca imaginea a fost descarcata complet.
Height - inaltimea in pixeli a imaginii
Hspace - se refera la spatiul din dreapta si stanga imaginii (in pixeli)
Lowsrc - specifica un URL al unei imagini ce va fi afisata la o rezolutie scazuta
Name - se foloseste pentru a da nume unei imagini
Src - specifica URL-ul (adresa si numele) imaginii
usemap - eticheta map
Vspace - spatiul dintre partea de sus si de jos a imaginii
Width - latimea in pixeli a imaginii
2. Incarcarea unei imagini noi
Daca doriti sa schimbati imaginile pe pagina prin JavaScript, se foloseste
propprietatea src.
Ca si in eticheta <img>, proprietatea "src" reprezinta adresa imaginii afisate.
Cu JavaScript putem da o noua adresa imaginiii care trebuie incarcate in pagina, astfel
imaginea de la noua adresa va inlocui vechea imagine.
Iata un exemplu prin care puteti intelege cum se face aceasta schimbare de imagini:
<img name="imagine" src="img1.jpg" width="155" height="155">
<form>
<input type="button" onClick="document.imagine.src='img2.jpg'" value="Schimba
imaginea">
</form>
- Imaginea "img1.jpg" este incarcata si ia numele "imagine".
- Cu linia de cod "document.imagine.src='img2.jpg' se inlocuieste fosta imagine "img1.jpg"
cu o noua imagine "img2.jpg", prin apasarea butonului "Schimba imaginea".
- Imaginea noua va fi afisata in acelasi loc, suprafata de afisare a imaginii ramane aceeasi.
In pagina web exemplul acesta va afisa urmatorul rezultat:

Iata inca un exemplu in care avem o pagina HTML cu doua link-uri (legaturi) care, printr-un
script JS schimba afisarea mai multor imagini in acelasi loc. Imaginile sunt declarate si
stocate intr-o variabila tablou "imagini". Pentru schimbarea imaginilor se folosesc 2 functii:
"gonext" si "goback".
<html>
<head>
<title>Titlu</title>
<script type="text/javascript">
<!-imagini = new Array("img1.jpg","img2.jpg","img3.jpg");
nr = 0;
function goback() {

if (document.images && nr > 0) {


nr--;
document.imgs.src=imagini[nr];
}
}
function gonext() {
if (document.images && nr < (imagini.length - 1)) {
nr++;
document.imgs.src=imagini[nr];
}
}
// -->
</script>
</head>
<body>
<h4 align=center>Imagini<br>
<img src="img/img1.jpg" name="imgs" width="155" height="155"><br>
<a href="javascript:goback()"><<- Precedenta</a> |
<a href="javascript:gonext()">Urmatoarea ->></a>
</h4>
</body>
</html>
Dupa ce aplicati acest cod intr-un document HTML veti avea in browser urmatorul rezultat:
Imagini

<< Precedenta | Urmatoarea >>

- Un dezavantaj al scripturilor din aceste doua exemple poate fi faptul ca dupa apasarea
butonului "Schimba imaginea" sau a link-ului "urmatoarea >>", afisearea imagini noi poate
intarzia deoarece aceasta trebuie sa fie incarcata de browser dupa apasarea butonului (sau
a link-ului). In lectia urmatoare veti invata cum sa evitati acest lucru prin "preincarcarea
imaginilor".

Obiectul image - 2

Aceasta lectie continua prezentarea modului de utilizare a obiectului image, cu


exemple ajutatoare si un script complet.
1. Preincarcarea imaginilor
In lectia precedenta a fost explicat modul de incarcare a unei imagini noi in locul altei
imagini folosind JavaScript.
In exemplul prezentat in Lectia 19 la punctul "Incarcarea unei imagini noi", browserul
trebuie sa astepte afisare noi imagini pana cand aceasta este incarcata iar in cazul unor
imagini mari asteptarea poate dura prea mult. Acest lucru poate fi evitat prin
"preincarcarea imaginilor", toate imaginile folosite in pagina vor fi incarcate la deschiderea
acesteia (printr-un script JS) si vor fi afisate doar atunci cand este executata o comanda de
afisare.
Iata un exemplu prin care puteti intelege cum se face aceast lucru:
<script type="text/javascript">
<!-var hiddenImg = new Image();
hiddenImg.src = "img2.jpg";
//-->
</script>
<img name="imagine" src="img1.jpg" width="155" height="155">
<form>
<input type="button" onclick="document.imagine.src=hiddenImg.src" value="Schimba
imaginea">
</form>
- In interiorul scriptului, prima linie creaza un nou obiect "Image".
A doua linie defineste adresa imaginii noi care va fi incarcata si reprezentata prin obiectul
"hiddenImg". Astfel imaginea "img2.jpg" este incarcata (dar nu afisata) cand este executata
aceasta linie de cod (la deschiderea paginii). Imaginea este pastrata in memorie pentru
folosire ulterioara, si anume cand este apasat butonul "Schimba imaginea", care prin codul
"document.imagine.src=hiddenImg.src" va afisa imaginea "img2.jpg" in locul celei actuale
(img1.jpg). Afisarea se face imediat, fara a mai astepta incarcarea acesteia.
Daca numarul si marimea imaginilor este mare va dura mai mult incarcarea initiala a paginii,
de aceea e bine sa aveti in vedere viteza conexiunii pentru a sti ce metoda este mai
indicata.
In pagina web exemplul acesta va afisa urmatorul rezultat:

2. Efecte mouse-over (sau rollover)


Cu mouse-over ("MouseOver" si "MouseOut") se pot crea efecte (precum
schimbarea unei poze) care apar la simpla trecere cu mouse-ul deasupra unei zone.
Iata un exemplu foarte simplu:

<a href="#"
onMouseOver="document.Imgs.src='img1.jpg'"
onMouseOut="document.Imgs.src='img2.jpg'">
<img src="img3.jpg" name="Imgs" width="155" height="155" border="0"></a>
- Dupa cum observati, "onMouseOver" si "onMouseOut" au fost adaugate in interiorul
etichetei <a>, e gresit daca le adaugati in eticheta <img>. Imaginile nu pot reactiona la
evenimentele "MouseOver" si "MouseOut", trebuie sa punem o eticheta de legatura (link)
langa imagini.
Acest exemplu va afisa in browser urmatorul rezultat:

- Initial este afisata imaginea "img3.jpg", cand pozitionati mouse-ul deasupra imaginii va fi
afisata "img1.jpg" iar dupa ce departati mouse-ul, va apare imaginea "img2.jpg".
Daca doriti ca efectul de schimbare a imaginii sa apara cand pozitionati mouse-ul pe un link
si nu pe imagine, puteti modifica exemplul astfel (<img> va fi adaugat in afara etichetei
"<a>...</a>"):
<a href="#"
onMouseOver="document.Imgs.src='img1.jpg'"
onMouseOut="document.Imgs.src='img2.jpg'">Legatura</a><br>
<img src="img3.jpg" name="Imgs" width="155" height="155" border="0">
- Acest exemplu este mai mult de studiu pentru a intelege procedeul de utilizare a efectelor
"mouse-over". Nu este potrivit pentru adaugarea intr-o pagina web profesionala deoarece
cauzeaza unele probleme:

Imaginile "img1.jpg" si "img2.jpg" nu au fost preincarcate si astfel apar intarzieri


in afisarea lor.

Daca vom folosi mai multe seturi de imagini trebuie scris codul JavaScripty pentru
fiecare separat.

Pentru folosirea modelului si in alte pagini, poate necesita modificari substantiale.

Iata un script complet care evita problemele de mai sus, desi este mai lung, o data scris
poate fi folosit cu usurinta si pt. alte pagini web si cu un numar mai mare de imagini.
<html>
<head>
<script type="text/javascript">
<!-// Daca browserul suporta JavaScript
// Creaza matricea care va stoca imaginile, in variabila pics
browserOK = true;

var pics = new Array();


// -->
</script>
<script type="text/javascript">
<!-var objCount = 0;
// numarul imaginilor care se modifica in pagina web
// Functia pentru preancarcarea imaginilor, le introduce intr-o matrice
function preload(name, first, second) {
if (browserOK) {
pics[objCount] = new Array(3);
pics[objCount][0] = new Image();
pics[objCount][0].src = first;
pics[objCount][1] = new Image();
pics[objCount][1].src = second;
pics[objCount][2] = name;
objCount++;
}
}
function on(name) {
if (browserOK) {
for (i = 0; i < objCount; i++) {
if (document.images[pics[i][2]] != null)
if (name != pics[i][2]) {
document.images[pics[i][2]].src = pics[i][0].src;
} else {
// afiseaza cea de-a doua imagine la pozitionarea cursorului deasupra acesteia
document.images[pics[i][2]].src = pics[i][1].src;
}
}
}
}
function off() {
if (browserOK) {
for (i = 0; i < objCount; i++) {
// trimite in spate toate imaginile
if (document.images[pics[i][2]] != null)
document.images[pics[i][2]].src = pics[i][0].src;
}
}
}
// preancarca imaginile - trebuie sa specificati care imagini trebuie preancarcate
// si carui obiect Image apartin. Schimbati aceasta parte daca folositi imagini diferite sau
daca adaugati mai multe
// (s-ar putea sa fie nevoie sa schimbati si in corpul documentului (body).
preload("link1", "img1.jpg", "img1t.jpg");
preload("link2", "img2.jpg", "img2t.jpg");
preload("link3", "img3.jpg", "img3t.jpg");
// -->
</script>
</head>
<body>

<a href="adresa1.htmll" onMouseOver="on('link1')" onMouseOut="off()">


<img name="link1" src="link1.gif" width="100" height="100" border="0"></a> &nbsp;
<a href="adresa2.html" onMouseOver="on('link2')" onMouseOut="off()">
<img name="link2" src="link2.gif" width="100" height="100" border="0"></a> &nbsp;
<a href="adresa2.html" onMouseOver="on('link3')" onMouseOut="off()">
<img name="link3" src="link3.gif" width="100" height="100" border="0"></a>
</body>
</html>
Acest exemplu foloseste 3 imagini (respectiv 3 link-uri in BODY), dar puteti adauga si 100.
Scriptul pune toate imaginile intr-o matrice "pics" a carei elemente sunt construite de functia
"preload()", care este apelata la inceput.
Apelul functiei "preload()" se face in felul urmator: "preload("link1", "img1.jpg",
"img1t.jpg");", ceea ce inseamna ca scriptul trebuie sa incarce doua imagini "img1.jpg" si
"img1t.jpg" pentru "link1". Prima imagine este imaginea care va fi afisata cand cursorul
mouse-ului este n exteriorul imaginii. Iar atunci cand cursorul este pozitionat deasupra
imaginii, va fi afisata cea de-a doua imagine. Cu primul argument "name" ("link1") al functiei
"preload()" specificam carui obiect Image de pe pagina web apartin imaginile. In corpul
( <body> ) al exemplului veti gasi o imagine cu numele "link1".
Cele doua functii "on()" si "off()" sunt apelate prin evenimentele "onMouseOver" si
"onMouseOut". Puteti observa ca functia "on()" trimite in spate toate celelalte imagini afisate
initial (care sunt adaugate direct in eticheta <img>). Aceasta este necesar deoarece se
poate intampla ca mai multe imagini sa fie afisate accentuat (de exemplu, evenimentul
"MouseOut" nu are loc atunci cand utilizatorul muta cursorul de deasupra imaginii direct n
afara ferestrei).
Incercati sa testati si sa studiati acest script, astfel veti intelegeti modul lui de functionare.

Obiectul Form - 1

Formularele sunt elemente HTML care dau viata unor pagini statice deoarece asigura o
interfata prin care vizitatorii pot interactiona, cu ajutorul controalelor (elemente ale
formularului).
Obiectul Form este mijlocul prin care se poate interactiona cu acest element HTML in
scripturile JavaScript.
1. Metode si proprietati ale obiectului form
Dupa cum ati invatat in lectiile precedente, obiectele JavaScript au proprietati si
metode.
Proprietatile obiectului "Form" sunt urmatoarele:

action - contine atributul "action" din eticheta <form>, specifica adresa URL
unde este trimis formularul
elements - matricea care contine toate elementele din <form>
encoding - contine atributul "enctype" din <form>, specifica o codificare MIME a
formularului
length - numarul de elemente continute in formular
method - contine atributul "method" din <form>, defineste felul in care
formularul este trimis serverului (get sau post)
name - contine atributul "name" al unei etichetei <form>

target - contine atributul "target" al etichetei <form>, specifica fereastra in care


serverul ar trebui sa returneze informatiile. Daca nu este specificata, serverul
afiseaza rezultatele in fereastra care a expediat formularul.

Obiectul "Form" are urmatoarele metode:

handleEvent() - apeleaza handlerul de eveniment specificat


reset() - readuce elementele formularului la valorile prestabilite
submit() - declanseaza un eveniment "submit" care trimite datele spre programul
specificat in atributul "action" al etichetei <form>

2. Trimiterea formularelor spre server


Limbajul JavaScript permite prelucrarea datelor introduse in formular inainte ca acestea
sa fie trimise spre procesare la programul (scriptul) de pe server.
Puteti expedia dadele unui formular utilizand una din cele doua modalitati:

1. - Prin apelarea metodei "submit()" a obiectului "Form".

2. - Prin click pe un buton Submit care trimite automat datele din formularul de
care apartine.

Multe din proprietatile obiectului "Form" se ocupa de informatiile suplimentare care sunt
trimise la server prin intermediul formularului. Aceste proprietati sunt:
- action - specifica adresa URL a programului catre care vor fi trimise datele din formular
Exemplu:

<form name="f1" action="http://www.marplo.net/script.php"


method="post">

Pentru formularele care folosesc metoda "post" puteti preciza in atributul "action" ca datele
sa fie trimise prin e-mail, folosind urmatoarea sintaxa:

<form name="f2" action="mailto:adresa_de_email" method="post">

- Cand expediati formularul, se va deschide un client de e-mail ce contine, printre altele, si


perechile de "nume-valoare" ale elementelor (casetelor) cuprinse in formular.
- enctype - specifica o codificare MIME a formularului, valoarea prestabilita este
"application/x-www-form-urlencode".
O metoda de verificare a acestei codificari este urmatoarea:
if(f1.enctype == "application/x-www-form-urlencode") {
alert("Tipul de codificare e normal");
}
Un alt tip de codificare des folosit este "text/plain".
Iata un exemplu:
<form method="post" name="f3" action="mailto:adresa_de_mail" enctype="text/plain">
Va place site-ul? <br>
<input name="alege" type="radio" value="1" checked>Da <br>
<input name="alege" type="radio" value="2">Nu <br>
<input name="alege" type="submit" value="Trimite">
</form>

- Proprietatea "enctype="text/plain"" este folosita pentru a trimite text neformatat. Prin


aceasta, mailul va fi mai usor de citit, in cadrul mesajului va apare optiunea aleasa. Fara
specificarea acestei proprietati mailul va avea ca atasament un fisier cu optiunea aleasa.
- method - defineste modul in care datele formularului sunt expediate. Se poate folosi
valoarea "get" sau "post".
Pentru formularele care folosesc metoda "get", in majoriatea site-urilor este disponibil un
program CGI de testare, numit "test-cgi" furnizat impreuna cu serverul (locatia fisierului
"test-cgi" poate fi diferita, intrebati administratorul serverului). Folositi urmatoarea sintaxa:

<form action="http://nume_site/cgi-bin/test-cgi" method="get">

Veti primi o pagina care va contine, printre altele, si valorile elementelor din formular.
Pentru incepatori, mai putin cunoscatori, si pentru folosirea cu scripturi PHP, este
recomandata metoda "post".
Pentru formularele care folosesc metoda "post", in majoriatea site-urilor este disponibil un
program CGI de testare, numit "post-query" furnizat impreuna cu serverul (locatia acestuia
poate fi diferita, intrebati administratorul serverului). Daca doriti sa verificati ce date trimite
formularul, folositi urmatoarea eticheta:

<form action="http://nume_site/cgi-bin/post-query" method="post">

- Cand trimiteti formularul veti primi, printre altele, si perechile de "nume-valoare"


corespunzatoare elementelor din formular.
Puteti verifica tipul metodei de trimitere a datelor si cu un script JavaScript, ca in exemplul
urmator:
<script type="text/javascript">
<!-var tip_metoda;
tip_metoda = formular.method;
alert("Tipul metodei pt. acest formular e :" +tip_metoda);
//-->
</script>

Daca doriti sa faceti o verificare a datelor din formular inainte ca acestea sa fi expediate la
server, puteti folosi evenimentul "onSubmit". - onSubmit - este folosita pentru a valida
formularul inainte de a fi trimis.
Metoda "onSubmit" se introduce in interiorul etichetei <form>, ca in exemplul urmator:
<script type="text/javascript">
<!-// Verifica daca input OK
function validare() {
if (inputOK) return true;
else return false;
}
//-->
</script>
...
<form method="post" name="nume_form" action="script.php" onSubmit="return
validare()">
...
- Despre validarea datelor dintr-un formular veti putea invata mai multe in lectia urmatoare.

Scrierea scripturilor PHP elementare


Invatati sa creati un script PHP cu cele mai simple instructiuni PHP
Invatati sa documentati si sa executati un script PHP
Un script PHP poate fi foarte simplu sau foarte complex. Totusi, scrierea chiar si a unui
script PHP complex este relativ simpla, necesitand doar un editor de texte obisnuit. In
aceasta lectie veti invata modul de creare si de executare a programelor PHP, veti invata
sa creati scripturi PHP simple, care afiseaza in navigatorul web un text simplu. De
asemenea, veti invata sa va documentati scripturile, astfel incat dumneavoastra si alte
persoane sa puteti intelege rapid scopul si structura acestora.
Mai intai trebuie sa instalati un server web (Apache) si modulul pt. limbajul PHP, acestea
sunt gratuite, le puteti gasi pe net si instala pe fiecare, dar pentru incepatori e recomandat
un program care le are deja configurate (si cu MySQL), precum WampServer, sau sa
incarcati scriptul pe un server web unde este instalat PHP.
Daca nu aveti deja instalat PHP, descarcati de aici -> WampServer, dezarhivati si instalati
programul. (cand este pornit, veti observa o iconita specifica in colltul cu ceasul).
Fisierele .php in care veti scrie scripturile trebuie sa le salvati in directorul www din
"wamp", apoi, ca sa le testati scrieti in browser adresa http://localhost/fisier.php
1. Scrierea scripturilor PHP
Pentru a crea scripturi PHP, majoritatea programatorilor PHP folosesc un editor de texte
obisnuit. Puteti folosi orice editor de texte doriti. Sub Microsoft Windows puteti utiliza
programul Windows Notepad. Daca preferati, puteti folosi editoare specializate, gen
Notepad++. Totusi, trebuie sa tineti cont sa fie un editor de text ce salveaza fisierele cu
format text obisnuit simplu.
Daca folositi UNIX sau Linux, puteti crea scripturi PHP folosind un program precum "vi",
"emacs" sau "pico".
Programul in sine nu conteaza, atata vreme cat poate crea fisiere text ASCII.
Nota : - Unele editoare de texte, precum "Notepad++" sau "vi", asigura un suport
special pentru scrierea programelor PHP. De exemplu, au o caracteristica de colorare a
elementelor de sintaxa ce determina scrierea diferitelor elemente ale codului PHP in culori
diferite. Procedeul de colorare a elementelor de sintaxa faciliteaza depistarea erorilor din
programele proprii.
2. Scrierea scheletului programelor PHP
Fiecare program PHP include doua linii speciale, care indica serverului PHP ca textul
cuprins intre cele doua linii este alcatuit din instructiuni PHP. Practic, aceste linii pot fi
asimilate copertelor unei carti, care pastreaza unitatea programului dumneavoastra PHP.
Intre aceste doua linii vor fi scrise instructiunile PHP. Pentru a incepe sa scrieti un program
PHP, deschideti editorul dumneavoastra de texte si introduceti urmatoarele doua linii :
<?php
?>
- Acesta este un cod de inceput si nu afiseaza nimic.

Apoi, salvati scriptul dumneavoastra sub forma de fisier text, in directorul "www" din
"wamp", cu un nume care respecta urmatoarele reguli:
Este recomandat ca numele fisierului sa fie alcatuit numai din caractere minuscule,
cifre si liniute. Utilizarea de spatii, majuscule si alte caractere ar putea crea
probleme pe sisteme de operare diferite.
Extensia numelui fisierelor trebuie sa fie .php.
Asigurati-va ca ati ales un nume semnificativ, care sa descrie functia scriptului
dumneavoastra, astfel incat sa-l puteti identifica rapid dupa saptamani sau chiar
luni de la crearea acestuia. Veti descoperi ca liniutele sunt utile pentru separarea
cuvintelor care alcatuiesc numele fisierului, marind astfel lizibilitatea acestuia. De
exemplu, un fisier care contine un script PHP ce va permite sa vizualizati salariile
angajatilor poate primi numele "saarii-angajati.php". Chiar si la mult timp dupa
crearea fisierului respectiv, nu veti avea probleme in a determina scopul acestuia.
3. Afi sarea datelor de iesire intr-un browser Web
Programele PHP executa trei categorii de operatii elementare:
Obtin date de la un utilizator.
Executa prelucrari ale datelor, respectiv obtine accesul la datele stocate in fisiere si
baze de date si le manipuleaza.
Afiseaza date astfel incat un utilizator sa le poata vizualiza.
Primele doua operatii sunt oarecum mai dificil de realizat decat cea de-a treia. Totusi,
afisarea datelor astfel incat acestea sa fie vizibile utilizatorului este o operatie foarte
simpla. Asa cum paragrafele unui text scris sunt compuse din propozitii, programele PHP
sunt alcatuite din instructiuni. Regulile care controleaza formarea propozitiilor se numesc
sintaxa. Acelasi termen este folosit si pentru a desemna regulile care guverneaza formarea
instructiunilor PHP.
Iata un exemplu pentru crearea instructiunii PHP care trimite date de iesire la un browser
Web, astfel incat acestea sa fie vizibile pentru un utilizator:
<?php
echo "scrieti aici un text oarecare";
?>
Observati ca instructiunea incepe cu un cavant "echo" si se incheie cu un caracter
punct si virgula (;).
Constructia echo trimite datele de iesire care vor fi afisate de browser.
Ghilimelele duble se folosesc pentru delimitarea unei expresii de tip text, in cazul nostru
"scrieti aici un text oarecare" (se pot folosi si ghilimele simple).
In locul propozitiei "scrieti aici un text oarecare" puteti plasa aproape orice text, cu
exceptia altor ghilimele. Totusi, pentru moment, trebuie sa includeti numai litere, cifre,
spatii si semne de punctuatie folosite in alfabetul latin, precum virgula, caracterul punct si
virgula, punctul, semnul de intrebare si semnul exclamarii. De asemenea, puteti include
caracterele < >, folosite pentru delimitarea etichetelor HTML, respectiv caracterul /, folosit
pentru a indica membrul de inchidere al unei perechi de etichete HTML.
De exemplu, iata o instructiune PHP care are drept date de iesire un fragment dintr-un vers
din Scrisoarea a III-a de Eminescu:

<?php
echo "<h2> Iata vine-un sol de pace</h2>";
?>
- Ca sa vedeti rezultatul, salvati fisierul cu acest cod in directorul www din "wamp", de
exemplu cu denumirea teste.phpsi apelati in browser
adresa http://localhost/teste.php (programul WampServer trebuie sa fie pornit).
Perechea de etichete H2 determina formatarea datelor de iesire ca titlu HTML de nivel 2.
Scripturile PHP pot fi incluse si in fisiere cu cod HTML, ca in urmatorul exemplu (dar salvate
cu extensia ".php"):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Test PHP</title>
</head>
<body>
<?php
echo "<h4> Exemplu de script PHP inclus in HTML</h4>" ;
?>
</body>
</html>
In browser va aparea :
Exemplu de script PHP inclus in HTML
Pot fi incluse si scripturi mai complicate ce contin zeci sau chiar sute de linii, atata timp
cat acestea sunt incluse intre cele doua linii specifice limbajului PHP:
<?php
?>
4. Documentarea unui script PHP
In afara de a furniza nume descriptive fisierelor ce contin scripturile dumneavoastra
PHP, e necesar sa includeti in interiorul fiecarui script atat comentarii care sa permita unui
cititor sa determine cu usurinta utilitatea scriptului, cat si alte informatii referitoare la
script. De exemplu, puteti include un comentariu care precizeaza numele autorului
scriptului si ce face acesta.
Iata un model sintactic pentru comentariile PHP:
// Scrieti aici comentariul dumneavoastra (pe o singura linie)
Dupa cum se poate vedea, un comentariu incepe cu doua caractere slash, urmate de un
spatiu. n continuare, linia contine comentariul dumneavoastra, care poate include orice
caractere doriti, inclusiv caractere speciale.
Iata un exemplu simplu de script PHP care include comentarii:
<?php
// Script de la MarPlo.net
// Acest script afiseaza un mesaj vizibil pentru utilizator.
echo "Acesta este un script foarte simplu.";
?>

Nota: Fiecare linie a comentariului trebuie sa inceapa cu doua caractere slash //.
Totusi, puteti crea un comentariu din mai multe linii si in alte moduri. Iata un exemplu:
/*
Acesta este un comentariu pe mai multe linii.
Poate fi alcatuit dintr-un numar oricat de mare de linii.
*/
Pentru a adauga un comentariu alcatuit din mai multe linii, scrieti la inceput
caracterele /*, iar la sfarsit trebuie sa se incheie cu caracterele */. Intre cele doua perechi
de caractere, puteti scrie orice text doriti, folosind oricate linii doriti.
5. Executarea unui script PHP
Dupa ce ati creat un script PHP, veti dori sa-l executati.
Sa luam un alt exemplu, ce contine cod HTML si comentarii:
Deschideti editorul dumneavoastra de texte si introduceti urmatoarele linii :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Test PHP</title>
</head>
<body>
<?php
// Script test
// Acest script afiseaza un mesaj vizibil pentru utilizator.
echo "Primul meu script PHP.";
?>
</body>
</html>
Salvati fisierul cu numele test-script.php
Daca ati instalat un server de PHP pe calculatorul dumneavoastra, salvati fisierul in
directorul www al serverului.
Deschideti browserul si scrieti adresa URL http://localhost/test-script.php
Daca nu aveti instalat un server de PHP pe calculator, incarcati (prin FTP) fisierul testscript.php pe un server pe web unde este instalat PHP.
Dupa ce v-ati incarcat fisierul cu scriptul, sunteti pregatit pentru a obtine accesul la acesta.
Deschideti browserul Web si apelati adresa URL asociata scriptului dumneavoastra. Adresa
URL trebuie sa fie alcatuita din adresa URL identificata de administratorul serverului unde
ati incarcat scriptul, urmata de un slash (/), urmata de numele fisierului care contine
scriptul dumneavoastra. Daca adresa URL se incheie deja cu un caracter slash, nu trebuie
sa mai inserati inca un asemenea caracter inainte de numele scriptului dumneavoastra.
De exemplu, daca domeniul serverului unde ati incarcat scriptul
e http://www.marplo.net/ ca adresa URL a catalogului care contine scripturile
dumneavoastra PHP, puteti obtine accesul la scriptul dumneavoastra prin intermediul
adresei URL http://www.marplo.net/test-script.php
Daca ati tastat corect adresa URL a scriptului dumneavoastra, iar scriptul respectiv nu
contine erori, veti vedea datele de iesire ale scriptului dumneavoastra. Felicitari! Ati
devenit programator PHP!
In browser va aparea:

Primul meu script PHP.

Tipuri de siruri si variabile


nvatati tipul variabilelor in PHP
nvatati sa folositi ghilimele si caractere escape pentru a specifica valori de tip sir
speciale
Numere si siruri, tipul variabilelor
Programele de calculator manipuleaza datele, care reprezinta informatii. Programele
PHP folosesc doua categorii principale de date: numere si siruri. Numerele sunt compuse
mai ales din cifre, n timp ce un sir poate contine orice caracter, inclusiv cifre, litere si
simboluri speciale.
Decizia privind modul de stocare a datelor este importanta, n mod caracteristic, datele se
stocheaza sub forma de numere atunci cnd se doreste executarea unor operatii
matematice asupra datelor, deoarece numerele sunt stocate ntr-un mod care permite
efectuarea de calcule. Pe de alta parte, sirurile sunt stocate folosind o modalitate care
faciliteaza ntelegerea lor de catre operatorul uman. Datele trebuie stocate sub forma de
siruri daca formatul acestora nu este numeric sau daca doriti ca operatorul uman sa fie
capabil de a introduce sau de a vizualiza datele. Practic, puteti asimila numerele cu un mod
de stocare a datelor n interiorul calculatorului. Sirurile se pot asimila unui mod de stocare
a datelor n afara calculatorului.
Aceste doua mari categorii de date: numere si siruri, formeaza opt tipuri principale de
variabile :
- Boolean
- Integer
- Float
- String
- Array
- Object
- Resource
- Null
In mod normal tipul variabilelor nu este specificat explicit; acesta va fi evaluat de catre
interpretorul PHP la momentul run-time (in momentul executarii scriptului).

1. Tipul boolean
Variabilelele de tipul boolean pot lua doar doua valori : FALSE sau TRUE
Variabilele de alt tip decat boolean pot fi convertite la tipul boolean prin operatorul
cast (bool) sau (boolean), plasate inaintea valorilor, desi in general nu e nevoie de
aceasta converrire, valoarea fiind automat recunoscuta de PHP.

. Tipul integer
PHP foloseste doua categorii de numere: ntregi (tipul integer) si duble, cu virgula (tipul
float)
Variabilele integer reprezinta numerele intregi, ele pot fi specificate in format zecimal,
hexazecimal sau octal.
Numerele ntregi reprezinta numerele fara parte fractionara folosite la numarare, plus zero
si numerele negative. Cu alte cuvinte, n PHP termenul de ntreg are aceeasi semnificatie
ca si n matematica. De exemplu, numarul 100 poate fi reprezentat n PHP sub forma de
ntreg.
Scrierea numerelor PHP este simpla. Un ntreg PHP se obtine prin scrierea cifrelor care i
alcatuiesc valoarea. Daca valoarea este negativa, scrieti un semn minus imediat la stnga
numarului. Evitati sa scrieti spatii sau virgule ca parte a unui ntreg PHP.
Iata cteva exemple de numere PHP ntregi :
215678 - Numar in reprezentare zecimala
0x1A8;
- Numar in reprezentare hexazecimala (reprezinta: 1*16*16 + 10*16 +
8 = 424 (in zecimal))
067
- Reprezinta: 6*8 + 7 = 55 (in zecimal)
Valorile minime, respectiv maxime pe care le poate lua o variabila de tip integer depind de
sistemul de operare pe care ruleaza modulul PHP. De exemplu pentru un sistem Windows
valoarea unui integer se memoreaza pe 32 de biti: 31 bit pentru numar si un bit pentru
semn. In acest caz valorile unui intreg se afla in intervalul :-2 31 repectiv: 231. Daca incercam
sa folosim un integer cu valori care ies din acest inteval vor avea de-a face cu un fenomen
de depasire :integer overflow. In acest caz interpretorul PHP converteste acesta valoare
intr-o valoare de tip float (care are un interval mai extins de valori).
In PHP simpla impartire a doua valori intregi va produce ca rezultat o variabila de tip
float. Pentru a obtine doar partea intreaga acestui rezultat putem folosi operatorul
cast (int) in fata rezultatului.
Ex.: echo (int)8.7; (va returna 8)
Pentru a rotunji rezultatul la intregul cel mai apropiat de valoarea reala se poate folosi
functia round(), unde intre paranteze se adauga valoarea.
Ex.: echo round(8.7); (va returna 9)

3. Tipul float
Reprezinta variabile de tip real [numerele cu virgula], (n lb. engleza se foloseste
punctul zecimal n loc de virgula). De exemplu 2.5

In general, numerele duble (tipul float) sunt stocate folosindu-se formatul standard IEEE64, care furnizeaza 64 de biti. Acest format va permite sa stocati valori care pot merge
pna la 1,8 x 10 la puterea 308 sub forma de numere duble si furnizeaza aproximativ 14
cifre dupa punctul zecimal (sau cifre semnificative) de precizie.
Iata cteva exemple de numere duble (tipul float)
123.4567

- Numar de tip float

1.2e3;

- Reprezinta: 1.2 * 103

4. Tipul string
Reprezinta o insiruire de caractere, fiecare caracter este memorat pe 1 byte; setul de
caractere este limitat la 256 valori distincte. Dimensiunea sirurilor poate fi oricat de mare
in PHP, nu exista specificatii care sa limiteze numarul maxim de caractere dintr-un sir.
Spre deosebire de ntregi si de numere float, care contin cifre, sirurile pot contine orice
caracter. Ca atare, sirurile sunt utile pentru stocarea datelor care nu pot fi calculate,
precum nume, fraze si adrese.
In PHP, un sir poate fi declarat in mai multe feluri:
1) Un mod simplu de a declara un sir este prin delimitarea cu ghilimele simple ('
')
Daca dorim ca sirul sa contina caracterul ' va trebui sa inseram inaintea lui caracterul
escape \. Daca dorim ca sirul sa contina caracterul \ va trebui sa dublam acest caracter.
Acest comportament este exemplificat in exemplul urmator:
<?php
$var1 = 'Acesta este un sir de test';
echo 'Curs \'PHP\'';
echo '<br />Vrei sa stergi C:\\*.* ?';
echo '<br />Variabila var1=$var1';
echo "<br />Variabila var1=$var1";
?>
In browser va aparea:
Curs 'PHP'
Vrei sa stergi C:\*.* ?
Variabila var1=$var1
Variabila var1=Acesta este un sir de test
Observati diferenta dintre ultimile doua linii!
In penultima linie, unde s-a folosit gilimele simple pentru delimitarea sirului, variabila
$var1 nu este expandata adica nu este afisat valoarea variabilei var1=Acesta este un
sir de test ci exact textul scris (numele ei). Pentru a realiza afisarea valorii variabilei si
nu numele acesteia, se folosesc ghilimelele duble, precum in ultima linie a exemplului de
mai sus.

2) O alta metoda pentru a specifica un sir n PHP este prin folosirea


ghiimelelor duble (" ").
Daca intr-un sir delimitat prin ghilimele duble vrem ca acesta sa afiseze numele unei
variabile, nu valoarea acesteia, adaugam un caracter backslash (\) inaintea numelui
variabiei.
Exemplu; echo "Numele variabilei este \$var";
Acest cod va afisa Numele variabilei este $var, oricare ar fi valoarea variabilei "$var".
Caracterele care alcatuiesc sirul sunt incluse ntre ghilimele duble (" ");
De exemplu, sirul reprezentnd numele fizicianului care a formulat teoria relativitatii
este "Albert Einstein". Asa cum s-a explicat, un sir poate contine date numerice; de
exemplu, "3.14159".
Daca se doreste adaugarea de ghilimele duble intr-un sir delimitat de ghilimele duble, se
adauga caracterul \ in fata acestora.
Exemplu; echo "Numele programului este \"PHP\".";
Prin delimitarea cu ghilimele duble PHP faciliteaza includerea n siruri a unor caractere
speciale, precum caracterele de salt la linie noua sau retur de car, prin furnizarea de
secvente escape care reprezinta caractere speciale.
Iata secventele escape folosite n PHP:
\n - salt la linie noua
\r - retur de car (rand nou)
\t - caracter de tabulare pe orizontala
\\ - backslash
\$ - simbolul dolarului
\" - ghilimele duble
Ca exemplu, iata un sir care include un retur de car, urmat de un salt la linie
noua: "Salut, lume!\r\n".
Retineti ca fiecare secventa escape ncepe cu un backslash (\). Pentru a include un
backslash ntr-un sir, trebuie sa folositi doua caractere backslash.
Pe langa imbricarea variabilelor in cadrul sirurilor delimitate prin ghilimele duble, PHP
pune la dispozitie operatorul de concatenare a sirurilor: . (punct) . Acest operator adauga
un sir la sfarsitul altui sir. De exemplu:
<?php
$nume = 'Popescu';
$prenume='Costel';
echo 'Numele de familie este '.$nume. 'iar prenumele este '.$prenume;
?>
In browser va aparea:

Numele de familie este Popescu iar prenumele este Costel


In anumite situatii este necesar sa accesam unul dintre caracterele unui sir. Pentru
aceasta putem folosi parantezele{} ca in exemplul de mai jos:
<?php
$var1 = 'Acesta este un sir de test';
echo $var1{0};
// Afisaza A (primul caracter din sir)
echo $var1{2};
// Afisaza e (al treilea caracter din sir)
?>
Rezultatul afisat va fi
Ae

3) Sintaxa heredoc este o alta modalitate de a delimita siruri


In acest caz delimitatorul este ("<<<"); acesta trebuie urmat de un identificator unic, dupa
care urmeaza sirul de caractere, iar secventa se incheie din nou cu identificatorul
mentionat. Identificatorul de incheiere trebuie sa se afle in prima coloana a liniei, acesta
poate contine caractere alfanumerice dar neaparat trebuie sa inceapa cu o litera, nu cu o
cifra sau alt semn.
Veti intelege mai bine studiind exemplu de mai jos:
<?php
$var1 = <<< EOT
Exemplu de sir care foloseste delimitatorul heredoc.
EOT;
echo $var1;
?>
Rezultatul afisat va fi:
Exemplu de sir care foloseste delimitatorul heredoc.

5. Tipul array
Reprezinta un vector de valori (care creaza o matrice, vezi Lectia 9 despre matrice),
fiecare element al matricei are asociat o cheie. Aceasta cheie va fi folosita ulterior la
identificarea unui element specific at matricei. In PHP tipul array se mai numeste si
tip map ordonat, deoarece elemente vectorului sunt ordonate dupa campul cheie.
Variabilele de tip array si lucrul cu acestea vor fi prezentate mai detaliat in lectiile
urmatoare. Iata un exemplu simplu de variabile array:
<?php
$fructe[0] = 'mere';
$fructe[1] = 'caise';

$fructe[2] = 'piersici';
?>

6. Tipul object
Reprezinta de fapt instanta unei clase declarate in PHP. O clasa este o structura care
contine variabile membru si functii membru.
Variabilele de tip object si lucrul cu acestea vor fi prezentate detaliat in lectiile urmatoare.

7. Tipul resource
Este un tip special de variabila care pastreaza o legatura spre resurse externe. Exemple
de resurse externe: manipulatori pentru deschidere de fisiere, conectare la baze de date,
compresia fisierelor, resurse COM, etc...

8. Tipul NULL
Reprezinta varibilele care nu au inca atribuita o valoare.
O variabila se considera a avea valoarea Null daca:
- este setata explicit prin atribuirea valorii NULL
- nu a fost asignata inca o valoare acestei variabile
- variabila a fost stearsa prin functia unset();
Putem afla tipul unei variabile folosind functia gettype() care returneaza un string (sir)
continand tipul variabilei cercetate.
Observati si studiati exemplul de mai jos
<?php
$var1 = TRUE;
$var2 = 100;
$var3 = 23.88;
$var4 = "Nume";
$var[5] = "fructe";
echo gettype($var1);
echo '<br />'.gettype($var2);
echo '<br />'.gettype($var3);
echo '<br />'.gettype($var4);
echo '<br />'.gettype($var[5]);
echo '<br />'.gettype($var6);
?>
In browser va aparea:

boolean
integer
double
string
string
NULL

Variabile si operatori PHP


Intelegeti diferenta dintre valori si variabile
Invatati modul de utilizare a operatorilor pentru combinarea valorilor n expresii
Invatati modul de utilizare a functiilor pentru executarea operatiilor elementare
1. Valori si variabile
Daca se asociaza o valoare cu un nume, ca si in algebra, este posibila modificarea
acelei valorii prin referire la numele respectiv. O valoare cu nume se numeste variabila,
deoarece.
In limbajul PHP variabilele sunt reprezentate prin semnul $ urmat de numele variabilei.
Numele variabilei este case sensitive, adica conteaza daca numele este scris cu litere
mari sau mici. Intotdeuna numele variabilelor trebuie sa inceapa cu o litera sau o liniuta de
subliniere (_) si poate fi urmat de litere sau cifre.
Iata cateva exemple de nume de variabila:
$var
$Numar
$_elemente
Pentru a asocia o valoare unei variabile, veti scrie cu un semn egal, asa:
$temperatura = 33.5;
Semnul egal este urmat de valoarea care urmeaza a fi atribuita variabilei, in acest
exemplu, valoarea este data de valoarea literala dubla (float) 33.5. Caracterul punct si
virgula (;) marcheaza sfarsitul instructiunii.
De asemenea, puteti atribui valoarea unei variabile catre o alta variabila, prin scrierea unei
instructiuni de atribuire astfel:
$castigator = $nume;
In acest caz, valoarea variabilei $nume devine valoarea variabilei $castigator. Acest
procedeu se numeste. Astfel o modificare facuta asupra lui $nume se va propaga automat
si asupra variabilei $castigator.
Iata exemplul de mai sus asa cum va aparea intr-un script PHP simplu :
<?php
$nume = "Cosmin";
$castigator = $nume;

echo $castigator;
?>
Rezultatul afisat va fi:
Cosmin
Exista si un alt tip de atribuire valoare de la o variabila la alta, denumita atribuire prin
referinta (folosind si caracterul "&"), aceasta de fapt leaga cele doua variabile, vedeti
tutorialul: Atribuire valoare prin referinta .
Forma valorii unei variabile se numeste tipul variabilei. Tipul unei variabile se poate modifica
daca atribuiti variabilei o valoare de un tip diferit fata de cel al valorii curente a variabilei.
De exemplu, instructiunea de atribuire
$x = 3;
Atribue variabilei $x tipul integer.
Daca instructiunea de atribuire
$x = 3.5;
va fi executata ulterior, variabila $x devine de tip float.

Desi instructiunile de atribuire din limbajul PHP si ecuatiile matematice folosesc ambele
semnul egal, cele doua notiuni sunt foarte diferite, deoarece atribuirea nu este acelasi
lucru cu egalitatea. Atribuirea este o operatie care inlocuieste o valoare cu o alta. Pe de
alta parte, egalitatea este o relatie intre doua valori. Cand doua valori sunt egale, acestea
raman egale pentru totdeauna. Totusi, puteti atribui o valoare unei variabile si ulterior
puteti atribui aceleiasi variabile o alta valoare. Cu alte cuvinte, egalitatea este
permanenta; atribuirea nu este.

Variabilele declarate mai sus sunt definite de utilizator. In PHP exista si alte variabile
numite "variabile predefinite" care rezida in nucleul PHP, sunt alocate automat de catre
modulul PHP, si sunt accesibile in program.
In continuare enumeram citeva dintre aceste "Variabile Superglobale" (accesibile din toate
scripturile PHP):
$GLOBALS contine referinte la variabilele globale disponibile in scriptul curent.
$_SERVER variabile definite de server sau relative la contextul in care se executa
scriptul curent
$_GET variabile furnizate scriptului prin adresa URL
$_POST variabile furnizate scriptului prin metoda HTTP POST (in general prin
formulare)
$_COOKIE variabile furnizate scriptului prin HTTP cookie
$_FILES furnizeaza scriptului fisierele uploadate
$_SESSION variabile care sunt inregistrate in sesiunea scriptului

2. Operatori
Pentru a va ajuta sa efectuati calcule si prelucrari ale datelor, PHP include o diversitate
de operatori si functii utile. Cand combinati valorile literale si variabilele cu operatori si
functii, construiti ceea ce este cunoscut sub numele de expresii.
Operatorii sunt simboluri specifice care realizeaza o actiune specifica in cadrul unei
expresii.
Operatorii actioneaza asupra variabilelor prezente in expresie. De exemplu in cadrul
expresiilor matematice vom folosi operatori aritmetici.

$a + $b

Adunare : a+b

$a - $b

Scadere : a-b

$a * $b

Inmultire: a*b

$a / $b

Impartire: a/b

$a%$a

Moule :restul impartirii lui a la b

$a +=$b

Echivalent cu: $a = $a + $b

$a -=$b

Echivalent cu: $a = $a - $b

$a *=$b

Echivalent cu: $a = $a * $b

$a /=$b

Echivalent cu: $a = $a / $b

$a++

Incrementare ; Ecivalent cu $a = $a +1

$a--

Decrementare; Echivalent cu $a = $a -1

O proprietate interesanta a operatorului de impartire este aceea ca returneaza o valoare


intreaga daca ambii sai operanzi sunt intregi si rezultatul este un intreg; in caz contrar,
returneaza o valoare cu virgula (de tip float). Astfel, instructiunea de atribuire
$x = 10/3;
atribuie valorii $x valoarea cu virgula 3.3333333333333, chiar daca operanzii operatorului
de impartire sunt ambii intregi.
Similar operatorului de impartire, operatorul modulo executa o impartire; cu toate
acestea, operatorul modulo returneaza restul, nu catul impartirii. De exemplu, prin
impartirea lui 10 la 3 se obtine catul 3 si restul 1. Deci, instructiunea de atribuire
$x = 10%3;
atribuie variabilei $x valoarea 1.

Operatorii de incrementare $a++ si decrementare $a-- au un efect diferit daca sunt


scrisi ++$a respectiv --$a
In primul caz, daca avem de exemplu
$x= $a++;
i-se atribue lui $x valoarea variabilei $a dupa care se efectueaza operatia de incrementare
($a = $a + 1)
Dar daca avem
$x = ++$a=
se efectueaza operatia de incrementare ($a = $a + 1) dupa care i-se atribue lui $x noua
valoarea a lui $a

Ca in matematica, PHP evalueaza operatorii de inmultire si de impartire anterior


operatorilor de adunare, respectiv scadere. Aceasta caracteristica se numeste
precedenta.
Datorita precedentei, instructiunea
$x=1+2*3;
atribuie variabilei $x valoarea 7, chiar daca operatorul de adunare apare inaintea celui de
inmultire. Se respecta regulile din matematica. Daca doriti sa controlati precedenta unei
expresii, puteti folosi paranteze. De exemplu, instructiunea
$x=(1+2)*3;
atribuie variabilei $x valoarea 9, deoarece partea inclusa intre paranteze a expresiei este
evaluata prima, asa cum se procedeaza in algebra.

In afara de acesti operatori numerici, PHP include un operator de concatenare a


sirurilor (.), denumit uneori operator de unire, deoarece functia sa consta in unirea
sirurilor.
Sa observam urmatorul exemplu:
<?php
$var1 = 'Ionescu';
echo 'Numele candidatului este '.$var1;
$var2 = 'Candidat: ';
$var2 .= $var1;
echo "<br />$var2";
?>
Rezutatul afisat va fi:
Numele candidatului este Ionescu
Candidat: Ionescu
In exemplul de mai sus se observa folosirea operatorului de concatenare . (punct)
Acest operator adauga la sfarsitul sirului curent noul sir furnizat ca parametru.
Expresia $a .= 'Sir de test' este echivalenta cu : $a = $a . 'Sir de test'.

3. Functii
In afara de operatori, PHP include functii care executa operatii utile. Iata unele exemple
de functii:
abs(x) - Returneaza valoarea absoluta a lui 'x'
ceil(x) - Returneaza valoarea 'x', rotunjita la intregul imediat superior
floor(x) - Returneaza valoarea 'x', rotunjita la intregul imediat inferior
max(x,y,...) - Returneaza valoarea maxima a unui set de valori
min(x,y,...) - Returneaza valoarea minima a unui set de valori
pow(x,n) - Returneaza numarul 'x', ridicat la puterea specificata 'n'
strftime(f) - Returneaza data curenta, formatata conform continutului parametrului
'f'
sqrt(x) - Returneaza radacina patrata a lui 'x'
- In afara de acestea, PHP include multe alte functii. Consultati site-ul www.php.net.
Majoritatea functiilor necesita una sau mai multe valori de intrare, cunoscute sub numele de
argumente. De exemplu, functia "sqrt" necesita un argument (aici este 'x') care specifica
valoarea a carei radacina patrata trebuie calculata.
Unele functii, precum min() si max(), preiau un numar nedefinit de argumente. Alte
functii nu necesita nici un fel de argumente. Pentru a putea folosi o functie in mod
corespunzator, trebuie sa cunoasteti:
Numele functiei
Actiunea functiei si valoarea returnata de aceasta, daca exista
Numarul argumentelor preluate de functie
Semnificatia fiecarui argument
Iata un exemplu simplu care foloseste o functie pentru calculul lungimii laturilor unui
patrat, daca este cunoscuta aria patratului:
$latura=sqrt($arie);
Retineti modul in care argumentul functiei este inclus intre paranteze, precum si modul
in care functia si argumentul sau sunt folosite intr-un mod asemanator cu o valoare literala
sau o variabila.
Iata un exemplu care prezinta modul de utilizare a functiei "max", care preia mai multe
argumente:
$punctaj_maxim=max($punctaj1, $punctaj2, $punctaj3);

Rezultatul dat variabilei "$punctaj maxim" va fi determinat de functia "max", aceasta


determinand valoarea cea mai mare a argumentelor din paranteza.
Observati ca fiecare argument este separat de vecinul sau printr-o virgula.

Utilizare formulare HTML cu PHP, $_GET si $_POST


Invatati sa trimiteti date prin formulare HTML
Invatati sa preluati date trimise prin GET si POST
1. Proiectarea unui formular
Principalele sarcini n proiectarea unui formular HTML le constituie alegerea controalelor
HTML care vor fi incluse n formular, selectarea amplasamentului controalelor si alegerea
numelui acestora.
Studiati lectia HTML despre Formulare, aceasta explica modul de realizare a fiecarui obiect
dintr-un formular HTML si va va ajuta sa invatati rolul acestor elemente HTMLL.
2. Crearea unui formular
Un formular HTML trebuie sa contina un buton de expediere, submit, pe care
utilizatorul executa clic pentru a trimite datele din formular la scriptul PHP.
Formularele se creaza folosind etichete specifice incadrate in tag-ul <form> </form> ca
in exemplul de mai jos:
<form action="script.php" method="post">
Nume:<input type="text" name="nume" />
<br /><input type="submit" name="submit" value="Trmite formular" />
</form>
In browser se va vedea:
Nume:

Trmite formular

Fiecare element al formularului trebuie introdus intre etichetele <form> si </form>.


Atributul "action" indica fisierul cu scriptul care va primi datele de la formular si reprezinta
una dintre cele mai importante precizari.
Fiecare element, camp dintr-un formular trebuie sa aibe un nume distinct, dat prin atributul
"name"; acest nume este folosit de scriptul PHP la care sunt trimise datele, astfel, scriptul
PHP recunoaste datele din campul respectiv folosind numele acestuia.
3. Utilizarea metodelor GET si POST
Atributul "method" poate avea doua valori : GET si POST. Diferenta intre metodele GET
si POST consta in modul in care informatia din formular este transmisa scriptului care o

prelucreaza.
- Metoda GET trimite toate informatiile adunate ca parte a adresei URL; aceste informatii
sunt vizibile pentru utilizator.
- Metoda POST transmite informatia intr-o maniera invizibila pentru utilizator si poate
transmite o cantitate mai mare de date decat GET.
Folosind exemplul de formular de mai sus, metoda GET va transmite serverului o adresa
URL ca cea de mai jos:
http://www.marplo.net/script.php?nume=Popescu
iar in cazul folosirii metodei POST, in URL va aparea doar:
http://www.marplo.net/script.php
Metoda GET permite transmiterea unui volum limitat de informatii catre server; de
asemenea nu este recomandata folosirea acestei metode in cazul in care dorim sa
transmitem date personale(de exemplu parolele introduse intr-un formular pot fi vizualizate
de oricine in browserul de Web).
4. Receptionarea datelor de la un formular HTML
In general datele din formular sunt preluate de scriptul PHP prin urmatoarea formula:
$_POST['nume'] - daca este folosit method="post"
$_GET['nume'] - daca este folosit method="get"
- unde "nume este valoarea atributului name al elementului din formularul HTML.
Sa luam un exemplu practic de formular HTML care trimite date (prin method="post") la un
script PHP unde acestea vor putea fi vizualizate.
Salvam scriptul de mai jos intr-un fisier pe care-l numim "test-form.php"
<?php
$nume = $_POST['nume'];
$email = $_POST['email'];
$parola = $_POST['parola'];
echo "Nume = $nume";
echo "<br />E-mail = $email";
echo "<br />Parola = $parola";
?>
Scriem urmatorul cod HTML intr-un alt fisier "form.html", pe care-l salvam in acelasi director
cu scriptul PHP de mai sus.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ro" lang="ro">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title> Test-Form </title>
</head>
<body>

<form action="test-form.php" method="POST">


Nume:<input type="text" name="nume" />
<br />Email:<input type="text" name="email" />
<br />Parola:<input type="password" name="parola" />
<br /><input type="submit" name="submit" value="Trmite datele" />
</form>
</body>
</html>
In browser va aparea:

Nume:

Email:

Parola:

Trmite datele

Completam datele din formular, de exemplu: la Nume : Popescu, la Email : plomar@uv.ro si


Parola : parola_mea
Dupa ce am competat datele, apasam clic pe butonul "Trimite datele", acestea vor fi trimise
la scriptul PHP "test-form.php", care le va prelucra si va afisa urmatorul rezultat:
Nume = Popescu
E-mail = plomar@uv.ro
Parola = parola_mea
Sa intelegem exemplu de mai sus.
Folosind formularul de mai sus, atributul NAME din fiecare eticheta INPUT atribuie fiecarei
casete cu text un nume, astfel scriptul PHP va putea recunoaste datele scrise in casete. In
scriptul "test-form".php" vom accesa variabilele:
$nume va primi informatia introdusa in campul Nume
$email va primi informatia introdusa in campul Email
$parola va primi informatia introdusa in campul Parola
Deoarece cunoastem metoda prin care trimitem datele catre scriptul PHP, "POST", am folosit
variabila PHP globala _POST pentru a prelua datele din formular:
$_POST['nume']
$_POST['email']
$_POST['parola']

Constructia echo trimite datele de iesire care vor fi afisate de browser


Variabile PHP globale: _GET si _POST reprezinta de fapt variabile de tip array, fiecare
element se poate accesa prin cheia sa; in cazul nostru cheia fiecarui element este data de
atributul : NAME al casetelor din formular
5. Trimiterea de date unui script prin adresa URL
In afara de a expedia unui script datele printr-un formular, puteti expedia date cu
ajutorul adresei URL a paginii. Pentru aceasta, atasati la sfarsitul adresei URL un semn al
ntrebarii (?) si apoi includeti o serie de perechi "nume-valoare" (separate prin &), ca in
exemplu urmator:
http://www.marplo.net/fisier.php?nume1=valoare1&nume2=valoare2
Exemplul include numai doua perechi "nume-valoare"; cu toate acestea, puteti include
oricte asemenea perechi doriti (separate prin caracterul &), in functie de limita impusa de
browser.
Pentru a prelua si folosi datele dintr-o astfel de adresa URL, folositi in interiorul scriptului PHP
expresia "$_GET['nume'], ca in exemplu urmator"
$var1 = $_GET['nume1']
$var2 = $_GET['nume2']
Unde "nume1" si "nume2" sunt numele variabilelor din adresa URL, iar "$var1" si "$var2"
sunt variabilele care vor fi folosite in scriptul PHP (din "fisier.php") si a caror valori vor fi
"valoare1" respectiv "valoare2" continute in adresa URL.

Daca doriti sa trimiteti unui script, prin intermediul adresei sale URL, caractere speciale
precum un semn al intrebarii, un semn egal sau un ampersand, se poate crea confuzie.
Pentru a functiona corect, un sir trebuie sa fie codificat URL. Pentru a codifica URL un sir,
caracterele speciale se nlocuiesc cu echivalentele lor hexazecimale, precedate de un
simbol procent (%). Pentru alte detalii, consultati lectia despre Utilizarea caracterelor speciale,
subtitlul 4 ( Conversia adreselor URL).
De exemplu, forma codificata URL a sirului "la multi ani!" este %22la multi ani%21%22.
Adresa URL rezultanta se numeste "sir de interogare" si nu poate contine spatii. Daca doriti
sa trimiteti un spatiu ca parte a unui sir de interogare, trimiteti n locul spatiului un semn
plus (+). Iata un exemplu de sir de interogare care codifica numele autorului acestui site:
http://www.marplo.net/script.php?autor=Mar+Plo
Unele dintre cele mai comune caractere speciale si echivalentele lor codificate URL sunt
prezentate n tabelul de mai jos:
Caracter special

Echivalentul codificat URL

*%2e

>

%3e

%5e

%7e

%2b

%2c

%2f

%3a

%3b
%3c

%3d

>

%3e

%5b

%5c

%5d

%5f

%7b

%7c

%7dc

tab

%09

spatiu

%20

%21

%22

%23

%24

%25

&

%26

%27

%28

%29

%40

%60

Variabile de mediu si erori


In aceasta lectie invatati sa obtineti accesul la valorile variabilelor de mediu.
Invatati despre depanarea si tratarea erorilor.
1. Obtinerea si utilizarea datelor de la o variabila de mediu
Variabilele de mediu sunt folosite pentru stocarea optiunilor si a parametrilor care
personalizeaza mediul de aplicatie. Aplicatiile pot obtine accesul la valorile variabilelor de
mediu si in functie de acestea si pot ajusta comportamentul.
De exemplu, calea de cautare a programelor MS-DOS este stocata ntr-o variabila de mediu
denumita PATH. In general, comenzile sistemelor de operare sunt folosite pentru a
configura variabilele de mediu si pentru a stabili valorile acestora. Cu toate acestea, unele
aplicatii manipuleaza valorile variabilelor de mediu.
Att serverul Web Apache, ct si serverul de aplicatie PHP folosesc variabile de mediu
pentru a prezenta informatii de stare. Unele dintre cele mai importante variabile de mediu
folosite de Apache si PHP sunt rezumate n tabelul de mai jos. Numeroase servere Web,
altele dect Apache, furnizeaza o parte din aceste variabile de mediu sau chiar pe toate.
Multe dintre aceste variabile reflecta caracteristicile cererii HTTP care a solicitat executia
PHP. Puteti vizualiza toate variabilele de mediu disponibile pentru programele PHP prin
invocarea functiei phpinfo() si vizualizarea datelor de iesire generate de aceasta.
Vizualizarea datelor unei variabile de mediu se poate face folosind variabila $_SERVER si o
cheie (intre paranteze patrate) ce repreinta numele variabilei de mediu.
De exemplu, pt. afisarea domeniului serverului unde ruleaza scriptul
echo $_SERVER['SERVER_NAME'];

Variabila de mediu

Descriere

CONTENT_LENGTH

- Lungimea, n octeti, a corpului cererii.

CONTENT_TYPE

- Tipul MIME al datelor din corpul cererii.

DOCUMENT_ROOT

- Calea care constituie radacina arborelui catalogului cu


documente al serverului Web.

GATEWAY_INTERFA - Returneaza ersiunea protocolului CGI (Common Gateway


CE
Interface) folosit de serverul Web.
HTTP_ACCEPT

- Continutul antetului HTTP Accept.

HTTP_ACCEPT_CHA - Continutul antetului HTTP Accept-Charset:, care specifica seturile


RSET
de caractere ntelese de client.
HTTP_ACCEPT_ENC - Continutul antetului HTTP Accept-Encoding:, care specifica
ODING
tipurile de continuturi ntelese de client.

HTTP_ACCEPT_LAN - Continutul antetului HTTP Accept-Language:, care specifica


GUAGE
limbajele preferate de client.
HTTP_CONNECTION

- Continutul antetului HTTP Connection:, care indica optiunile


solicitate de client.

HTTP_HOST

- Continutul antetului HTTP Host:, care indica numele de gazda,


folosit de client la prezentarea cererii.

HTTP_REFERER

- Adresa URL a paginii Web care a trimis clientul la pagina curenta.

HTTP_USER_AGENT

- Continutul antetului HTTP user-Agent, care indica tipul si


versiunea browser-ului folosit.

PATH

- Calea de executie asociata cu mediul serverului.

QUERY_STRING

- Sirul de interogare, daca exista, prin care a fost accesata pagina.

REMOTE_ADDR

- Adresa IP a clientului (vizitatorului).

REMOTE_HOST

- Numele de gazda al clientului.

REMOTE_PORT

- Adresa portului clientului de unde a pornit cererea.

REQUEST_METHOD

- Metoda de cerere HTTP folosita; de exemplu, GET, POST, PUT sau


HEAD.

REQUEST_URI

- URI folosit pentru accesul la pagina curenta. URI este alcatuit


dintr-un URL si un sir optional de interogare.

SCRIPT_FILENAME

- Numele de cale absolut al scriptului curent.

SCRIPT_NAME

- Adresa URL a scriptului curent.

SERVER_ADMIN

- Adresa de e-mail a administratorului serverului Web.

SERVER_HOST

- Numele de gazda asociat serverului Web care prelucreaza


cererea.

SERVER_PORT

- Portul folosit de serverul Web pentru comunicatii.

SERVER_PROTOCOL

- Numele si versiunea protocolului prin intermediul caruia s-a


executat cererea.

SERVER_SIGNATUR - Sirul care identifica versiunea serverului Web si numele de gazda


E
folosit pentru prelucrarea cererii.
SERVER_SOFTWARE - Sirul care identifica programul server Web si versiunea acestuia.

- O lista completa a acestor variabile de mediu o gasiti la pagina oficiala $_SERVER

Puteti obtine accesul la variabila de mediu folosind variabila $_SERVER care este de
fapt un Array in care cheile elementelor sunt numele variabilelor de mediu

De exemplu, urmatoarea instructiune echo trimite browserului adresa IP a clientului


(vizitatorului):
<?php
$ip = $_SERVER['REMOTE_ADDR'];
echo "Adresa dv. IP este $ip";
?>
Afisarea sau nu a acestor variabile globale depinde de permisiunile facute la
configurarea serverului PHP si de datele transmise.
2. Depanarea unui script
Uneori, n locul datelor de iesire ale scriptului dumneavoastra, puteti vedea unul din
urmatoarele:
Textul scriptului, n loc de datele de iesire ale acestuia
O caseta de dialog, prin care sunteti ntrebat daca doriti sa descarcati fisierul care
contine scriptul
Un mesaj n care se spune ca scriptul nu exista
Un mesaj n care se spune ca browserul dumneavoastra Web nu are permisiunea de a
obtine accesul la script
Un mesaj n care se spune ca scriptul dumneavoastra contine o eroare
La vizualizarea rezultatelor unui script PHP se pot produce numeroase erori, chiar daca
scriptul n sine este corect.
- Daca vedeti textul scriptului dumneavoastra sau o caseta de dialog prin care sunteti
ntrebat daca doriti sa descarcati fisierul care contine scriptul, este posibil ca extensia
fisierului script sa fie incorecta sau ca serverul PHP sa nu functioneze. Desi fisierele script
PHP trebuie sa aiba, n general, extensia .php, este posibil (dar mai rar) ca un administrator
de sistem sa configureze un server PHP astfel nct acesta sa impuna o alta extensie de
fisier. Astfel, daca scriptul dumneavoastra esueaza din unul dintre aceste doua motive,
luati legatura cu administratorul dumneavoastra de sistem.
- Daca vedeti un mesaj n care se spune ca scriptul nu exista, este posibil ca
dumneavoastra sa fi tastat incorect adresa URL. Verificati daca ati tastat corect adresa URL
identificata de administratorul dumneavoastra de sistem, precum si daca ati atasat corect
la aceasta numele fisierului care contine scriptul, folosind un slash numai daca adresa URL
identificata de administratorul dumneavoastra de sistem nu se ncheie cu acest caracter.
- Daca vedeti un mesaj n care se arata ca browserul dumneavoastra Web nu are
permisiunea de a obtine accesul la script, poate ca este necesar sa modificati permisiunile
fisierului script. Pentru a afla cum trebuie procedat, consultati-va cu administratorul de
sistem.
- Daca vedeti un mesaj n care se spune ca scriptul dumneavoastra contine o eroare,
verificati daca nu a aparut vreuna din urmatoarele probleme:
O eroare de tastare, cum ar fi scrierea gresita a cuvntului echo
O eroare de punctuatie, cum ar fi paranteze, ghilimele sau punct si virgula, lipsa sau
inserate gresit

Neincluderea sau includerea eronata a liniilor de delimitare a scriptului, n speta <?


php si ?>
Un marcaj de comentariu ( / / ) care lipseste sau care a fost introdus gresit
De exemplu, iata un script care contine un tip de eroare frecvent ntlnit. Puteti identifica
eroarea?
<?php
// Acest script contine o eroare de sintaxa
echo "Salut, World Wide Web!;
?>
Din script lipseste caracterul ghilimele duble de nchidere, care trebuie sa delimiteze
expresia de tip text. Daca ncercati sa executati acest script, puteti vedea doar o pagina
goala sau o eroare similara celei prezentate n continuare.
Parse error. Parse error in /home/bmccarty/public_html/php/module-01/syntax-error.php On
line 7
Mesajul de eroare ncearca sa va indice sursa erorii, indicnd numarul liniei la care s-a
produs eroarea. Totusi, remarcati ca mesajul va ndruma spre linia 7 a unui script care
contine numai 4 linii. Din moment ce ghilimelele duble de nchidere lipsesc, serverul PHP
cauta dincolo de sfrsitul scriptului pentru a gasi ghilimelele duble respective. Ca atare,
serverul PHP este oarecum derutat cu privire la sursa erorii.
Morala este aceea ca nu puteti conta n totalitate pe serverul PHP pentru a determina
locatia erorii; folositi numarul de linie furnizat de server numai ca ndrumar pentru a
depista locatia probabila a erorii.
3. Tratarea erorilor
Modulul PHP poate fi configurat astfel incat sa afiseze erorile intilnite in codul PHP. Acest
lucru poate fi foarte util in cazul depanarii programelor. Pentru a activa afisarea erorilor
exista doua metode:
- modificarea parametrului display_errors din fisierul de configurare "php.ini"
- folosirea functiei ini_set(display_errors);
In cazul primei metode trebuie sa avem drepturi de administrator pentru a modifica fisierul
php.ini. Nu se recomanda setarea parametrului display_errors la valoarea 1(TRUE) in cazul
site-urilor de productie; mesajele de eroare afisate nu sint folositoare utilizatorului. Pe de
alta parte aceasta ar contribui la marirea riscului unui atac.
A doua metoda consta in folositrea functiei ini_set, care permite unui script sa redefineasca
temporar un parametru din fisierul de configurare php.ini.
Consideram un exemplu de cod in care intentionat incercam sa citim variabile care nu
exista:
<?php
ini_set('display_errors',1);
echo "Valoarea transmisa este ".$var;
?>
In exemplul de mai sus daca variabila cu nume: "var" nu exista PHP va afisa un mesaj
de eroare de genul:

Notice: Undefined variable: var


Putem determina tipurile de erori pe care le semnaleaza PHP folosind
functia: error_reporting(). Aceasta preia o constanta care specifica nivelul la care se
afiseaza erorile.
error_reporting(E_ALL) - semnaleaza toate tipurile de erori
error_reporting(E_ALL & ~E_NOTICE) - semnaleaza toate erorile in afara de
anunturi
error_reporting(0) - dezactiveaza acesta caracteristica.
Exemplu:
<?php
ini_set('display_errors',1);
error_reporting(E_ALL & ~E_NOTICE);
echo "Valoarea transmisa este ".$_GET['orase'];

Constante si tipuri de variabile


nvatati sa definiti si sa utilizati constantele
nvatati sa folositi variabilele dinamice
nvatati sa convertiti valorile dintr-un tip n altul

n aceasta lectie vom discuta despre constante si variabile dinamice. Puteti scrie
programe PHP utile si complexe fara a utiliza constante sau variabile dinamice. Daca
utilizarea constantelor poate facilita citirea programelor dumneavoastra, variabilele
dinamice au un efect contrar. Din acest motiv, n general se recomanda evitarea
variabilelor dinamice, mai ales de catre programatorii PHP ncepatori. Totusi, va puteri afla
n situatia de a lucra la un program PHP scris de o persoana care foloseste aceste variabile;
prin urmare, trebuie sa aveti cunostinte despre variabilele dinamice, indiferent daca le
folositi sau nu n propriile dumneavoastra programe.
1. Utilizarea constantelor
O constanta este pur si simplu o valoare care este... constanta, cu alte cuvinte o valoare
care nu se modifica, n acest sens, constantele sunt opusele variabilelor, deoarece
valoarea unei variabile se poate modifica pe durata executiei unui program.
Pentru a defini o constanta, folositi functia define().
Sa consideram urmatorul exemplu:
define("PI", 3.14159);

- Aceasta instructiune defineste constanta "PI", atribuindu-i valoarea 3.14159. Dupa ce a fost
definita, o constanta se poate folosi n cadrul unei expresii.
De exemplu, puteti calcula aria unui cerc dupa cum urmeaza:
$arie = PI * $raza * $raza;
- Observati ca referintele la o constanta nu folosesc simbolul dolarului. Astfel, o constanta
poate fi cu usurinta deosebita de o variabila. Multi programatori scriu numele constantelor
folosind numai majuscule, ceea ce le face si mai simplu de identificat.
O functie conexa, defined(), poate determina daca o anumita constanta a fost definita.
De exemplu, cu ajutorul urmatoarei instructiuni PHP puteri determina daca fost definita
constanta Pi:
echo defined("PI");
- Retineti ca numele care va fi testat este delimitat prin ghilimele duble.
Functia defined() returneaza valoarea 1 (unu) daca respectiva constanta a fost specificata;
n caz contrar, returneaza zero
In acest exemplu, instructiunea echo va afisa valoarea 1.

Pe lnga sporirea lizibilitatii programelor, constantele pot facilita modificarea acestora.


Sa presupunem ca ati scris un program care contine multe calcule ce folosesc
valoarea 3,14159, iar ulterior ati descoperit ca trebuia sa folositi valoarea mai
exacta 3,1415926535898. Descoperirea si modificarea fiecarei aparitii a valorii originale
poate fi o activitate mare consumatoare de timp. Dar, daca ati definit o constanta pentru
reprezentarea valorii, numarul 3,14159 va aparea o singura data n program si va fi
necesara doar o singura modificare a constantei.
Valoarea "pi" este folosita extrem de frecvent n unele calcule. Pentru comoditate, PHP
furnizeaza o functionalitate mai indicata dect definirea unei constante cu valoarea pi,
functia pi() returneaza valoarea respectiva, cu 14 cifre semnificative (3.1415926535898).
Astfe, puteti calcula aria unui cerc folosind urmatoarea expresie:
$arie= pi() * $raza * $raza;
2. Lucrul cu variabile dinamice
Daca o constanta poate spori lizibilitatea si simplitatea modificarii programelor,
variabilele dinamice ngreuneaza ntelegerea si posibilitatea de a opera schimbari n
program.
Iata un exemplu simplu de variabila dinamica, denumita "$$film" :
<?php
$oameni_buni = 12;
$film = "oameni_buni";
echo $$film;
?>

O variabila dinamica este denumita folosind doua simboluri ale dolarului ($$) si este
asociata cu o variabila obisnuita care are un nume similar si include un singur simbol al
dolarului.
In exemplul de mai sus, variabila dinamica $$film este asociata cu variabila obisnuita, dar
cu aceasi nume, $film.
Valoarea unei variabile obisnuite da numele (fara un simbol al dolarului) unei a doua
variabile ordinare, n exemplu nostru, a doua variabila obisnuita este $oameni_buni.
Valoarea acestei a doua variabile obisnuite este valoarea variabilei dinamice: n exemplu,
aceasta este valoarea 12. Deci valoarea variabiei dinamice $$film, si care va fi afisata de
functia "echo" este 12.
O variabila dinamica nu contine, practic, propria sa valoare. n schimb, contine
amplasamentul unde se poate gasi valoarea; cu alte cuvinte, numele unei alte variabile.
Daca variabilele dinamice vi se par derutante, asa e, variabilele dinamice sunt derutante.
Sunt rar folosite, uneori este posibila reducerea dimensiunilor unui program folosind una
sau mai multe variabile dinamice.
3. Lucrul cu tipuri de variabile
In lectia 2 ati invatat despre tipul variabilelor: Boolean, Integer, Float, String, Array,
Object, Resource, Null.
. O consecinta a caracterului dinamic al tipurilor de variabile din limbajului PHP este aceea
ca nu trebuie sa specificati tipul variabilelor. PHP determina tipul variabilei n functie de
tipul ultimei valori atribuite variabilei. Cu toate acestea, caracterul dinamic al tipurilor nu
va scuteste de problemele legate de tipuri. Trebuie sa cunoasteti tipurile acceptate si ceea
ce se ntmpla cnd n cadrul expresiilor se folosesc doua sau mai multe tipuri.
Sa luam n considerare urmatorul script PHP scurt:
$x = 1;
$y = 2.5;
$z = $x+$y;
echo $z;
- Instructiunea de atribuire care stocheaza o valoare n variabila $z este interesanta,
deoarece expresia din membrul drept include un operand Integer (ntreg) si un operand de
tip float. Ce valoare va aparea la iesire? Raspunsul corect este 3.5, o valoare de tip float.
Cnd o expresie aritmetica foloseste mai multe tipuri de variabile, PHP executa conversia
automata a tipului. Daca unul dintre operanzi este de tip float, PHP trateaza ceilalti operanzi
ca si cum ar fi de tip float, executa calculele si returneaza rezultatul ca valoare de tip float.
Este important sa ntelegeti faptul ca prin conversia de tip nu se modifica tipurile variabilelor
unei expresii; acestia sunt pur si simplu tratati ca si cum ar fi fost de un alt tip.
In cadrul exemplului, variabila $x ramne de tip nteger, chiar daca PHP o trateaza ca o
valoare de tip float pentru a executa calculele.
Sirurile (variabilele de tip string) pot fi de asemenea supuse unei conversii de tip. Sa
examinam urmatorul exemplu:
$x = 1;
$y = $x+ "inca 1";
echo $y

- Aici cuvntul "inca" din sirul text este ignorat.


Valoarea afisata este 2, adica suma dintre valoarea variabilei $x si valoarea numerica a
sirului text, care este 1. Valoarea numerica si tipurile unui sir sunt determinate prin
respectarea urmatoarelor reguli:
1. Daca sirul ncepe cu o valoare numerica, valoarea sirului este data de valoarea
numerica respectiva; n caz contrar, valoarea sirului este zero.
2. Daca un punct zecimal sau un exponent (e sau E), este asociat cu valoarea
numerica, tipul variabilei rezultante este float; n caz contrar, tipul valorii
rezultante este un ntreg.
4. Conversia manuala a tipului variabilelor
Daca preferati, puteti prelua controlul conversiei tipului variabilei sau puteti modifica
tipul unei variabile. Pentru a prelua controlul conversiei de tip, puteti converti fortat un
operand de la un tip la altul, proces cunoscut sub numele de "conversie fortata de tip" sau
pur si simplu conversie fortata.
n continuare, este dat un exemplu unei astfel de conversie de tip, unde puteti vedea
modul de efectuare a acesteia:
$x = 1;
$y = 2.5;
$z = $x + (int)$y;
echo $z
Conversia fortata de tip, si anume (int), determina tratarea variabilei $y ca pe un ntreg
(integer), iar valoarea acesteia devine 2, n loc de 2.5, care este valoarea reala a
variabilei $y. Astfel valoarea lui $z care va fi afisata de expresia "echo" este 3.
Tabelul urmator indica si alte conversii fortate de tip care se pot folosi si expresiile care
trebuesc utiizate:
Conversie fortata
(int), (integer)

Rezultat
- Conversie fortata la ntreg

(real), (double),
- Conversie fortata la dublu
(float)
(string)

- Conversie fortata la sir

(array)

- Conversie fortata la tablou


(matrice)

(object)

- Conversie fortata la obiect

O alta modalitate de a trata o variabila ca si cum ar fi de un tip specificat este folosirea


unor functii specifice.
Ca exemplu de utilizare a uneia dintre functiile respective, luati n considerare si studiati
urmatorul exemplu:

<?php
$x = 1.5;
$y = intval($x);
echo $x;
echo "<br />$y";
?>
Rezultatul afisat va fi:
1.5
1
Valoarea 1.5 este afisata ca valoare a variabilei $x, iar valoarea l este afisata ca valoare a
variabilei $y.
Tabelul urmator prezinta si alte functii foosite pentru a trata o variabila ca si cum ar fi de alt
tip.
Functie

Operatie

doubleval(),
floatval()

- Trateaza argumentul ca fiind de tip


dublu.

intval()

- Trateaza argumentul ca fiind de tip


ntreg.

strval()

- Trateaza argumentul ca fiind de tip


string

Nici conversia normala si nici cea fortata nu modifica tipul unei variabile. Ambele
mecanisme determina tratarea variabilelor doar in expresia respectiva ca si cum ar fi de un
alt tip.
Totusi, modificarea tipului unei variabile este posibila prin utilizarea functiei settype().
Acest procedeu este ilustrat n urmatorul exemplu:
$x = 1.5;
settype($x,"integer");
echo $x; // Va afisa valoarea 1
- Tipul variabilei $x va fi schimbat in "integer", astfel valoarea afisata a variabilei $x este 1,
deoarece fractia zecimala se pierde atunci cnd functia settype() converteste valoarea
float la o valoare ntreaga.
Valorile posibile pentru al doilea argument al functiei settype(), si anume argumentul care
specifica tipul dorit, sunt:
"integer"
"double"
"string"
"array"

"object"
Sa ne amintim din lectia 2 ca exista o functie conexa, gettype(), care returneaza un
sir care indica tipul variabilei specificate. Scriptul urmator afiseaza "integer", care indica
tipul variabilei $x:
$x = 1;
echo gettype($x);

Functii pentru variabile si valori


In aceasta pagina sunt functii PHP utile in lucru cu variabile si tipurile lor de valori.

1. empty($var)
- Returneaza TRUE daca variabila "$var" e considerata goala sau cu valoare vida, altfel,
FALSE. Functia "empty()" va returna TRUE, daca $var are una din urmatoarele valori: 0, "",
"0", NULL, FALSE, array().
<?php
$var = '0';
if (empty($var)) {
echo '$var are valoare nula sau zero';
}
?>

2. floatval($var)
- Returneaza valoarea float (numar cu zecimale) a lui "$var", care poate fi numar,
ecuatie sau sir. Similara este si functia "doubleval()".
<?php
$var = '123.456';
echo floatval($var);
?>

// 123.456

3. get_defined_vars()
- Returneaza un array multidimensional ce contine o lista cu toate variabilele definite.
<?php
$arr = get_defined_vars();
print_r($arr["_POST"]);
// Returneaza toate variabilele $_POST
?>

4. get_resource_type(resursa)
- Returneaza un sir cu tipul resursei din parametru.
<?php
$c = mysql_connect();
echo get_resource_type($c);
$fp = fopen("marplo.net", "w");
echo get_resource_type($fp);
?>

// mysql link

// file

5. gettype($var)
- Returneaza tipul variabilei "$var". Un sir cu unul din urmatoarele tipuri: boolean,
integer, double, string, array, object, resource, NULL, unknown type.
<?php
$var1 = 8;
echo gettype($var1);

// integer

$var2 = "8";
echo gettype($var2);

// string

$var3 = array(8=>'http://www.marplo.net');
echo gettype($var3);
// array
$var4 = true;
echo gettype($var4);
?>

// boolean

6. intval($var)
- Transforma valoarea variabile "$var" in numar natural.
<?php
$var1 = 8.9;
echo intval($var1);

// 8

$var2 = "08";
echo intval($var2);

// 8

$var3 = -7.8;
echo intval($var3);
?>

// -7

7. is_array($var)
- Returneaza TRUE daca "$var" e o matrice (Array), in caz contrar, FALSE.

<?php
$lectii = array('http://www.marplo.net', 'php', 'html', 'css');
if (is_array($lectii)) {
echo '$lectii e o matrice';
}
?>

8. is_bool($var)
- Returneaza TRUE daca "$var" e de tip "boolean", in caz contrar, FALSE.
<?php
$var = true;
if (is_bool($var)) {
echo '$var e de tip boolean';
}
?>

9. is_float($var)
- Returneaza TRUE daca "$var" e un numar cu virgula (cu zecimale), in caz contrar,
FALSE. Acelasi rezultat il dau si functiile "is_double()" si "is_real()".
<?php
$nr = 78.9;
if (is_float($nr)) {
echo '$nr e un numar cu zecimale';
}
?>

10. is_int($var)
- Returneaza TRUE daca "$var" e un numar natural (fara zecimale), in caz contrar,
FALSE. Acelasi rezultat il dau si functiile "is_integer()" si "is_long()".
<?php
$nr = 78;
if (is_int($nr)) {
echo '$nr e un numar natural';
}
?>

11. is_null($var)
- Returneaza TRUE daca "$var" are valoarea nula, in caz contrar, FALSE.
<?php
$var = null;
if (is_null($var)) {
echo '$var are valoarea NULL';

}
?>

12. is_numeric($var)
- Returneaza TRUE daca "$var" e un numar (cu sau fara zecimale), in caz contrar,
FALSE.
<?php
$nr = 078.9;
if (is_numeric($nr)) {
echo '$nr e un numar';
}
?>

13. is_object($var)
- Returneaza TRUE daca "$var" e o variabila de tip obiect, in caz contrar, FALSE.
<?php
// Se creaza o functie de lucru
function get_vars($obj) {
// Daca variabila $obj e un obiect, returneaza tipul de valori din ea
if (is_object($obj)) {
return var_dump($obj->get_vars);
}
else {
return '$obj nu e de tip obiect';
}
}
// Defineste o clasa si-i adaga un eveniment cu apel la functie
$obj = new stdClass();
$obj->get_vars = array('cursuri', 'tutoriale', 'jocuri')
// Afiseaza rezultatul apelarii functiei cu $obj
echo get_vars($obj);
// array(3) { [0]=> string(7) "cursuri" [1]=> string(9)
"tutoriale" [2]=> string(6) "jocuri" }
?>

14. is_string($var)
- Returneaza TRUE daca "$var" e un sir, in caz contrar, FALSE.
<?php
$var = 'sir test';
if (is_string($var)) {
echo '$var e un sir';
}
?>

15. isset($var)
- Returneaza TRUE daca "$var" e setata (exista in domeniul de lucru, indiferent de
valoarea ei), in caz contrar, FALSE.
<?php
$v = '';
if (isset($v)) {
echo 'Variabila exista';
}
?>

16. print_r(array)
- Afiseaza un sir care prezinta cheile si elementele dintr-o matrice (array). Daca
parametru "array" e un sir sau numar, va afisa valoarea lui.
<?php
$aray = array('site'=>'www.marplo.net', 'php'=>'tutoriale');
print_r($aray);
// Array ( [site] => www.marplo.net [php] => tutoriale )
$var = 'Un sir oarecare';
print_r($var);
// Un sir oarecare
?>

17. serialize($var)
- Stocheaza valoarea /valorile variabilei "$var" intr-un sir. Variabila din parametru poate
fi si de tip Array sau Object. Aceasta functie este utila mai ales pentru stocarea ori
transmiterea datelor unei matrice sau obiect, mentinandu-le structura.
- In cazul obiectelor, se face "serialize" la instanta obiectului (vezi exemplul urmator, de la
"unserialize()"), si sunt salvate in sir variabilele si valorile lor dar nu si metodele (functiile),
ci doar numele lor.
<?php
$aray = array('site'=>'www.marplo.net', 'php'=>'tutoriale');
// Transforma si adauga elementele /valorile variabilei $aray intr-un sir specific
$sir_var = serialize($aray);
echo $sir_var;
// a:2:
{s:4:"site";s:14:"www.marplo.net";s:3:"php";s:9:"tutoriale";}
// Creaza o variabila cu sirul serialized identic de mai sus
$sir_serialized = 'a:2:{s:4:"site";s:14:"www.marplo.net";s:3:"php";s:9:"tutoriale";}';
// Transforma acest sir in tipul initial de variabila
$get_var = unserialize($sir_serialized);
print_r($get_var);
// Array ( [site] => www.marplo.net [php] => tutoriale )
?>

18. unserialize(sir)

- Creaza (Retransforma) la forma initiala structura unei variabile care a fost


transformata in sir cu "serialize()". Vezi si exemplul de mai sus.
<?php
// Se creaza o clasa simpla
class test {
public $nr = 8;
// O metoda (functie) a clasei (afiseaza valoarea lui $nr)
public function show_nr() {
echo $this->nr;
}
}
// Creaza instanta la aceasta clasa
$use_class = new test;
// Stocheaza clasa (instanta ei), cu serialize, intr-un sir
$sir_class = serialize($use_class);
echo $sir_class;
// O:4:"test":1:{s:2:"nr";i:8;}
// Recreaza instanta la clasa stocata cu serialize in $sir_class
$get_class = unserialize($sir_class);
// Apeleaza metoda clasei, cu instanta stocata acum in $get_class
$get_class->show_nr();
// 8
?>

19. settype($var, 'tip')


- Seteaza tipul variabile "$var" in "tip", acesta poate fi unul din urmatoarele siruri:
"boolean", "integer", "double", "string", "array", "object", "NULL". Returneaza TRUE in caz
de succes, altfel, FALSE.
<?php
$var = 7.8;
echo gettype($var);

// double

// Modifica tipul variabilei, in "string"


settype($var, 'string');
echo gettype($var);
// string
?>

20. strval($var)
- Preia intr-un sir valoarea variabilei "$var".
<?php
$var = 7*8;
echo strval($var);
?>

// 56 (sir)

21. unset($var)
- Distruge variabila "$var".
<?php
$aray = array('key'=>'test', 'php'=>'functii');
print_r($aray);
// Array ( [key] => test [php] => functii )
// Distruge un element din matrice
unset($aray['key']);
print_r($aray);
// Array ( [php] => functii )
?>

22. var_dump($var)
- Afiseaza informatii detaliate despre variabila din parametru, cum ar fi: tipul ei,
numarul de elemente si valoarea (valorile) din ea.
<?php
$aray = array('key'=>'test', 'php'=>'functii');
var_dump($aray);
// array(2) { ["key"]=> string(4) "test" ["php"]=> string(7)
"functii" }
$sir = 'Sir test';
var_dump($sir);
?>

// string(8) "Sir test"

23. var_export($var, true)


- Parametrul "true" e optional, cand acesta este adaugat, functia returneaza un sir cu
structura variabilei "$var", care poate fi exportat sub forma de sir in alta variabila. Daca
parametrul "true" nu e adaugat, afiseaza direct structura completa a lui "$var". E similara
cu "var_dump()", diferenta fiind ca "var_export()" returneaza structura variabilei asa cum e
scrisa, valida cod PHP.
<?php
$aray = array('key'=>'test', 'php'=>'functii');
$get_var = var_export($aray, true); // Exporta structura lui $aray, ca sir, in alta variabila
echo $get_var;
// array ( 'key' => 'test', 'php' => 'functii', )
$sir = 'Sir test';
var_export($sir);
?>

// 'Sir test'