JavaScript е многопарадигмен език, който ви позволява да пишете програми, които следват функционални, обектно-ориентирани и императивни стилове на програмиране.
За да поддържа обектно-ориентирани модели, JavaScript има класове. Тъй като разбирането им е от решаващо значение, тази статия е ръководство за това какво представляват JavaScript класовете и как да ги използвате.
Съдържание
Какво представляват класовете в JavaScript?
В обектно-ориентираното програмиране ние моделираме системи като групи от обекти, които взаимодействат помежду си. За да функционират, обектите съхраняват данни в свойства и изпълняват действия, определени като техни методи. Класът определя какви свойства и методи се носят от обекти от същия тип. Следователно класовете са чертежи за обекти.
Терминологии, използвани в класовете
За да сме сигурни, че сме на една и съща страница, ето описание на класове с ключови термини, които ще използваме в тази статия. Ако вече сте запознати с обектно-ориентираното програмиране, можете да преминете към следващия раздел.
❇️ Класът е план за обект. Той предоставя шаблон, от който могат да бъдат направени обекти от този тип. Създаването на обект от шаблона, предоставен от класа, се нарича инстанциране.
❇️ Член на класа е всичко, което принадлежи на класа. Има два вида членове на класа – методи и свойства.
❇️ Свойството е член на клас, чиято основна цел е да съхранява стойности. Това могат да бъдат прости стойности като числа и низове. Те също могат да бъдат сложни обекти и масиви.
❇️ Някои свойства са достъпни само вътре в класа и са подходящо наречени частни свойства. Някои са достъпни както в рамките на класа, така и извън него. Такива имоти се наричат обществени имоти.
❇️ Методът е функция, дефинирана вътре в клас. Следователно той принадлежи към класа и има достъп до публични и частни имоти. Подобно на свойствата, ние също имаме публични методи и частни методи.
❇️ Съществуват някои методи за предоставяне на интерфейс за код извън класа за взаимодействие със свойства вътре в класа. Има две групи методи, които правят това: гетери и сетери. Гетерите получават стойности на свойствата на класа, докато сетерите задават стойности на свойствата на класа.
❇️ Някои членове са статични. Това означава, че те са достъпни само в класа и не могат да бъдат достъпни в екземпляри на класа.
За разлика от това, някои членове на класа не са статични, което означава, че могат да бъдат достъпни само в екземпляри на клас. Трябва да създадете класа, преди да имате достъп до нестатичен член.
Когато създавате екземпляр на клас, се извиква специален метод за настройка на свойствата на екземпляра. Този метод се нарича функция конструктор.
Обяснено създаване на екземпляр на клас
Използваме новата ключова дума и името на класа, за да създадем клас в JavaScript. Например, нека създадем класа Array.
const myArr = new Array()
Създаване на класове в JavaScript
Този раздел ще обсъди създаването на клас, който прилага всички концепции, разгледани в Терминологичен раздел. Ще направим това в поредица от примери, като всеки пример надгражда предишните.
Деклариране на празен клас
За да декларираме клас в JavaScript, използваме ключовата дума class и даваме име на класа. След това дефинираме тялото на класа. Тялото е затворено във фигурни скоби и съдържа всички членове на класа.
Ето примерна декларация на клас с празно тяло:
class Dog {
}
Сега можете да създадете класа по следния начин и да го отпечатате.
const pet = new Dog; console.log(pet);
Създаване на публични имоти
Публичните свойства се дефинират с идентификатор и незадължителна стойност.
class Dog {
name = "Roy";
age;
}
Тук сме дефинирали името със стойност на низ и възрастта без стойност.
const pet = new Dog(); console.log(pet.name); console.log(pet.age);
Дефиниране на публични методи
Можем да добавяме методи към нашия клас в тялото му. Ние дефинираме метод по същия начин, по който бихме дефинирали функция. Ние обаче пропускаме ключовата дума функция.
class Dog {
name = "Roy";
age;
walk () {
console.log("Walking");
}
}
В горния пример дефинирахме метода на ходене. Всеки екземпляр на класа Animal ще има този метод.
const pet = new Dog(); pet.walk();
Достъп до свойства от методи
В JavaScript обикновено осъществяваме достъп до свойства на обект, използвайки оператора точка. Например, ако имаме обект с име person и искаме да получим достъп до свойството name, ще направим това по следния начин.
person.name
Ако обаче искаме да получим достъп до свойство от обекта, използваме ключовата дума this вместо името на обекта. Ето един пример:
this.name
Ключовата дума this препраща към обекта. Така че, ако искаме да имаме достъп до свойствата на класа от методите на класа, ще използваме този синтаксис.
Създаване на частни имоти
Да предположим, че искаме свойствата за име и възраст, които дефинирахме по-рано, да бъдат лични. Ще предефинираме класа, както следва:
class Dog {
#name = "Roy";
#age;
walk () {
console.log("Walking");
}
}
Както можете да видите, частните имоти са посочени с помощта на знаци за паунд. Ако се опитате да получите достъп до тях, ще попаднете на грешки.
const dog = new Dog(); dog.#name
Създаване на методи Getter и Setter
Сега свойствата на името и възрастта на класа са лични. Следователно те могат да бъдат достъпни само чрез методи вътре в класа.
Ако искаме да активираме код извън класа за достъп до тези свойства, дефинираме гетери и сетери. Нека направим това за свойството име.
class Dog {
#name = "Roy";
#age;
get name () {
return this.#name;
}
set name (value) {
this.#name = value;
}
walk () {
console.log("Walking");
}
}
С класа, дефиниран по-горе, можете да зададете името и да го покажете, като използвате кода по-долу:
const pet = new Dog(); // Setting the name pet.name = "Rex"; // Getting the name console.log(pet.name);
Създаване на частни методи
Подобно на частните свойства, частните методи имат префикс със знака за паунд. Следователно декларирането на частен метод би изглеждало така:
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");
}
}
Ако се опитате да получите достъп до тези методи извън класа, няма да работи.
const pet = new Dog(); pet.#increaseAge();
Създаване на метод на конструктор
Можете също така да дефинирате метода на конструктора. Този метод ще се извиква автоматично всеки път, когато създавате нов клас. Методът на конструктора може да се използва за инициализиране на свойства. В този пример ние ще инициализираме възрастта и името към каквито и да е аргументи, предоставени от потребителя по време на инстанцирането.
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");
}
}
Когато създаваме нашия клас, можем да предоставим име и възраст.
const pet = new Dog('Roy', 3);
console.log(pet.name);
Създаване на статични свойства и методи
Както споменахме, статичните членове могат да бъдат достъпни без първо да се инстанцира класа. В примера по-долу ще създадем статично свойство и метод.
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");
}
}
Сега можете да получите достъп до статичното свойство и метод без инстанция.
console.log(Dog.genus); Dog.bark();
Наследство
Класовете могат да наследяват свойства от други класове. Клас, който наследява членове от друг клас, се нарича суперклас, докато класът, от който наследява членове, е базов клас или подклас.
За да създадем суперклас в JavaScript, използваме ключовата дума extends. Ето един пример, в който наследяваме от класа Dog.
class Rottweiler extends Dog {
constructor (name, age) {
super(name, age);
this.breed = 'rottweiler';
}
}
Както можете да видите, класът е до голяма степен същият като преди. Вътре в конструктора обаче извикахме супер функцията. Ключовата дума super препраща към конструктора на базовия клас. Затова извикахме конструктора на базовия клас вътре в нашия суперклас, предавайки име и възраст.
const myPet = new Rottweiler(); console.log(myPet);
Заключение
В тази статия разгледахме класове. Разгледахме какви са те, членовете, които могат да държат, и различните класификации за членовете. След това илюстрирахме всичко това с примери.
След това може да искате да прочетете въпроси за интервю за обектно-ориентирано програмиране.