Úvod do tried a objektov v JavaScripte

Teraz sa budeme venovať štúdiu OOP v JavaScripte. Pozrime sa na príklad zo života, a potom ho prenesieme do JavaScriptu.

Ako príklad si vezmime automobil. Ten má kolesá, farbu, typ karosérie, objem motora a tak ďalej. Okrem toho, vodič mu môže dávať príkazy: ísť, zastaviť sa, odbočiť doprava, doľava atď.

Môžeme povedať, že existuje istý trieda automobilov, ktorá má spoločné vlastnosti (všetky majú kolesá a všetkým je možné dávať príkazy).

Konkrétny automobil stojaci na ulici - je zástupcom tejto triedy, alebo inými slovami, objekt tejto triedy. Všetky objekty tejto triedy majú vlastnosti: počet kolies, farbu, typ karosérie a metódy: ísť, zastaviť sa, odbočiť doprava, doľava.

Inými slovami, samotná trieda je výkres, podľa ktorého sa v továrni vyrábajú automobily. Objekt je samotné auto, vyrobené podľa týchto výkresov.

V JavaScripte sa trieda vytvára pomocou kľúčového slova class, za ktorým nasleduje názov tejto triedy. Vytvorme triedu Car:

class Car {
	// tu je kód, teda JavaScriptový výkres automobilu
}

Určme teraz v našom výkrese, že akýkoľvek automobil, vytvorený podľa tohto výkresu, bude mať vlastnosť pre farbu a vlastnosť pre množstvo paliva.

Na to vnútri triedy napíšeme vlastnosť color a vlastnosť fuel:

class Car {
	color; // farba automobilu
	fuel;  // množstvo paliva
}

Vytvorme teraz metódy našej triedy. V JavaScripte sú metódy podobné obyčajným funkciám, len deklarujú sa bez kľúčového slova function.

Ako už bolo spomenuté vyššie, náš automobil môže ísť, môže odbočovať, môže zastaviť. Vytvorme zodpovedajúce metódy v našej triede:

class Car {
	color; // farba automobilu
	fuel;  // množstvo paliva
	
	// Príkaz ísť:
	go() {
		// nejaký JavaScript kód
	}
	
	// Príkaz odbočiť:
	turn() {
		// nejaký JavaScript kód
	}
	
	// Príkaz zastaviť sa:
	stop() {
		// nejaký JavaScript kód
	}
}

Spravili sme výkres nášho automobilu. Teraz je potrebné ísť do továrne a vyrobiť objekt tejto triedy (teda konkrétny automobil).

V JavaScripte sa to robí pomocou kľúčového slova new, za ktorým sa píše názov triedy:

new Car; // prikážeme továrni vyrobiť automobil

Avšak, ak len vytvoríme objekt triedy - nepovedie to k ničomu (je to rovnako, ako keby sme napríklad deklarovali pole a nikam ho nezapísali). Potrebujeme premennú na uchovanie tohto objektu.

Nech sa táto premenná volá myCar - zapíšme do nej vytvorený objekt:

let myCar = new Car;

Po vytvorení automobilu je možné pristupovať k jeho vlastnostiam. Prístup k nim prebieha cez bodku. Nastavme vlastnosti nášho objektu:

let myCar = new Car; // prikážeme továrni vyrobiť automobil

myCar.color = 'red'; // farbíme na červeno
myCar.fuel = 50;     // natankujeme palivo

Hotovo, náš automobil je vytvorený, nafarbený a natankovaný. Teraz mu môžeme dávať príkazy cez metódy tohto automobilu.

Prístup k metódam tiež prebieha cez bodku, ale na rozdiel od vlastnosti, za názvom metódy nasledujú okrúhle zátvorky. Dávajme príkazy nášmu objektu:

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