Skip to content

Практическая работа №8

Основные теоретические положения

Section titled “Основные теоретические положения”

1. Объявление класса

class User {
constructor(name, age) {
this.name = name;
this.age = age;
}
showInfo() {
console.log(
`${this.name}, ${this.age}`
);
}
}

Создание экземпляра:

const user = new User("Иван", 20);
user.showInfo();

2. Конструктор

Метод constructor() выполняется при создании экземпляра.

class Product {
constructor(id, name, price) {
this.id = id;
this.name = name;
this.price = price;
}
}

Каждый экземпляр получает собственные значения свойств.


3. Методы класса

class Product {
constructor(name, price) {
this.name = name;
this.price = price;
}
changePrice(newPrice) {
if (newPrice > 0) {
this.price = newPrice;
}
}
showInfo() {
console.log(
`${this.name}: ${this.price} руб.`
);
}
}

Методы, объявленные в классе, фактически находятся в прототипе класса.

Проверка:

console.log(
Object.getPrototypeOf(
new Product("Мышь", 1500)
) === Product.prototype
);

4. Наследование через extends

class User {
constructor(name) {
this.name = name;
}
showInfo() {
console.log(this.name);
}
}
class Admin extends User {
}

Экземпляр Admin получает доступ к методам User.


5. Вызов базового конструктора через super()

class Admin extends User {
constructor(name, permissions) {
super(name);
this.permissions = permissions;
}
}

В производном классе super() должен быть вызван до обращения к this.


6. Переопределение метода

class Admin extends User {
showInfo() {
console.log(
`Администратор: ${this.name}`
);
}
}

Метод производного класса заменяет поведение, унаследованное от базового.


7. Вызов метода базового класса

class Admin extends User {
showInfo() {
super.showInfo();
console.log("Расширенные права");
}
}

super.method() позволяет использовать реализацию родительского класса.


8. Несколько экземпляров и массив объектов

const users = [
new User("Иван"),
new Admin("Анна", ["users", "settings"]),
];

Все экземпляры можно обрабатывать в одном цикле:

for (const user of users) {
user.showInfo();
}

При этом будет вызван метод, соответствующий фактическому типу объекта.


9. Классы всё равно используют прототипы

const admin = new Admin("Анна", []);
console.log(
Object.getPrototypeOf(admin) === Admin.prototype
);
console.log(
Object.getPrototypeOf(Admin.prototype)
=== User.prototype
);

Синтаксис class делает описание объектной модели удобнее, но механизм наследования остаётся прототипным.


10. Наследование и композиция

Не каждое отношение между сущностями означает наследование.

Например:

Admin является User

может быть наследованием.

Но:

Order содержит Customer

лучше описывать как композицию:

class Order {
constructor(id, customer) {
this.id = id;
this.customer = customer;
}
}

Объект customer является частью объекта заказа, но заказ не является разновидностью клиента.

Задания для выполнения

Section titled “Задания для выполнения”

Часть 1. Исследование классов

Выполните задания 1–4 полностью.


Задание 1.1. Класс и экземпляры

Создайте класс:

class Product {
constructor(id, name, price) {
// ...
}
showInfo() {
// ...
}
changePrice(newPrice) {
// ...
}
}

Создайте три экземпляра.

Проверьте изменение цены и выведите все объекты.


Задание 1.2. Проверка прототипной природы класса

Для одного экземпляра выполните:

Object.getPrototypeOf(product)
Object.getPrototypeOf(product) === Product.prototype
Object.hasOwn(product, "name")
Object.hasOwn(product, "showInfo")

Объясните полученные результаты.


Задание 1.3. Наследование

Создайте:

class DigitalProduct extends Product {
constructor(
id,
name,
price,
fileSize
) {
// ...
}
showInfo() {
// ...
}
}

Используйте super().

Переопределите showInfo() и внутри него вызовите:

super.showInfo();

Задание 1.4. Единый массив экземпляров

Создайте массив:

const products = [
new Product(...),
new DigitalProduct(...),
new Product(...),
];

В цикле вызовите для каждого:

product.showInfo();

Объясните, почему для разных объектов выполняется разная реализация метода.

Часть 2. Комплексное индивидуальное задание

Section titled “Часть 2. Комплексное индивидуальное задание”

Вариант 1. Пользователи информационной системы

Классы:

User
Admin

User:

id
name
active

Методы:

showInfo()
activate()
deactivate()

Admin:

permissions

Дополнительные методы:

addPermission()
showPermissions()

