学习JavaScript设计模式(策略模式)

学习JavaScript设计模式之策略模式

什么是策略模式？
策略模式是一种行为设计模式，它能让你定义一系列算法，将它们封装到一个个独立的类中，可以使它们相互替换。策略模式使得算法可以独立于使用它们的客户端而变化。

在JavaScript中，策略模式通常是通过定义不同的函数来实现的。根据需要，你可以将算法添加到一个对象中，然后把这个对象传递给执行某个方法的函数。

策略模式的优点

• 可以在不修改现有客户端代码的情况下添加新的算法。
• 可以使算法的类层次结构更加平坦并且易于理解和维护。
• 可以封装算法切换的复杂性。

策略模式的缺点

• 如果算法数量过多，不同策略类之间的联系变得更为紧密。
• 客户端必须了解所有的策略以及它们之间的不同点，才能进行正确的选择。

策略模式的代码示例

下面是一个例子，将折扣策略改变为一个单独的策略对象：

const strategies = {
  regular(price) {
    return price;
  },
  premium(price) {
    return price * 0.85;
  }
};

function calculatePrice(strategy, price) {
  return strategies[strategy](price);
}

console.log(calculatePrice('regular', 100)); // 100
console.log(calculatePrice('premium', 100)); // 85

在这个例子中，我们定义了一个包含两个算法的对象：常规折扣和高级折扣。calculatePrice函数接受折扣策略的名称以及商品价格作为参数。然后它根据传入的策略从strategies对象中获取算法函数，并对价格参数进行处理。最后，它返回在算法函数中计算得到的结果。

接下来，我们展示如何使用策略模式修改一个餐厅订单的菜单：

const menus = {
  breakfast: {
    name: 'Pancakes',
    price: 8.5
  },
  lunch: {
    name: 'Burger',
    price: 11
  },
  dinner: {
    name: 'Soup',
    price: 6
  }
};

const strategies = {
  vegetarian(menus) {
    const result = {};
    Object.keys(menus).forEach(key => {
      if (menus[key].name.includes('Burger')) {
        result[key] = { ...menus[key], name: menus[key].name.replace('Burger', 'Veggie Burger') };
      } else {
        result[key] = menus[key];
      }
    });
    return result;
  },
  diet(menus) {
    const result = {};
    Object.keys(menus).forEach(key => {
      result[key] = { ...menus[key], price: menus[key].price * 0.9 };
    });
    return result;
  }
};

console.log(strategies.vegetarian(menus));
console.log(strategies.diet(menus));

在这个示例中，我们定义了一个包含三个菜品的菜单对象。然后，我们定义了两个策略：vegetarian和diet。vegetarian在菜单中找到包含“Burger”字样的菜品，并将它们替换为“Veggie Burger”。diet减少了菜单中所有菜品的价格。

随后我们使用菜单对象和两个策略来分别执行计算机菜谱和低卡路里菜谱。

这就是使用JavaScript设计模式之策略模式的基本流程，希望对您有所帮助。