Розуміння шаблону моста: відокремлення абстракції та реалізації

Bridge Pattern (Шаблон моста) — це структурний шаблон проєктування, який відокремлює абстракцію (що ви робите) від її реалізації (як ви це робите), дозволяючи обом елементам змінюватися незалежно один від одного. Це елегантне рішення для уникнення накопичення класів при роботі з множинними вимірами змін у системі.

У цій статті ми розглянемо шаблон моста через знайомий приклад, глибше зрозуміємо його призначення і надамо реалізацію на TypeScript, щоб закріпити ваше розуміння.

Зміст

1. Опис шаблону моста
2. Сценарій: Розуміння проблеми
3. Реальні проєкти, що використовують шаблон моста

1. Опис шаблону моста

Шаблон моста відокремлює абстракцію (високорівневий контроль) від її реалізації (деталі низького рівня). Це відокремлення дає змогу абстракції та реалізації розвиватися незалежно одна від одної, зменшуючи жорсткість тісно пов’язаного коду та підвищуючи гнучкість і масштабованість.

2. Сценарій: Розуміння проблеми

Уявіть компанію, яка виготовляє транспортні засоби. Кожен транспортний засіб може мати різні типи двигунів (наприклад, бензиновий, дизельний, електричний). Без гнучкої архітектури вам доведеться створювати клас для кожної комбінації типу транспортного засобу та типу двигуна, що призведе до величезної й незручної бази коду.

Наприклад:

• CarWithPetrolEngine
• CarWithDieselEngine
• TruckWithElectricEngine

Шаблон моста вирішує цю проблему, відокремлюючи абстракцію транспортного засобу від реалізації двигуна, дозволяючи комбінувати їх динамічно без створення надмірної кількості класів.

Реалізація на TypeScript

Ось як можна реалізувати шаблон моста на TypeScript:

 // Інтерфейс реалізатора  
interface Engine {  
  start(): string;  
}  

// Конкретні реалізатори  
class PetrolEngine implements Engine {  
  start(): string {  
    return "Запуск бензинового двигуна";  
  }  
}  

class DieselEngine implements Engine {  
  start(): string {  
    return "Запуск дизельного двигуна";  
  }  
}  

class ElectricEngine implements Engine {  
  start(): string {  
    return "Запуск електричного двигуна";  
  }  
}  

// Абстракція  
abstract class Vehicle {  
  protected engine: Engine;  

  constructor(engine: Engine) {  
    this.engine = engine;  
  }  

  abstract operate(): string;  
}  

// Уточнена абстракція  
class Car extends Vehicle {  
  operate(): string {  
    return `Автомобіль працює: ${this.engine.start()}`;  
  }  
}  

class Truck extends Vehicle {  
  operate(): string {  
    return `Вантажівка працює: ${this.engine.start()}`;  
  }  
}  

// Код клієнта  
const petrolCar = new Car(new PetrolEngine());  
console.log(petrolCar.operate());  

const electricTruck = new Truck(new ElectricEngine());  
console.log(electricTruck.operate());

Вивід:  
Автомобіль працює: Запуск бензинового двигуна  
Вантажівка працює: Запуск електричного двигуна

3. Реальні проєкти, що використовують шаблон моста

1. Системи рендерингу графіки: відокремлення форм (наприклад, коло, прямокутник) від логіки рендерингу (наприклад, OpenGL, DirectX) для забезпечення гнучкості.
2. Системи керування пристроями: абстрагування пристроїв (наприклад, пульти дистанційного керування) від об’єктів, які вони контролюють (наприклад, телевізори, проектори).

Висновки

Використовуючи шаблон моста, ви можете спростити управління кодом, зменшити дублювання та створювати системи, які достатньо гнучкі, щоб адаптуватися до змін.

У наступній статті нашої серії Learn Design Patterns ми розглянемо Composite Pattern (Шаблон складу). Залишайтеся з нами!

Перекладено з: Understanding the Bridge Pattern: Decoupling Abstraction and Implementation