Переопределите showInfo().

Программа должна позволять создавать пользователей, искать по id, изменять активность и выводить список администраторов.


Вариант 2. Система сетевых устройств

Классы:

Device
Router

Device:

id
name
online

Методы:

showInfo()
turnOn()
turnOff()

Router:

ip
connectedDevices

Добавьте:

connectDevice()

Переопределите showInfo().


Вариант 3. Система транспорта

Классы:

Vehicle
Car

Vehicle:

id
brand
speed

Методы:

showInfo()
accelerate()
stop()

Car:

fuel

Добавьте:

refuel()

Переопределите accelerate() так, чтобы движение было невозможно при отсутствии топлива.


Вариант 4. RPG-система

Классы:

Character
Warrior

Character:

name
health
level

Методы:

showInfo()
takeDamage()
heal()

Warrior:

armor

Переопределите takeDamage().

Добавьте взаимодействие с массивом персонажей и возможность выбрать цель через prompt().


Вариант 5. Каталог товаров

Классы:

Product
DigitalProduct

Product:

id
name
price

Методы:

showInfo()
changePrice()

DigitalProduct:

fileSize
downloadLink

Добавьте:

getDownloadInfo()

Переопределите showInfo().


Вариант 6. Система технической поддержки

Классы:

Ticket
Incident

Ticket:

id
title
status

Методы:

showInfo()
changeStatus()

Incident:

priority

Добавьте:

isCritical()

Переопределите showInfo().

Реализуйте поиск заявки и изменение статуса через меню.


Вариант 7. Банковская система

Классы:

Account
PremiumAccount

Account:

id
owner
balance

Методы:

showInfo()
deposit()
withdraw()

PremiumAccount:

cashbackPercent

Добавьте:

calculateCashback()

Переопределите withdraw() или showInfo().

Не допускайте отрицательный баланс.


Вариант 8. Учёт сотрудников

Классы:

Employee
Manager

Employee:

id
name
salary

Методы:

showInfo()
changeSalary()

Manager:

department
bonus

Добавьте:

calculateIncome()

Переопределите showInfo().


Вариант 9. Файловая система

Классы:

FileItem
VideoFile

FileItem:

id
name
size

Методы:

showInfo()
rename()

VideoFile:

duration
resolution

Добавьте:

getVideoInfo()

Переопределите showInfo().


Вариант 10. Система бронирования

Классы:

Booking
VipBooking

Booking:

id
guest
price

Методы:

showInfo()
changePrice()

VipBooking:

discount
service

Добавьте:

calculateFinalPrice()

Переопределите showInfo() и используйте super.showInfo().

Требования к результату

Section titled “Требования к результату”

Программа должна:

  • использовать современный синтаксис class;
  • содержать базовый и производный классы;
  • использовать extends и super;
  • содержать переопределение метода;
  • использовать массив экземпляров;
  • выполнять поиск и изменение данных;
  • содержать интерактивное меню;
  • проверять ошибочный ввод;
  • демонстрировать различие между собственными свойствами экземпляра и методами его прототипа;
  • не создавать бессмысленные иерархии только ради использования наследования.
  1. Для чего используется class?
  2. Что выполняет constructor()?
  3. Где фактически располагаются методы класса?
  4. Как создаётся экземпляр класса?
  5. Что делает extends?
  6. Для чего используется super()?
  7. Почему в производном конструкторе super() вызывается до обращения к this?
  8. Как вызвать метод базового класса?
  9. Что называется переопределением метода?
  10. Что произойдёт при вызове переопределённого метода у производного объекта?
  11. Можно ли хранить экземпляры разных связанных классов в одном массиве?
  12. Почему вызов одного и того же метода может приводить к разному поведению?
  13. Используют ли классы JavaScript прототипы?
  14. Как проверить прототип экземпляра класса?
  15. Как связаны Child.prototype и Parent.prototype?
  16. Чем классовый синтаксис отличается от функции-конструктора?
  17. Чем наследование отличается от композиции?
  18. В каких случаях отношение между сущностями не следует реализовывать через extends?
  19. Почему объектная модель должна отражать смысл предметной области?
  20. Как №7 и №8 связаны между собой?

Рекомендуемая литература

Section titled “Рекомендуемая литература”
  1. MDN Web Docs — Classes
  2. MDN Web Docs — extends
  3. MDN Web Docs — super
  4. MDN Web Docs — Inheritance and the prototype chain
  5. JavaScript.info — Class basic syntax
  6. JavaScript.info — Class inheritance