JavaScript Curs1
JavaScript Curs1
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 in exemplele anterioare.
Recomandarea HTML 5 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.
<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
- 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" \ google.com), 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\" \\ google.com");
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.
Notiuni de baza JS
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
- Operatorul conditional ?
- Operatori pentru functii
- Operatori pentru structuri de date
Operatorii JS
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:
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 cu i = i+1.
Exemplu:
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 cu i = i-1.
Exemplu:
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
x=y
x += y
x -= y
x *= y
x /= y
x %= y
Este acelasi cu
x=y
x = x+y
x = x-y
x = x*y
x = 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
Egal
Diferit
Mai mare
Mai mic
Mai mare sau egal
Mai mic sau egal
Exemple
3 == 8 returneaza FALSE
3 != 8 returneaza TRUE
3 > 8 returneaza FALSE
3 < 8 returneaza TRUE
3 >= 8 returneaza FALSE
3 <= 8 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:
x=5
y=8
!(x==y)
(returneaza TRUE deoarece 'x' nu este egal cu'y')
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
typeof 33
typeof "un anume text"
typeof true
typeof window
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]
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