Заметки про React(@ru_react_notes). Применение паттерна Стратегия в React При разработке React приложения бывает проблема, когда одна ч

Применение паттерна Стратегия в React При разработке React приложения бывает проблема, когда одна часть бизнес-логики реализована по частям в нескольких компонентах, хуках и функциях. У этой проблемы есть название “Стрельба дробью” (Shotgun Surgery). Это запах кода, в котором одно изменение затрагивает сразу несколько классов приложения. Один из вариантов решения этой проблемы – паттерн Стратегия. В блоге dev.to автор Хьюго Та поделился примером использования паттерна Стратегия при разработке компонента. В качестве примера – карточки с ценами. Если посетитель из определенной страны, то в карточке указывается цена в валюте его страны и возможная скидка. Для реализации такой бизнес-логики автор создал базовый абстрактный класс и имплементировал классы для разных стран.

abstract class PriceStrategy {
  protected country: Country = Country.AMERICA;
  protected currency: Currency = Currency.USD;
  protected discountRatio = 0;

  // --snip--
}

class JapanPriceStrategy extends PriceStrategy {
    constructor() {
      super();
      this.country = Country.JAPAN;
      this.currency = Currency.YEN;
      this.discountRatio = 0.2;
    }

    // --snip--
}

<PricingCard price={7669} strategy={new JapanPriceStrategy()} />

dev.to/itshugo…tern-enn