TypeScript - Классы: Пособие для начинающих

Здравствуйте, будущий coding superstar! ? Готовы окунуться в захватывающий мир классов TypeScript? Не волнуйтесь, если вы еще ни разу не писали строку кода – мы начнем с нуля и будем постепенно продвигаться вперед. К концу этого руководства вы будете создавать классы как профи! Так что lets get started на этом приключении вместе.

Что такое классы?

Прежде чем мы углубимся в детали, давайте поймем, что такое классы. Представьте класс как чертеж для создания объектов. Так же, как архитекторы используют чертежи для строительства домов, мы используем классы для создания объектов в нашем коде. Эти объекты могут иметь свойства (например, цвет дома) и методы (например, открывать дверь).

Создание классов

Давайте начнем с создания нашего первого класса. Мы создадим простой класс Car.

class Car {
make: string;
model: string;
year: number;

constructor(make: string, model: string, year: number) {
this.make = make;
this.model = model;
this.year = year;
}

honk() {
console.log("Beep beep!");
}
}

Давайте разберем это:

1. Мы начинаем с ключевого слова class, за которым следует имя нашего класса, Car.
2. Внутри класса мы определяем свойства: make, model и year.
3. constructor - это особый метод, который вызывается при создании нового объекта Car. Он устанавливает начальные значения для наших свойств.
4. У нас также есть метод honk, который при вызове выводит "Beep beep!" в консоль.

Создание экземпляров объектов

Теперь, когда у нас есть класс Car, давайте создадим некоторые реальные объекты автомобилей!

let myCar = new Car("Toyota", "Corolla", 2020);
let yourCar = new Car("Honda", "Civic", 2019);

Здесь мы создали два объекта Car: myCar и yourCar. Ключевое слово new сообщает TypeScript создать новый экземпляр нашего класса Car.

Доступ к атрибутам и функциям

Теперь, когда у нас есть объекты автомобилей, как мы их используем? Давайте посмотрим:

console.log(myCar.make);  // Выводит: Toyota
console.log(yourCar.year);  // Выводит: 2019

myCar.honk();  // Выводит: Beep beep!

Мы используем точечную нотацию для доступа к свойствам и методам наших объектов. Это как если бы мы говорили: "Эй, myCar! Какой у тебя make?" или "Эй, myCar! Дай нам гудок!"

Наследование классов

Наследование - это мощная функция, которая позволяет нам создавать новые классы на основе существующих. Давайте создадим класс SportsCar, который наследуется от нашего класса Car:

class SportsCar extends Car {
topSpeed: number;

constructor(make: string, model: string, year: number, topSpeed: number) {
super(make, model, year);
this.topSpeed = topSpeed;
}

race() {
console.log(`Racing at ${this.topSpeed} mph!`);
}
}

let mySpeedster = new SportsCar("Ferrari", "F8", 2021, 210);
mySpeedster.honk();  // Выводит: Beep beep!
mySpeedster.race();  // Выводит: Racing at 210 mph!

Вот что происходит:

1. Мы используем ключевое слово extends для наследования от Car.
2. Мы добавляем новое свойство topSpeed.
3. В конструкторе мы вызываем super() для инициализации свойств родительского класса.
4. Мы добавляем новый метод race, специфичный для SportsCar.

Наш SportsCar имеет все свойства и методы Car, plus свои собственные дополнения!

Переопределение методов

Иногда мы хотим изменить, как метод из родительского класса работает в нашем дочернем классе. Это называется переопределение метода. Давайте переопределим метод honk в нашем SportsCar:

class SportsCar extends Car {
// ... предыдущий код ...

honk() {
console.log("Vroom vroom!");
}
}

mySpeedster.honk();  // Выводит: Vroom vroom!

Теперь, когда мы вызываем honk() на SportsCar, он издает более спортивный звук!

Ключевое слово static

Ключевое слово static позволяет нам создавать свойства и методы, которые принадлежат классу самому себе, а не экземплярам класса. Давайте добавим статический метод к нашему классу Car:

class Car {
// ... предыдущий код ...

static numberOfWheels() {
return 4;
}
}

console.log(Car.numberOfWheels());  // Выводит: 4

Мы можем вызвать этот метод на классе Car сам по себе, не создавая экземпляра.

Оператор instanceof

Оператор instanceof позволяет нам проверять, является ли объект экземпляром определенного класса:

console.log(myCar instanceof Car);  // Выводит: true
console.log(mySpeedster instanceof SportsCar);  // Выводит: true
console.log(mySpeedster instanceof Car);  // Выводит: true
console.log(myCar instanceof SportsCar);  // Выводит: false

Это полезно, когда вам нужно проверить, с каким типом объекта вы работаете.

Скрытие данных

В TypeScript мы можем использовать модификаторы доступа, чтобы контролировать видимость членов класса.有三個访问修饰符：public, private и protected:

class BankAccount {
private balance: number;

constructor(initialBalance: number) {
this.balance = initialBalance;
}

public deposit(amount: number) {
this.balance += amount;
}

public withdraw(amount: number) {
if (amount <= this.balance) {
this.balance -= amount;
} else {
console.log("Insufficient funds!");
}
}

protected getBalance() {
return this.balance;
}
}

• private: Доступен только внутри класса.
• public: Доступен из anywhere (по умолчанию, если не указано).
• protected: Доступен внутри класса и его подклассов.

Классы и интерфейсы

Интерфейсы в TypeScript позволяют нам определять контракт для наших классов. Давайте создадим интерфейс для нашего класса Car:

interface Vehicle {
make: string;
model: string;
year: number;
honk(): void;
}

class Car implements Vehicle {
// ... реализация ...
}

Реализуя интерфейс, мы обеспечиваем, чтобы наш класс соответствовал определенной структуре.

Методы резюме

Вот резюме методов, которые мы рассмотрели в этом руководстве:

Метод	Описание
constructor()	Инициализирует новый экземпляр класса
honk()	Делает гудок автомобиля
race()	Имитирует гонку (для SportsCar)
static numberOfWheels()	Возвращает количество колес (для класса Car)
deposit()	Добавляет деньги на банковский счет
withdraw()	Удаляет деньги с банковского счета
getBalance()	Возвращает текущий баланс банковского счета

И вот вы уже сделали свои первые шаги в мир классов TypeScript. Помните, что практика makes perfect, так что не бойтесь экспериментировать с этими концепциями. Создавайте свои собственные классы, комбинируйте разные функции и, самое главное, получайте удовольствие от программирования! Кто знает, может быть, в следующий раз вы будете тем, кто teaches этот класс! ?

Credits: Image by storyset