VOODOO'S INTRODUCTION TO JAVASCRIPT
© 1996, 1997 by Stefan Koch © 1998 Romanian translation by Calin Nicolae



Partea 6: Obiecte Predefinite

Obiectul Date

Java Script va permite sa folositi cateva obiecte predefinite. Acestea sunt, de exemplu, obiectele Data (Date) , Matrice (Array) sau Matematic (Math). Exista si alte obiecte - va rog sa apelati documentatiea oferita de Netscape pentru informatii complete.
Vom examina obiectul - Date mai intai. Cum numele sugereaza, acest obiect va permite sa lucrati cu data si ora. de exemplu puteti cu usurinta sa calculati cate zile au mai ramas pana la Craciunul urmator. Sau puteti adauga ora exacta documentului dumneavoastra HTML.
Sa incepem cu un exemplu care afiseaza ora exacta. Trebuie creeat mai intai un nou obiect - Date. Petru aceasta folosim un nou operator. Fiti atenti la urmatoarele linii de cod:

today= new Date()

Acestea creeaza un nou obiect Date today.Daca nu specificati o anumita data si ora atunci cand creeati un nou obiect Date atunci data si ora existente vor fi folosite. Acasta inseamna ca dupa executarea today= new Date() noul obiect Date today reprezinta data si ora acestui moment.
Obiectul Date ofera cateva metode care pot fi folosite cu obiectul nostru today. Se pot folosi getHours(), setHours(), getMinutes(), setMinutes(), getMonth(), setMonth() si asa mai departe. Puteti gasi documentatia completa asupra obiectului Date si asupra metodelor sale in documentatia Javascript de la Netscape.
Va rog sa observati ca obiectul Date reprezinta numai o data sau ora "statica". Nu este vorba de un ceas care arata trecerea fiecarei secunde sau milisecunde automat.
Pentru a obtine o noua data si o noua ora trebuie folosita o alta constructie (este vorba de metoda Date apelata printr-un nou operator in momentul constructiei obiectului):

today= new Date(1997, 0, 1, 17, 35, 23)

Aceasta secventa de cod va creea un obiect Date cu proprietatile Ianuarie 1997, ora 17:35 si 23 secunde. Deci trebuie specificata data si ora astfel

Date(year, month, day, hours, minutes, seconds)

Va rog sa observati ca trebuie sa folositi 0 pentru Ianuarie - si nu 1, asa cum s-ar fi putut presupune. 1 este folosit pentru Februarie, 2 pentru Martie s.a.m.d.

Acum puteti realiza un script care sa furnizeze data si ora actuala. Rezultatul ar arata astfel:

Codul arata astfel:

<script language="JavaScript">
<!-- hide

now= new Date();

document.write("Time: " + now.getHours() + ":" + now.getMinutes() + "<br>");
document.write("Date: " + (now.getMonth() + 1) + "/" + now.getDate() + "/" + 
                (1900 + now.getYear()));

// -->
</script>
Aici trebuie sa folosim metode ca getHours() pentru a afisa data si ora specificate in obiectul Date . Puteti observa ca am adaugat 1900 anului. Metoda get Year() returneaza numerul anului incepand cu 1900. Asadar, daca anul prezent ar fi 1997 metoda va returna 97; daca anul prezent ar fi 2010 va returna 110 - nu 10 ! Daca adaugam 1900 scapam de problema anului 2000. Acest script nu verifica daca numarul minutelor este mai mic dacat 10. Aceasta inseamna ca s-ar putea obtine ceva sub forma 14:3 care de fapt inseamna 14:03. Vom vedea in urmatorul script cum se poate rezolva problema.

Sa aruncam o privire asupra unui script care afiseaza un ceas ce functioneaza:

Time:
Date:
Iata si codul:
<html>
<head>

<script Language="JavaScript">
<!-- hide

var timeStr, dateStr;

function clock() {
        now= new Date();

        // time 
        hours= now.getHours();
        minutes= now.getMinutes();
        seconds= now.getSeconds();
        timeStr= "" + hours;
        timeStr+= ((minutes < 10) ? ":0" : ":") + minutes;
        timeStr+= ((seconds < 10) ? ":0" : ":") + seconds;
        document.clock.time.value = timeStr;

        // date
        date= now.getDate();
        month= now.getMonth()+1;
        year= now.getYear();
        dateStr= "" + month;
        dateStr+= ((date < 10) ? "/0" : "/") + date;
        dateStr+= "/" + year;
        document.clock.date.value = dateStr;

        Timer= setTimeout("clock()",1000);
}

// -->
</script>
</head>

<body onLoad="clock()">

<form name="clock">
  Time:
  <input type="text" name="time" size="8"  value=""><br>
  Date:
  <input type="text" name="date" size="8" value="">
</form>

