Modelul Bridge în TypeScript

Ce este

Șablonul Bridge împarte un singur concept în două dimensiuni independente, ca să poată varia separat. Forme și moduri de a le desena; mesaje și moduri de a le trimite.

Fără punte ajungi cu o clasă pentru fiecare combinație — VectorCircle, TextCircle, VectorSquare... — și lista se înmulțește. Cu puntea, o parte păstrează o interfață către cealaltă: orice formă funcționează cu orice renderer.

Exemplu: forme și renderere

2 renderere × 2 forme ar însemna 4 clase combinate. Aici avem o singură clasă Shape plus 2 clase de renderer, legate printr-un singur câmp de tip interfață — puntea.

Orice formă, orice renderer

Același cerc se desenează în două feluri doar pentru că păstrează un renderer diferit. Adăugarea unui renderer sau a unei forme înseamnă o singură clasă nouă, niciodată un rând întreg de combinații.

Scrie un program TypeScript care arată șablonul Bridge: o interfață Renderer cu o metodă draw(name) implementată de VectorRenderer și TextRenderer ca o dimensiune, și o clasă Shape care păstrează un nume plus un Renderer ca cealaltă dimensiune. Construiește un cerc cu fiecare renderer și un pătrat cu cel vectorial și afișează fiecare linie.

> Ieșire: program TypeScript și rezultatul capturat

Prompt

Scrie un program TypeScript care arată șablonul Bridge: o interfață Renderer cu o metodă draw(name) implementată de VectorRenderer și TextRenderer ca o dimensiune, și o clasă Shape care păstrează un nume plus un Renderer ca cealaltă dimensiune. Construiește un cerc cu fiecare renderer și un pătrat cu cel vectorial și afișează fiecare linie.

Ieșire: program TypeScript și rezultatul capturat

// O dimensiune: CUM se desenează.
interface Renderer {
  draw(name: string): string
}

class VectorRenderer implements Renderer {
  draw(name: string): string {
    return "desenez " + name + " cu linii vectoriale fine"
  }
}

class TextRenderer implements Renderer {
  draw(name: string): string {
    return "desenez " + name + " cu caractere text"
  }
}

// Cealaltă dimensiune: CE se desenează. Câmpul renderer este puntea.
class Shape {
  private name: string
  private renderer: Renderer

  constructor(name: string, renderer: Renderer) {
    this.name = name
    this.renderer = renderer
  }

  draw(): string {
    return this.renderer.draw(this.name)
  }
}

const shapes: Shape[] = [
  new Shape("cerc", new VectorRenderer()),
  new Shape("cerc", new TextRenderer()),
  new Shape("pătrat", new VectorRenderer())
]

for (const shape of shapes) {
  console.log(shape.draw())
}

Când să îl folosești

Folosește-l când observi explozia combinațiilor: fiecare tip nou de pe o axă obligă la clase noi pe cealaltă. Două axe independente — desparte-le.

Renunță la el când o dimensiune are exact o singură implementare. O punte către un singur mal este doar un ponton.

Avantaje și dezavantaje

Avantaje: cele două părți cresc independent; combinațiile vin gratuit; fiecare parte se poate testa singură.

Dezavantaje: mai multă indirectare de la început; recunoașterea din timp a celor două axe este cu adevărat grea — despărțirea prea devreme creează o abstractizare de care nu are nimeni nevoie.