TypeScript 中的策略模式

基础实现

1. 定义策略接口

// 策略接口interface PaymentStrategy {
  pay(amount: number): void;}

2. 实现具体策略类

// 信用卡支付策略class CreditCardPayment implements PaymentStrategy {
  private cardNumber: string;
  private name: string;
  constructor(cardNumber: string, name: string) {
    this.cardNumber = cardNumber;
    this.name = name;
  }
  pay(amount: number): void {
    console.log(`使用信用卡支付 $${amount}`);
    console.log(`卡号: ${this.cardNumber}, 持卡人: ${this.name}`);
  }}// PayPal支付策略class PayPalPayment implements PaymentStrategy {
  private email: string;
  constructor(email: string) {
    this.email = email;
  }
  pay(amount: number): void {
    console.log(`使用PayPal支付 $${amount}`);
    console.log(`邮箱: ${this.email}`);
  }}// 加密货币支付策略class CryptoPayment implements PaymentStrategy {
  private walletAddress: string;
  constructor(walletAddress: string) {
    this.walletAddress = walletAddress;
  }
  pay(amount: number): void {
    console.log(`使用加密货币支付 $${amount}`);
    console.log(`钱包地址: ${this.walletAddress}`);
  }}

3. 创建上下文类

// 支付上下文class PaymentContext {
  private strategy: PaymentStrategy;
  constructor(strategy: PaymentStrategy) {
    this.strategy = strategy;
  }
  // 设置支付策略
  setStrategy(strategy: PaymentStrategy): void {
    this.strategy = strategy;
  }
  // 执行支付
  executePayment(amount: number): void {
    this.strategy.pay(amount);
  }}

4. 使用示例

// 使用示例const paymentContext = new PaymentContext(new CreditCardPayment("1234-5678-9012", "张三"));// 使用信用卡支付paymentContext.executePayment(100);// 切换到PayPal支付paymentContext.setStrategy(new PayPalPayment("zhang@example.com"));paymentContext.executePayment(200);// 切换到加密货币支付paymentContext.setStrategy(new CryptoPayment("1A1zP1eP5QGefi2DMPTfTL5SLmv7DivfNa"));paymentContext.executePayment(300);

更复杂的示例：排序策略

// 排序策略接口interface SortStrategy<T> {
  sort(items: T[]): T[];}// 冒泡排序策略class BubbleSort<T> implements SortStrategy<T> {
  sort(items: T[]): T[] {
    console.log("使用冒泡排序");
    const arr = [...items];
    for (let i = 0; i < arr.length; i++) {
      for (let j = 0; j < arr.length - i - 1; j++) {
        if (arr[j] > arr[j + 1]) {
          [arr[j], arr[j + 1]] = [arr[j + 1], arr[j]];
        }
      }
    }
    return arr;
  }}// 快速排序策略class QuickSort<T> implements SortStrategy<T> {
  sort(items: T[]): T[] {
    console.log("使用快速排序");
    if (items.length <= 1) return items;
    
    const pivot = items[0];
    const left = [];
    const right = [];
    
    for (let i = 1; i < items.length; i++) {
      if (items[i] < pivot) {
        left.push(items[i]);
      } else {
        right.push(items[i]);
      }
    }
    
    return [...this.sort(left), pivot, ...this.sort(right)];
  }}// 排序上下文class Sorter<T> {
  private strategy: SortStrategy<T>;
  constructor(strategy: SortStrategy<T>) {
    this.strategy = strategy;
  }
  setStrategy(strategy: SortStrategy<T>): void {
    this.strategy = strategy;
  }
  sort(items: T[]): T[] {
    return this.strategy.sort(items);
  }}// 使用示例const numbers = [64, 34, 25, 12, 22, 11, 90];const sorter = new Sorter<number>(new BubbleSort<number>());console.log("排序前:", numbers);console.log("排序后:", sorter.sort(numbers));// 切换排序策略sorter.setStrategy(new QuickSort<number>());console.log("使用快速排序:", sorter.sort(numbers));

使用函数式编程的实现

TypeScript 也支持函数式风格的策略模式：

// 策略类型定义type DiscountStrategy = (amount: number) => number;// 具体策略函数const noDiscount: DiscountStrategy = (amount: number) => amount;const percentageDiscount = (percentage: number): DiscountStrategy => 
  (amount: number) => amount * (1 - percentage / 100);const fixedDiscount = (discount: number): DiscountStrategy => 
  (amount: number) => Math.max(0, amount - discount);// 上下文class ShoppingCart {
  private items: number[] = [];
  private discountStrategy: DiscountStrategy = noDiscount;
  addItem(price: number): void {
    this.items.push(price);
  }
  setDiscountStrategy(strategy: DiscountStrategy): void {
    this.discountStrategy = strategy;
  }
  getTotal(): number {
    const subtotal = this.items.reduce((sum, price) => sum + price, 0);
    return this.discountStrategy(subtotal);
  }}// 使用示例const cart = new ShoppingCart();cart.addItem(100);cart.addItem(50);cart.addItem(30);console.log("原价:", cart.getTotal()); // 180cart.setDiscountStrategy(percentageDiscount(10)); // 9折console.log("9折后:", cart.getTotal()); // 162cart.setDiscountStrategy(fixedDiscount(50)); // 减50console.log("减50后:", cart.getTotal()); // 130

策略模式的优点

1. 开闭原则：可以引入新策略而不修改现有代码
2. 消除条件语句：避免大量的 if-else 或 switch-case 语句 算法复用：可以在不同的上下文中复用策略

   测试友好：每个策略都可以独立测试

   https://zq.zhaopin.com/moment/67729575

   https://zq.zhaopin.com/moment/67729567

   https://zq.zhaopin.com/moment/67729540

   https://zq.zhaopin.com/moment/67729535

   https://zq.zhaopin.com/moment/67729451

   https://zq.zhaopin.com/moment/67729399

   https://zq.zhaopin.com/moment/67729386

   https://zq.zhaopin.com/moment/67729333

   https://zq.zhaopin.com/moment/67729321

   https://zq.zhaopin.com/moment/67729307

   https://zq.zhaopin.com/moment/67729306

   https://zq.zhaopin.com/moment/67729303

   https://zq.zhaopin.com/moment/67729266

   https://zq.zhaopin.com/moment/67729239

   https://zq.zhaopin.com/moment/67729219

   https://zq.zhaopin.com/moment/67729206

   https://zq.zhaopin.com/moment/67729161

   https://zq.zhaopin.com/moment/67729136

   https://zq.zhaopin.com/moment/67729091

适用场景

策略模式是非常实用的设计模式，特别适合处理需要灵活切换行为的场景。