【D1n910】第 19 章 活诸葛 —— 策略模式
正常操作，正常分析，大家好，我是D1n910。
今天我继续来学习 《JavaScript 设计模式》的第四篇 行为型设计模式
这是一个连续的读书笔记，所以如果你之前的内容没有看的话，可以去看看（建议直接看书，当然书的例子都比较早了，是2015年之前的代码内容，过了六年了，前端发展了很多，比如类的声明可以直接用 Class 了）。
直接查看目录就可以查看到所有的系列文章啦。
这里再次感谢 《Javascript 设计模式》及其作者 张荣铭，专栏内容是在它的基础上生成的。
现在会觉得很多设计模式离我们有点遥远，是因为我们现在都在用大佬写好的框架吧，很多设计模式都包含在框架里了。
后面有机会的话，我希望我可以查看目前主流框架的源代码，然后进行讲解。
第四篇 行为型设计模式
行为型设计模式用于不同对象之间职责划分或算法抽象，行为型设计模式不仅仅涉及类和对象，还涉及类或对象之间的交流模式并加以实现。
第 19 章 活诸葛 —— 策略模式
策略模式（Strategy）：将定义的一组算法封装起来，使其相互之间可以替换。封装的算法具有一定的独立性，不会随着客户变化而变化。
公司的网站做促销活动，希望页面上商品价格能够按照不同的促销方式进行展示。
促销方式有四种
1、满 100 - 40
2、满 100 - 30
3、打九折
4、打八折
考虑可以把这些价格策略算法抽离出来放到一个对象中，这样不同的工程都能使用。
最终
var productList = [
{
name: '商品1',
price: 100.11,
discount: 'return40'
},
{
name: '商品2',
price: 45.11,
discount: 'return30'
},
{
name: '商品3',
price: 90.11,
discount: 'percent9'
},
{
name: '商品4',
price: 40.11,
discount: 'percent8'
}
]
var priceStrategy = function () {
// 内部算法对象
var strategy = {
return40: function (price) {
return +price - parseInt(price / 100) * 40;
},
return30: function (price) {
return +price - parseInt(price / 100) * 30;
},
percent9: function (price) {
return price * 100 * 90 / 10000;
},
percent8: function (price) {
return price * 100 * 80 / 10000;
}
}
return function (type, price) {
return strategy[type] && strategy[type](price)
}
}();
class ProductContainer {
constructor(productList) {
var container = document.createElement('ul');
for (let i of productList) {
var productLi = document.createElement('li');
productLi.innerHTML = '产品名称：' + i.name + ' ' + '原价格: ' + i.price + ' 现在价格: ' + priceStrategy(i.discount, i.price);
container.appendChild(productLi);
}
document.body.appendChild(container);
}
}
new ProductContainer(productList);
策略模式
优点：
1、封装了一组代码蔟，并且封装的代码之间相互独立，便于对算法的重复利用，提高了算法的复用率；
2、与继承相比，类上的算法不易改变，不易演化；
3、优化分支判断语句，使得算法更利于维护。
缺点：
1、想要选择哪种算法的决定权在用户，所以用户需要了解每个算法的实现，增加了使用成本；
2、算法之间相互独立，所以复发的算法处理相同逻辑的部分无法实现共享，就会造成资源的浪费。
本章 End
D1n910 于2021年02月26日在南山后海
