返回

объектно-ориентированное программирование (ООП) в JS: базовые концепции и реализация на практике

前端

Введение

Объектно-ориентированное программирование (ООП) - это стиль программирования, который позволяет разбивать сложные задачи на более мелкие, более управляемые части, называемые объектами. Каждый объект представляет собой автономный компонент, содержащий данные и методы, необходимые для выполнения определенного набора задач. Объекты взаимодействуют друг с другом, обмениваясь сообщениями, для выполнения более крупных задач.

Основные концепции ООП

Классы

Класс - это шаблон для создания объектов. Он определяет структуру и поведение объектов, которые будут созданы на его основе. Классы в JavaScript объявляются с помощью ключевого слова class.

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  greet() {
    console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
  }
}

Объекты

Объекты создаются на основе классов с помощью оператора new. Объекты наследуют свойства и методы класса, на основе которого они созданы.

const person1 = new Person('John', 30);
const person2 = new Person('Mary', 25);

person1.greet(); // Hello, my name is John and I am 30 years old.
person2.greet(); // Hello, my name is Mary and I am 25 years old.

Инкапсуляция

Инкапсуляция - это принцип ООП, который позволяет скрывать внутренние детали объекта от внешнего мира. Это достигается путем объявления некоторых свойств и методов как private (частных) или protected (защищенных).

class Person {
  #name; // приватное свойство
  age; // публичное свойство

  constructor(name, age) {
    this.#name = name;
    this.age = age;
  }

  greet() {
    console.log(`Hello, my name is ${this.#name} and I am ${this.age} years old.`);
  }
}

const person1 = new Person('John', 30);
person1.greet(); // Hello, my name is John and I am 30 years old.

// Пытаемся получить доступ к приватному свойству #name
console.log(person1.#name); // Ошибка: недоступное свойство

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

Наследование - это принцип ООП, который позволяет создавать новые классы на основе существующих классов. Новый класс, называемый производным классом, наследует свойства и методы базового класса.

class Employee extends Person {
  constructor(name, age, jobTitle) {
    super(name, age); // вызываем конструктор базового класса
    this.jobTitle = jobTitle;
  }

  work() {
    console.log(`I am ${this.name} and I am a ${this.jobTitle}.`);
  }
}

const employee1 = new Employee('John', 30, 'Software Engineer');
employee1.greet(); // Hello, my name is John and I am 30 years old.
employee1.work(); // I am John and I am a Software Engineer.

Полиморфизм

Полиморфизм - это принцип ООП, который позволяет объектам разных классов вести себя по-разному, когда вызывается один и тот же метод. Это достигается путем переопределения методов в производных классах.

class Animal {
  constructor(name) {
    this.name = name;
  }

  speak() {
    console.log(`I am an animal and my name is ${this.name}.`);
  }
}

class Dog extends Animal {
  speak() {
    console.log(`Woof! I am a dog and my name is ${this.name}.`);
  }
}

class Cat extends Animal {
  speak() {
    console.log(`Meow! I am a cat and my name is ${this.name}.`);
  }
}

const dog1 = new Dog('Rex');
const cat1 = new Cat('Fluffy');

dog1.speak(); // Woof! I am a dog and my name is Rex.
cat1.speak(); // Meow! I am a cat and my name is Fluffy.

Абстракция

Абстракция - это принцип ООП, который позволяет скрывать сложные детали реализации объекта от внешнего мира. Это достигается путем создания абстрактных классов и методов, которые определяют интерфейс объекта, не раскрывая его внутренние детали.

abstract class Animal {
  constructor(name) {
    this.name = name;
  }

  abstract speak(); // абстрактный метод
}

class Dog extends Animal {
  speak() {
    console.log(`Woof! I am a dog and my name is ${this.name}.`);
  }
}

class Cat extends Animal {
  speak() {
    console.log(`Meow! I am a cat and my name is ${this.name}.`);
  }
}

const dog1 = new Dog('Rex');
const cat1 = new Cat('Fluffy');

dog1.speak(); // Woof! I am a dog and my name is Rex.
cat1.speak(); // Meow! I am a cat and my name is Fluffy.

// Пытаемся создать объект абстрактного класса Animal
const animal1 = new Animal('Animal'); // Ошибка: абстрактный класс нельзя инициализировать

Заключение

В данной статье мы рассмотрели основные концепции объектно-ориентированного программирования (ООП) в JavaScript. Мы узнали, что такое классы, объекты, инкапсуляция, наследование, полиморфизм и абстракция, а также увидели, как реализовать их на практике. ООП - мощный инструмент для написания структурированного и читаемого кода, поэтому я рекомендую вам продолжать изучать и применять его в ваших проектах.