Ca si in alte limbaje de programare, obiectele sunt folosite pentru a organiza codul intr-o forma mai clara si compacta.
Pe langa obiectele predefinite pe care le contine JavaScript, cum ar fi: "window", "document", "date", si altele; pot fi create de programator si folosite in acelasi fel si alte obiecte, cu propriile metode si proprietati.
In acest tutorial este explicat modul de creare a unui obiect si adaugarea de proprietati si metode.

1. Crearea de obiecte JavaScript

Forma cea mai simpla de creare a unui obiect in JS este prin intermediul sintaxei:
            "var nume_obiect = new Object()"
- Tehnic, un obiect JavaScript este un Array asociativ, format din proprietati si metode.

Un Array asociativ se formeaza in felul urmator (aici cu 2 elemente):

var nume_array = new Array();
  nume_array['key1'] = 'valoarea asociata primei chei';
  nume_array['key2'] = 'valoarea asociata cheii doi';
Valorile fiecarui element se pot obtine in 2 moduri, cu sintaxele:
            nume_array['cheie']
        sau
            nume_array.cheie
- Iata o mica demonstratie:
<script type="text/javascript"><!--
var nume_array = new Array();
  nume_array['key1'] = 'valoarea asociata primei chei';
  nume_array['key2'] = 'valoarea asociata cheii doi';

// Utilizarea formulei cu paranteze drepte
alert('Cu paranteze drepte: '+ nume_array['key1']);

// Utilizarea formulei cu punct (.)
alert('Cu punct: '+ nume_array.key2);
//--></script>
- Acest script va avea ca rezultat afisarea a doua ferestre Alert (una dupa alta). Click pe:
- La fel se poate proceda si cu obiectele, in cazul acestora de obicei se utilizeaza formula cu punct.

2. Adaugarea proprietatilor

Proprietatile se definesc dupa ce a fost creat obiectul, cu "new Object()".
Forma cea mai directa de a defini proprietati cu anumite valori unui obiect este dupa urmatoarea formula:
            nume_obiect.nume_proprietate = 'Valoare';

- Sau, avand in vedere ca obiectul este un Array asociativ, se poate folosi si sintaxa:
            nume_obiect['nume_proprietate'] = 'Valoare';
Iata un exemplu:

<script type="text/javascript"><!--
var Sites = new Object();
  Sites.url = 'https://marplo.net/';
alert(Sites.url);
//--></script>
- Click pe buttonul: pentru a vedea rezultatul.

Ca valoare a proprietatii se poate folosi si rezultatul unei functii ce a fost mai inainte creata, dupa cum se vede in urmatorul exemplu.
<script type="text/javascript"><!--
// Se creaza functia a carei rezultat va fi valoarea unei proprietati
function f_pro(x, y) {
    var produsul = x*y;
    return produsul;
}

// Se creaza obiectul si o proprietate cu valoarea data de functia f_pro()
var obiect = new Object();
  obiect.produs = f_pro(7, 8);

// Se da Alert cu valoarea proprietatii
alert(obiect.produs);
//--></script>
- Ca sa vedeti rezultatul, testati singuri acest script.

3. Definirea metodelor

In principiu, metodele sunt functii, iar valoarea obtinuta prin apelarea unei metode este rezultatul returnat de functia asociata metodei respective.
Ca si proprietatile, metodele se definesc prin notatia cu punct (.), dupa crearea obiectului. Iar ca valoare se asociaza o functie. Sintaxa generala este urmatoarea:
            nume_obiect.nume_metoda = functie
- Functia poate fi creata inainte si asociata prin numele ei, sau poate fi creata direct in momentul definirii metodei, cu formula:
            nume_obiect.nume_metoda = function() { ... codul functiei }
Iata un exemplu din care se intelege mai bine. Se creaza un obiect cu doua metode. Primei metode i-se asociaza o functie creata inainte, iar pentru a doua metoda functia e creata direct in codul definirii ei (dupa sintaxa de mai sus).

<script type="text/javascript"><!--
// Se creaza functia ce va fi asociata unei metode
function f_suma(a, b) {
    var suma = a+b;
    return alert('Suma este: '+ suma);
}

// Se defineste obiectul "Obj" cu proprietatea "id" si metodele "getSuma" si "getId"
var Obj = new Object();
  Obj.id = 'tutoriale';
  Obj.getSuma = f_suma;
  Obj.getId = function() {
      var idul = 'Id-ul obiectului este: '+ this.id;
      alert(idul);
  };

// Se apeleaza metoda "getSuma"
Obj.getSuma(7, 8);

