Introducere în clase și obiecte în JavaScript

Acum vom studia POO în JavaScript. Să luăm un exemplu din viața reală, apoi să-l transferăm în JavaScript.

Ca exemplu, să luăm o mașină. Ea are roți, culoare, tip de caroserie, capacitate motor și așa mai departe. În plus, șoferul îi poate da comenzi: să meargă, să se oprească, să vireze la dreapta, la stânga etc.

Putem spune că există o anumită clasă de mașini, care posedă proprietăți comune (toate au roți și tuturor li se pot da comenzi).

O mașină concretă, care stă pe stradă - este un reprezentant al acestei clase, sau, cu alte cuvinte, un obiect al acestei clase. Toate obiectele acestei clase au proprietăți: numărul de roți, culoarea, tipul de caroserie și metode: a merge, a se opri, a vira la dreapta, la stânga.

Cu alte cuvinte, clasa în sine este un plan, după care la fabrică se fac mașinile. Obiectul însă - este mașina în sine, făcută după aceste planuri.

În JavaScript o clasă se creează folosind cuvântul cheie class, urmat de numele acestei clase. Să facem clasa Car:

class Car {
	// aici codul, adică planul JavaScript pentru mașină
}

Să specificăm acum în planul nostru că orice mașină, creată după acest plan, va avea o proprietate pentru culoare și o proprietate pentru cantitatea de combustibil.

Pentru aceasta, în interiorul clasei vom scrie proprietatea color și proprietatea fuel:

class Car {
	color; // culoarea mașinii
	fuel;  // cantitatea de combustibil
}

Să facem acum metodele clasei noastre. În JavaScript metodele sunt similare cu funcțiile obișnuite, doar că se declară fără cuvântul cheie function.

După cum am menționat mai sus, mașina noastră poate merge, poate vira, poate opri. Să facem metodele corespunzătoare în clasa noastră:

class Car {
	color; // culoarea mașinii
	fuel;  // cantitatea de combustibil
	
	// Comanda de a merge:
	go() {
		// un cod JavaScript oarecare
	}
	
	// Comanda de a vira:
	turn() {
		// un cod JavaScript oarecare
	}
	
	// Comanda de a se opri:
	stop() {
		// un cod JavaScript oarecare
	}
}

Am făcut planul mașinii noastre. Acum trebuie să mergem la fabrică și să facem un obiect al acestei clase (adică o mașină concretă).

În JavaScript acest lucru se face folosind cuvântul cheie new, după care se scrie numele clasei:

new Car; // comandăm fabricii să facă o mașină

Cu toate acestea, dacă pur și simplu creezi un obiect al clasei - acest lucru nu duce la nimic (este la fel ca, de exemplu, să declari un array și să nu-l pui nicăieri). Avem nevoie de o variabilă pentru stocarea acestui obiect.

Să se numească această variabilă myCar - să scriem în ea obiectul creat de noi:

let myCar = new Car;

După crearea mașinii se poate face apel la proprietățile ei. Accesarea acestora se face prin punct. Să setăm proprietățile obiectului nostru:

let myCar = new Car; // comandăm fabricii să facă o mașină

myCar.color = 'red'; // vopsim în culoarea roșie
myCar.fuel = 50;     // alimentăm cu combustibil

Gata, mașina noastră este creată, vopsită și alimentată. Acum îi putem da comenzi prin metodele acestei mașini.

Accesarea metodelor se face tot prin punct, dar, spre deosebire de proprietate, după numele metodei se scriu paranteze rotunde. Să dăm comenzi obiectului nostru:

myCar.go();
myCar.turn();
myCar.stop();