Introducere în limbajul html

Operatorii JavaScript

Operatorii JavaScript, la fel ca orice operatori din cadrul unui limbaj de programare, permit realizarea de operaţii asupra unor tipuri de date.

In continuare sunt analizate cele 5 tipuri importante de operatori:

• 
  aritmetici (arithmetic);
  
• 
  de comparare (comparison);
  
• 
  de atribuire rapidă (assignment shorthand);
  
• 
  logici (logical);
  
• 
  asupra şirurilor (string).
  

Operatori aritmetici

Opetator	Descriere	Exemplu	Rezultat
+	Adunare	4+2	6
-	Scădere	5-1	4
*	Înmulţire	6*4	32
/	Împărţire	6/3	2
%	Modulo: returnează întregul rămas după împărţire	5/2	1
++	Incrementare	x=4 x++	x=5
--	Decrementare	x=44 x--	x=43

În continuare vom analiza mai de aproape operatorii de incrementare şi decrementare, iar în acest cadru vom discuta operatorii de post-incrementare şi pre-incrementare.

Sintaxa operatorului de post-incrementare este:

operator1++

Valoarea acestei expresii este „operator1”. Fie următorul exemplu:

var suma=numar++;

în exemplul anterior operator1 este numar. Variabila suma va avea valoarea numar+1 iar numar va fi incrementat cu 1 (numar=numar+1).

Sintaxa operatorului de pre-inctementare este:

++operator1

Valoarea acestei expresii este 1+operator1. Fie următorul exemplu:

var suma=++numar;

În exemplul anterior operator1 este numar. Variabila suma va avea valoarea numar+1, iar numar va fi incrementat cu 1 (numar-numar+1).

Sintaxa operatorului de post-decrementare este;

operator1--

Valoarea acestei expresii este operator1. Fie următorul exemplu:

var suma=numar--;

În exemplul anterior operator1 este numar. Variabila suma va avea valoarea numar, iar numar va fi decrementat cu 1 (numar=numar-1).

Sintaxa operatorului de pre-decrementare este:

--operator1

Valoarea acestei expresii este operator-1. Fie următorul exemplu:

var suma=--numar;

În exemplul anterior operator1 este numar. Variabila suma va avea valoarea numar-1, iar numar va fi decrementat cu 1 (numar=numar-1).

Operatori de comparare

Operator	Descriere	Exemplu
==	este egal cu	6==81 returnează fals (false)
!=	nu este egal cu	6!=81 returnează adevărat (true)
>	mai marc decât	6>81 returnează fals (false)
<	mai mic decât	6<81 returnează adevărat (true)
>=	mai mare sau egal cu	6>=81 returnează fals (false)
<=	mas mic sau egal cu	6<=81 returnează adevărat (true)

Operatori de atribuire (asignare) rapidă

Operator	Exemplu	Reprezintă
+=	x+=y	x=x+y
-=	x-=y	x=x-y
*=	a*=b	a=a*b
/=	a/=b	a=a/b
%=	a%=b	a=a%b

Operatori logici

Operator	Descriere	Exemplu
&&	and	Daci a=4 şi b=2, atunci expresia (a<8&&b>1) este adevărata
||	or	Daci a=8 şi b=6, atunci expresia (a==4||b==4) este adevărată
!	not	Dacă a=4 şi b=3, atunci expresia (a!=b) este adevărată

Operatori asupra şirurilor

Un şir reprezintă în mod obişnuit un text, cum ar fi textul „Limbajul JavaScript”.

Pentru a concatena doua sau mal multe variabile de tip (şiruri), utilizăm operatorul „+”.

Fie următoarele două şiruri:

sir1="Limbajul" şi sir2="JavaScript"

Vom atribui variabilei sir3 rezultatul concatenării şirurilor sir1 şi sir2, după cum se poate observa in continuare:

sir3=sir1+sir2