// Se apeleaza metoda "getId"
Obj.getId();
//--></script>
- Prin apelarea celor doua metode: "getSuma" si "getId", vor fi executate functiile asociate lor, acestea returnand fiecare cate o fereastra Alert, dupa cum puteti vedea daca dati click pe:
- Observati ca pentru asocierea functiei "f_suma()" la metoda "getSuma" s-a folosit doar numele (fara parantezele rotunde), iar la apelul metodei se tine cont de cei 2 parametri ai functiei (a, b), si metoda se apeleaza cu 2 numere ca parametri.
- Un alt aspect important in acest exemplu este utilizarea sintaxei "this.id". Cuvantul this se foloseste de obicei in interiorul metodelor si mereu face referire la obiectul curent prin care e apelata metoda. "id" este proprietatea obiectului "Obj". Astfel, formula "this.id" returneaza valoarea proprietatii "id" a obiectului curent (Obj).

4. Imbricarea obiectelor

Prin imbricarea obiectelor se intelege crearea de obiecte in interiorul altui obiect. Astfel, proprietatea unui obiect (valoarea ei) poate fi un Array sau chiar un alt obiect.
Studiind exemplul urmator si explicatiile din el, se poate intelege modul de realizare a obiectelor imbricate

<script type="text/javascript"><!--
// Se creaza un obiect principal "Cursuri", cu 2 proprietati: "tip" si "sites", si o metota "getCurs()"
// Prima proprietate, "tip", va avea ca valoare un Array cu 2 elemente
// A doua, "sites", va avea ca valoare un alt obiect ce va avea si el o proprietate "url"
// Metoda "getCurs()" va prelua, dupa un parametru, o valoare din prima proprietate si pe cea din "url", prin a doua proprietate

var Cursuri = new Object();
  Cursuri.tip = new Array('lectii', 'tutoriale');         // Prima proprietate
  Cursuri.sites = new Object();         // A doua proprietate (obiect intern)
  Cursuri.sites.url = 'marplo.net';         // proprietatea obiectului intern
  Cursuri.getCurs = function(nr) {         // Metoda obiectului "Cursuri"
      var sir1 = this.tip[nr];         // Preia o valoare din proprietatea "tip"
      var sir2 = this.sites.url;         // Preia valoarea proprietatii "url" (a obiectului imbricat)
      return sir1+ ' - '+ sir2
  };

// Da un alert cu apelarea metodei "getCurs"
alert(Cursuri.getCurs(1));
//--></script>
- Ca sa vedeti rezultatul acestui script, dati click pe:

Un Test simplu in fiecare zi

HTML
CSS
JavaScript
PHP-MySQL
Engleza
Spaniola
Ce element HTML adauga continut flash SWF in pagina web?
<object> <div> <script>
<object type="application/x-shockwave-flash" data="file.swf" width="500" height="250">
 <param name="src" value="file.swf" />
 Browser-ul dv. nu suporta SWF.
</object>
Care pseudo-clasa CSS adauga un stil la un camp input de formular cand e cursorul in el?
:active :focus :hover
input:focus {
  background-color: #88fe88;
}
Clic pe instructiunea care transforma un sir JSON in obiect JavaScript.
JSON.stringify(javascript_object) object.toString() JSON.parse(json_string)
var jsnstr = '{"url": "http://coursesweb.net/", "title": "Web Development Courses"}';
var obj = JSON.parse(jsnstr);
alert(obj.url);
Indicati functia PHP care poate crea sau scrie un fisier pe server.
fopen() file_put_contents() file_get_contents()
if (file_put_contents("file.txt", "content")) echo "Fisierul a fost creat";
else echo "Fisierul nu poate fi creat";
Cum se spune "al treilea" in engleza?
threeth third three
I planted the third tree.
- Am plantat al treilea pom.
Cum se spune "al treilea" in spaniola?
segundo tres tercero
Yo planté el tercero árbol.
- Am plantat al treilea pom.
Creare obiecte, proprietati si metode

Last accessed pages

  1. Introducere in HTML (9327)
  2. Curs HTML gratuit Tutoriale HTML5 (34469)
  3. Gramatica limbii spaniole. Indrumator si prezentare generala (25609)
  4. Trecutul simplu si continuu - Past Tense Simple and Continuous (39360)
  5. Numerale, Numere in limba engleza - Numerals (25193)

Popular pages this month

  1. Gramatica limbii engleze - Prezentare Generala (1987)
  2. Prezentul simplu si continuu - Present Tense Simple and Continuous (1683)
  3. Trecutul simplu si continuu - Past Tense Simple and Continuous (1589)
  4. Prezent perfect si Prezent perfect continuu - Present perfect and Continuous (1448)
  5. Conditional IF in Limba Engleza - Fraze Conditionale (1172)