A JavaScript egy többparadigmás nyelv, amely lehetővé teszi olyan programok írását, amelyek funkcionális, objektumorientált és kötelező programozási stílusokat követnek.
Az objektumorientált minták támogatására a JavaScript osztályokkal rendelkezik. Mivel ezek megértése kulcsfontosságú, ez a cikk egy útmutató arról, hogy mik azok a JavaScript-osztályok és hogyan kell használni őket.
Tartalomjegyzék
Mik azok az osztályok a JavaScriptben?
Az objektum-orientált programozás során a rendszereket egymással kölcsönhatásban lévő objektumok csoportjaként modellezzük. A működéshez az objektumok adatokat tárolnak tulajdonságokban, és metódusaikként meghatározott műveleteket hajtanak végre. Egy osztály határozza meg, hogy az azonos típusú objektumok milyen tulajdonságokat és metódusokat hordoznak. Ezért az osztályok az objektumok tervrajzai.
Az osztályokban használt terminológiák
Annak érdekében, hogy ugyanazon az oldalon legyünk, itt található az osztályok leírása a cikkben használt kulcskifejezésekkel. Ha már ismeri az objektum-orientált programozást, ugorhat a következő részre.
❇️ Az osztály egy objektum tervrajza. Ez egy sablont biztosít, amelyből az adott típusú objektumok készíthetők. Az objektum létrehozását az osztály által biztosított sablonból példányosításnak nevezzük.
❇️ Osztálytag minden, ami az osztályhoz tartozik. Kétféle osztálytag létezik: metódusok és tulajdonságok.
❇️ A tulajdonság egy osztálytag, amelynek elsődleges célja az értékek tárolása. Ezek lehetnek egyszerű értékek, például számok és karakterláncok. Lehetnek összetett objektumok és tömbök is.
❇️ Egyes ingatlanok csak az osztályon belül érhetők el, és találóan magántulajdonnak nevezik őket. Néhányuk elérhető az osztályon belül és kívül is. Az ilyen ingatlanokat nyilvános ingatlanoknak nevezzük.
❇️ A metódus egy osztályon belül definiált függvény. Ezért az osztályba tartozik, és hozzáféréssel rendelkezik nyilvános és magántulajdonokhoz. A tulajdonságokhoz hasonlóan nálunk is vannak nyilvános és privát metódusaink.
❇️ Vannak olyan módszerek, amelyek interfészt biztosítanak az osztályon kívüli kód számára az osztályon belüli tulajdonságokkal való interakcióhoz. A módszereknek két csoportja van erre: getter és setter. A getterek az osztálytulajdonságok értékeit kapják meg, míg a beállítók az osztálytulajdonságok értékeit.
❇️ Egyes tagok statikusak. Ez azt jelenti, hogy csak az osztályon érhetők el, és nem érhetők el az osztálypéldányokon.
Ezzel szemben egyes osztálytagok nem statikusak, vagyis csak osztálypéldányokon érhetők el. Példányosítania kell az osztályt, mielőtt hozzáférhetne egy nem statikus taghoz.
Amikor példányosít egy osztályt, egy speciális metódus kerül meghívásra a példány tulajdonságainak beállítására. Ezt a módszert konstruktor függvénynek nevezzük.
Egy osztály példányosítása magyarázattal
Az új kulcsszót és az osztálynevet használjuk egy osztály példányosítására JavaScriptben. Például példányosítsuk az Array osztályt.
const myArr = new Array()
Osztályok létrehozása JavaScriptben
Ez a rész egy olyan osztály létrehozását tárgyalja, amely megvalósítja a cikkben tárgyalt összes fogalmat Terminológiai részleg. Ezt egy sor példában fogjuk megtenni, ahol minden példa az előzőekre épít.
Üres osztály bejelentése
Egy osztály deklarálásához JavaScriptben a class kulcsszót használjuk, és nevet adunk az osztálynak. Ezután meghatározzuk az osztály törzsét. A test göndör merevítőkbe van zárva, és az osztály összes tagját tartja.
Íme egy példa osztálydeklaráció üres törzstel:
class Dog {
}
Most az alábbiak szerint példányosíthatja az osztályt, és kinyomtathatja.
const pet = new Dog; console.log(pet);
Köztulajdon létrehozása
A nyilvános tulajdonságok egy azonosítóval és egy opcionális értékkel vannak meghatározva.
class Dog {
name = "Roy";
age;
}
Itt a nevet karakterlánc értékkel, az életkort pedig érték nélkül definiáltuk.
const pet = new Dog(); console.log(pet.name); console.log(pet.age);
Nyilvános módszerek meghatározása
Metódusokat adhatunk az osztályunkhoz a törzsén belül. Ugyanúgy definiálunk egy metódust, mint egy függvényt. A function kulcsszót azonban elhagyjuk.
class Dog {
name = "Roy";
age;
walk () {
console.log("Walking");
}
}
A fenti példában definiáltuk a séta módszerét. Az Animal osztály minden példánya rendelkezik ezzel a módszerrel.
const pet = new Dog(); pet.walk();
Tulajdonságok elérése a metódusokból
A JavaScriptben általában a pont operátor használatával érjük el az objektum tulajdonságait. Például, ha van egy személy nevű objektumunk, és hozzá akarunk férni a name tulajdonsághoz, akkor ezt a következőképpen tesszük.
person.name
Ha azonban egy tulajdonságot az objektumon belülről szeretnénk elérni, akkor az objektum neve helyett a this kulcsszót használjuk. Íme egy példa:
this.name
Ez a kulcsszó az objektumra hivatkozik. Tehát, ha az osztálytulajdonságokat az osztálymetódusokon belül szeretnénk elérni, akkor ezt a.
Magántulajdon létrehozása
Tegyük fel, hogy azt akarjuk, hogy a korábban meghatározott név- és kortulajdonságok privátak legyenek. Az osztályt a következőképpen határozzuk meg újra:
class Dog {
#name = "Roy";
#age;
walk () {
console.log("Walking");
}
}
Amint láthatja, a magántulajdonokat font jelekkel határozzák meg. Ha megpróbálná elérni őket, hibákba ütközne.
const dog = new Dog(); dog.#name
Getter és Setter metódusok létrehozása
Mostantól az osztály neve és életkora privát. Ezért csak az osztályon belüli metódusokkal érhetők el.
Ha engedélyezni szeretnénk, hogy az osztályon kívüli kód hozzáférjen ezekhez a tulajdonságokhoz, akkor gettereket és settereket definiálunk. Tegyük ezt meg a névtulajdonnál.
class Dog {
#name = "Roy";
#age;
get name () {
return this.#name;
}
set name (value) {
this.#name = value;
}
walk () {
console.log("Walking");
}
}
A fent definiált osztálynál beállíthatja a nevet és megjelenítheti az alábbi kóddal:
const pet = new Dog(); // Setting the name pet.name = "Rex"; // Getting the name console.log(pet.name);
Privát módszerek létrehozása
A magántulajdonokhoz hasonlóan a privát metódusok előtagja a font jel. Ezért egy privát módszer deklarálása így néz ki:
class Dog {
#name = "Roy";
#age;
get name () {
return this.#name;
}
set name (value) {
this.#name = value;
}
#increaseAge() {
this.#age ++;
}
#decreaseAge () {
this.#age --;
}
walk () {
console.log("Walking");
}
}
Ha az osztályon kívülről próbálná elérni ezeket a metódusokat, az nem működne.
const pet = new Dog(); pet.#increaseAge();
Konstruktori módszer létrehozása
Meghatározhatja a konstruktor metódust is. Ez a metódus automatikusan meghívásra kerül, amikor új osztályt példányosít. A tulajdonságok inicializálására a konstruktor módszer használható. Ebben a példában a felhasználó által a példányosítás során megadott argumentumok alapján inicializáljuk az életkort és a nevet.
class Dog {
#name;
#age;
constructor (name = "Dog", age = 0) {
this.#name = name;
this.#age = age;
}
get name () {
return this.#name;
}
set name (value) {
this.#name = value;
}
#increaseAge() {
this.#age ++;
}
#decreaseAge () {
this.#age --;
}
walk () {
console.log("Walking");
}
}
Amikor példányosítjuk az osztályunkat, megadhatunk egy nevet és életkort.
const pet = new Dog('Roy', 3);
console.log(pet.name);
Statikus tulajdonságok és módszerek létrehozása
Mint említettük, a statikus tagok az osztály első példányosítása nélkül is elérhetők. Az alábbi példában statikus tulajdonságot és metódust fogunk létrehozni.
class Dog {
#name;
#age;
static genus = "Canis";
constructor (name = "Dog", age = 0) {
this.#name = name;
this.#age = age;
}
static bark() {
console.log("Woof");
}
get name () {
return this.#name;
}
set name (value) {
this.#name = value;
}
#increaseAge() {
this.#age ++;
}
#decreaseAge () {
this.#age --;
}
walk () {
console.log("Walking");
}
}
Mostantól példányosítás nélkül is hozzáférhet a statikus tulajdonsághoz és metódushoz.
console.log(Dog.genus); Dog.bark();
Öröklés
Az osztályok örökölhetnek tulajdonságokat más osztályoktól. Azt az osztályt, amely egy másik osztályból örökli a tagokat, szuperosztálynak nevezzük, míg azt az osztályt, amelyből a tagokat örökli, az alaposztály vagy alosztály.
Superclass létrehozásához JavaScriptben az extends kulcsszót használjuk. Íme egy példa, ahol a Kutya osztályból örököltünk.
class Rottweiler extends Dog {
constructor (name, age) {
super(name, age);
this.breed = 'rottweiler';
}
}
Mint látható, az osztály nagyjából ugyanaz, mint korábban. A konstruktoron belül azonban a szuperfüggvényt hívtuk. A szuper kulcsszó az alaposztály konstruktorára hivatkozik. Ezért az alaposztály konstruktorát a szuperosztályunkon belül neveztük el, név és életkor szerint.
const myPet = new Rottweiler(); console.log(myPet);
Következtetés
Ebben a cikkben az osztályokkal foglalkoztunk. Kitértünk arra, hogy mik ezek, milyen tagokat tarthatnak be, és a tagok különböző besorolásait. Aztán mindezt példákkal illusztráltuk.
Ezután érdemes elolvasni az objektumorientált programozási interjúkérdéseket.