Variabila sir3 de tip şir (string) va conţine textul „Limbajul JavaScript”. Pentru a adăuga un spaţiu intre conţinutul celor două şiruri sir1 şi sir2, inserăm un spaţiu în expresie sau într-unul din şiruri:

sir1="Limbajul"

sir2="JavaScript"

sir3=sir1+" "+sir2

sau

sir1="Limbajul"

sir2="JavaScript"

sir3=sir1+sir2

În ambele cazuri variabila sir3 de tip şir (string) va conţine „Limbajul JavaScript”,

Evenimentele şi manipulatorii de evenimente

Evenimentele (events) şi manipulatorii de evenimente (event handlers) reprezintă un concept foarte important pentru programarea JavaScript.

Evenimentele sunt de obicei cauzare de o acţiune realizată de câtre un utilizator. Dacă un utilizator execută un click pe un buton dintr-un formular (form), se va produce evenimentul Click. În cazul în care cursorul mouse-ului se deplasează peste o legătură (link), se produce (are loc) evenimentul MouseOver.

Existenţa mai multor evenimente permite programatorului să scrie programe JavaScript care să reacţioneze la anumite evenimente. Acest lucru poate fi realizat prin intermediul manipulatorilor de evenimente (event handlers). De exemplu, un buton poate să deschidă o fereastră nouă atunci când un utilizator executa un click pe acesta.

Manipulatorul de evenimente specifică codul JavaScript ce se va executa. De obicei aceşti manipulatori de evenimente sunt plasaţi în interiorul unui marcaj (tag) HTML, marcaj care crează obiectul asupra căruia va acţiona evenimentul. Sintaxa unui astfel de manipulator de evenimente poate fi observată in continuare:

De exemplu, dacă dorim ca atunci când trecem cu mouse-ul pe deasupra unei legături ( ... ) să fie deschisă o nouă fereastră, putem utiliza următoarea sintaxă:

Programul scris în limbajul JavaScript şi apelat de către manipulatorul de evenimente poate conţine o singură instrucţiune sau mai multe instrucţiuni. De obicei manipulatorul va apela o funcţie după cum se poate observa în exemplul anterior.

Setul evenimentelor implementate de browser-ele actuale reprezintă o submulţime a celui specificat în DOM (Document Object Model). Fiecare browser oferă o implementare proprie.

În continuare este oferit un tabel al celor mai comune evenimente ce au suport atât la navigatorul Netscape, cât şi în navigatorul Internet Explorer:

Eveniment	Descriere	Manipulator
click	Utilizatorul execută un click pe un anumit element	onClick
change	Utilizatorul modifică valoarea unui element dintr-un formular (text, textare sau select)	onChange
mouseover	Utilizatorul poziţionează cursorul mouse-ului pe o legătură	onMouecOver
mouseout	Utilizatorul mută cursorul mouse-ului de pe o legătură	onMouseOut
select	Utilizatorul selectează un câmp de tip text ()	onSelect
submit	Utilizatorul trimite un formular electronic	onSubmit
resize	Utilizatorul redimensionează fereastra navigatorului	onResize
load	Utilizatorul încarcă o pagină Web	onLoad
unload	Utilizatorul iese dintr-o pagina Web (părăseşte pagina Web)	onUnload

În următorul exemplu, dacă utilizatorul va poziţiona cursorul mouse-ului pe legătura „Site Brainbench”, se va deschide o fereastră de avertizare care conţine mesajul „Legătura către site-ul Brainbench!". Fereastra se va deschide datorită apelării funcţiei mesaj() de către manipulatorul onMouseOver.

Site

Brainbench

Un click pe butonul "Apel functie!" va avea ca efect apelarea functiei ’apel’.

Un click pe butonul "Apel functie!" va avea ca efect apelarea functiei 'apel()' ce are un argument (text1).

input type="button" onClick="apel(' Primul mesaj!')" value'="Apel1">

. . .

Programul este introdus în elementul body!

Instrucţiunea switch