În lecția precedentă am învățat de variabile, instrucțiunile condoționale if și if … else, și de Ferestrele Alert, Prompt și Confirm. În lecția de astăzi vom continua în ceeași notă (în mare parte ) și vom discuta despre:
Data trecută am discutat și despre cum se preia o valoare ce este introdusă în fereastra de Prompt, deoarece ați intrebat cu toții, acum vom prezenta și acest lucru:
<script type="text/javascript"> var your_name = window.prompt("Introduceti numele", "Nume"); window.alert(your_name); </script>
Dacă doriți să comentați cod în JavaScript puteți realiza acest lucru astfel:
<script type="text/javascript"> <!-- cod comentat (nu va fi executat) //--> </script>
Această instrucțiune este folosită pentru a compara o valoare cu alte valori dintr-o listă.
Sintaxa:
switch (expresie) { case valoare1: cod executat daca expresie = valoare1 break case valoare2: cod executat daca expresie = valoare2 break case valoare3: cod executat daca expresie = valoare3 break default: cod executat daca expresie e diferit de valoare1, valoare2 sau valoare3 }
Mai întâi este evaluată expresia dintre paranteze rotunde, dupa care valoarea expresiei este comparată pe rând cu valoarea determinată de case. Dacă se găsește o identitate se execută codul asociat case-ului respectiv și se iese din instrucțiunea switch, altfel se execută codul de după default.
Instrucțiunile repetitive se folosesc atunci când se dorește efectuarea unei comenzi de mai multe ori. În JavaScript există patru tipuri de instrucțiuni repetitive:
Sintaxa:
for (incepere_nr; conditie_nr; ciclu) { cod care va fi executat }
Exemplu:
<script type="text/javascript"> for (x=1; x<5; x++) { document.write("<br /> x este " + x); } </script>
Rezultat:
x este 1 x este 2 x este 3 x este 4
După cum se poate observa, codul este executat de 4 ori, deoarece x=1 specifică inițializarea variabilei x cu valoare 1, x<5 reprezintă condiția care trebuie să fie adevărată pentru a fi executat codul dintre acolade, iar x++ este folosit pentru a incrementa cu o unitate valoarea variabilei x. Astfel x va ajunge să ia valorile 1, 2, 3 și 4, după care se va opri, deoarece 4 este cea mai mare valoare mai mică decât 5.
Această instrucțiune se folosește pe obiecte din JavaScript (despre care vom învăța tot în această lecție).
Sintaxa:
for (nume_proprietate in obiect) { instructiuni }
Exemplu:
<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 x; for(x in nume_colegi) { document.write(nume_colegi[x] + "<br />"); } </script>
Rezultat:
Cristi Ion Simona Adi
Această instrucțiune execută codul aflat între colade atâta timp cât condiția dintre paranteze rotunde este adevărată.
Sintaxa:
while (conditie) { codul care va fi executat }
Exemplu:
<script type="text/javascript"> var x = 1; // inițializarea variabilei x while (x<5) { // verificare condiție document.write("<br /> x este "+x); x++; // incrementarea variabilei x } </script>
Rezultat:
x este 1 x este 2 x este 3 x este 4
Foarte asemănătoare cu instrucținea while, instrucțiunea do … while mai întâi execută codul dintre acolade după care este verificată condiția, după care repetă până când condiția devine falsă.
Sintaxă:
do { codul care va fi executat } while (conditie)
Exemplu:
<script type="text/javascript"> var x = 8; do { document.write("<br /> x este "+x); x++; } while (x<5) </script>
Rezultat:
x este 8
După cum se poate vedea variabila x exte inițializată cu 8 (x=8), iar condiția este x<5. Cu toate acestea se afișează totuși un rezultat deoarece condiția este verificată după ce codul dintre acolade a fost executat.
Acum a sosit timpul să vorbim despre obiecte. În lumea din jurul nostru obiectele sunt de exemplu: o carte, o mașină, un televizor, ect. În JavaScript obiectele pot fi: o fereastră, un formular, un buton, o imagine, etc.
Toate elementele dintr-o pagină sunt văzute în JavaScript ca fiind obiecte. Obiectele au anumite proprietăți, de exemplu în lumea reală televizoarele au butoane, mașinile au roți; așa și în JavaScript obiectele au proprietăți: formularele au butone, ferestrele au titluri, etc.
Pe lângă proprietăți obiectele mai au și metode. Metodele reprezintă funcțiile pe care un obiect poate să le facă.
Sintaxa pentru a folosi un obiect este:
obiect.proprietate obiect.metoda() // parantezele rotunde arată că se referă la o metodă ci nu la o proprietate.
Punct (.) se folosește pentru a specifica cine deține proprietatea sau metoda aleasă.
Exemple de obiecte:
String este folosit pentru a prelua text.
Exemplul 1:
<script type="text/javascript"> var str = "Digital Kids."; document.write(str.bold()); </script>
Rezultat:
Digital Kids.
Exelmplul 2:
<script type="text/javascript"> var str = "Digital Kids."; document.write(str.charAt(8)); </script>
Rezultat:
K
Obiectul Array (numit si matrice sau tablou de date) se folosește pentru a stoca mai multe valori într-un singur nume de variabilă.
Fiecare valoare stocată devine un element al tabloului, acesta are asociat un „numar index“ (sau cheie, care implicit începe de la 0). Cu ajutorul acestei chei se poate face referire la oricare element din tablou.
Cu operatorul new se poate crea o „instanță“ (incepere) a obiectului Array, ca în exemplul următor:
var nume_colegi = new Array(4)
Între paranteze rotunde este trecut numărul de elemente al tabloului, în acest caz 4.
Pentru a adăuga elemente în tablou procedăm astfel:
nume_colegi[0] = "Cristi" nume_colegi[1] = "Ion" nume_colegi[2] = "Simona" nume_colegi[3] = "Adi"
sau se mai poate scrie și astfel:
var nume_colegi = Array('Cristi', 'Ion', 'Simona', 'Adi');
Pentru a prelua un element dintr-un tablou scriem numele tabloului iar între paranteze pătrate punem index-ul elementului pe care dorim să-l extragem. Exemplu:
coleg = nume_colegi[0] colega = nume_colegi[2]
Și obiectul Array are proprietatea length și mai multe metode printre care:
Exemplu:
<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; document.write("Numarul de elemente din tablu: " + nr_elemente); document.write("<br />Nume coleg: " + nume_colegi[2]); </script>
Rezultat:
Numarul de elemente din tablu: 4 Nume coleg: Simona
Exemplu:
<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"; document.write(nume_colegi.sort()); </script>
Rezultat:
Adi,Cristi,Ion,Simona
Am vom începe să vorbim și despre funcții. Funcțiile ajută la divizarea și structurarea codului. O funcție poate conține mai multe instrucțiuni și comenzi care ulterior pot fi utilizate ușor și de mai multe ori prin apelarea funcției care le conține.
O funcție se definește la începutul fișierului în secțiunea head.
function nume_functie(argument1, argument, ...) { codul care va fi executat }
Unele funcții pot returna un rezultat iar pentru aceasta se foloseste instrucțiunea return.
Exemplu:
function suma(x, y) { z = x+y; return z }
Această funcție adună cei doi parametrii ai funcției suma și returnează rezultatul ca fiind suma celor doi parametrii.
O funcție poate fi apelată astfel:
nume_functie(argument1, argument, ...); // dacă funcția are parametrii nume_functie() // dacă funcția nu are parametrii
Mai jos este prezentat un exemplu simplu de utilizare a funcțiilor:
<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>