</body>
</html>
Folosim metoda setTimeout() pentru a stabili ora si data in fiecare secunda. Deci creem in fiecare secunda un nou obiect Data cu ora exacta.
Puteti vedea ca functia clock() este apelata de un onLoad event-handler in tagul <body> . In partea de continut a paginii HTML avem doua elemente de text. Functia clock() scrie data si ora in aceste doua elemente in formatul corespunzator. Puteti vedea ca folosim doua siruri in acest scop: timeStr si dateStr. Am afirmat mai devreme ca exista o problema cu minutele mai mici de 10 - acest script o rezolva cu ajutorul urmatoarelor linii de cod:
timeStr+= ((minutes < 10) ? ":0" : ":") + minutes;
Aici numarul de minute este adaugat sirului timeStr. Daca numarul minutelor este mai mic de 10 trebuie sa adaugati 0. Codul acesta poate vi se pare straniu. Il puteti scrie si in modul de mai joc, ce ar putea sa va fie mai familiar:

if (minutes < 10) timeStr+= ":0" + minutes
  else timeStr+= ":" + minutes;
Obiectul matrice (Array)

Matricile sunt foarte importante. Ganditi-va numai a un exemplu unde doriti sa folositi 100 de nume diferite. Cum se poate face aceasta cu JavaScript. Ei bine, puteti defini 100 de variabile si sa le dati diferite nume. Aceasta este insa destul de complicat.
Marticile pot fi interpretate ca mai multe variabile prinse impreuna. Ele pot fi accesate printr-un singur nume si un singur numar. Sa presupunem ca matricea noastra are numele names. Putem accesa primul nume prin intermediul names[0]. Al doilea nume este name[1] s.a.m.d.
Incepand cu JavaScript 1.1 (Netscape Navigator 3.0) puteti folosi un obiect Array. Puteti creea o noua matrice prin myArray= new Array(). Acum puteti da valori in aceasta matrice:

myArray[0]= 17;
myArray[1]= "Stefan";
myArray[2]= "Koch";
Matricile din JavaScript sunt cu advarat flexibile. Nu trebuie sa va faceti probleme cu dimensiunile matricii - dimensiunea sa se modifica dinamic. Daca scrieti myArray[99]= "xyz"dimensiunea matricii poate ajunge la 100 de elemente (o matrice JavaScript poate doar sa creasca - nu are abilitatea de a se diminua! Deci tineti matricile la dimensiuni cat mai mici!).
Nu conteaza daca introduceti numere, siruri sau alte obiecte in matrice. Nu am mentionat aici toate detaliile matricilor, dar sper ca veti descoperi ca matricile sunt un concept foarte important.
Bineinteles ca multe lucruri se vor clarifica cu ajutorul unui exemplu. Outputul urmatorului exemplu este:
first element
second element
third element
Iata si codul sursa:
<script language="JavaScript">
<!-- hide

myArray= new Array();

myArray[0]= "first element";
myArray[1]= "second element";
myArray[2]= "third element";

for (var i= 0; i< 3; i++) {
  document.write(myArray[i] + "<br>");
}

// -->
</script>
Mai intai vom creea o matrice numita myArray. Apoi vom da trei valori diferite in matrice si deschidem o bucla. Acest loop executa comanda document.write(myArray[i] + "<br>"); de trei ori. Variabila i numara de la 0 la 2 in aceasta bucla loop. Puteti vedea ca folosim myArray[i] in interiorul buclei. Pe masura ce i numara de la 0 la 2 avem trei apelari document.write(). Putem rescrie bucla astfel:
document.write(myArray[0] + "<br>");
document.write(myArray[1] + "<br>");
document.write(myArray[2] + "<br>");
Matricile si JavaScript 1.0

Deorece obiectul Array nu exista in JavaScript 1.0 (Netscape Navigator 2.x si Microsoft Internet Explorer 3.x) trebuie folosita o alternativa. Aceasta bucata de cod poate fi gasita in documentatia Netscape:

function initArray() {
  this.length = initArray.arguments.length
  for (var i = 0; i < this.length; i++)   
    this[i+1] = initArray.arguments[i]
}
Puteti creea acum o matrice cu :
myArray= new initArray(17, 3, 5);
Numerele din paranteze sunt valorile cu care initializata matricea. (acelasi rezultat se poate obtine cu un obiect matrice in JavaScript 1.1). Va rog sa observati ca acest tip de matrice nu implementeaza toate elementele obiectului Array din JavaScript 1.1 (exista spre exemplu o metoda sort() care permite sortarea tuturor elementelor intr-un specific).

Obiectul Math

Daca este necesara efectuarea de calcule matematice vati gasi cateva metode in obiectul Math care va vor ajuta. Iata un exemplu al metodei sine-method sin().Veti gasi referinte complete in documentatia Netscape.
As dori sa demonstrez folosirea metodei random(). Daca ati citit prima versiune a acestui tutorial atunci stiti ca au existat unele probleme cu metoda random(). Am scris atunci o functie care permitea creearea de numere aleatoare. Aceasta functie nu mai este necesara deoarece in prezent metoda random() functioneaza pe toate platformele.
Daca apelati Math.random() veti obtine un numar aleator intre 0 si 1. Iata outputul document.write(Math.random()) (numarul se va schimba la reincarcarea paginii):

[previous] [index] [next]

©1996,1997 by Stefan Koch
e-mail:skoch@rumms.uni-mannheim.de
http://rummelplatz.uni-mannheim.de/~skoch/
My JavaScript-book