05-提高可扩展性

适配器模式

当面临两个新老模块间接口api不匹配，可以用适配来转化api

// 示例：参数转换
// 后台接口返回数据格式：[{"day": "周一","uv": 6300 },{"day": "周二","uv": 7100},  ...]
// echart图表需要格式：
//   轴的数据 ["周二", "周二", "周三"， "周四"， "周五"， "周六"， "周日"] 
//   坐标点的数据
//x轴适配器
function echartXAxisAdapter(res) {
  return res.map(item => item.day);
}

//坐标点适配器
function echartDataAdapter(res) {
  return res.map(item => item.uv);
}

JavaScript设计模式——适配器模式 (opens new window)

装饰者模式

当老的方法，不方便去直接修改，可以通过装饰者模式来增加功能

// 示例: 给按钮操作后加提示
var _fn = DeleteButton.onclick;
// 装饰函数
DeleteButton.onclick = function(){
    _fn.apply(this, arguments);
    //添加处理
    console.log("...");
}

命令模式

向某些对象发送请求，但是并不知道被请求的操作具体是什么，所以我们希望以一种松耦合的方式来设计程序，使得请求发送者和接收者之间能够消除彼此之间的耦合关系；而我们的这种松耦合的方式就是命令模式；

解耦实现与具体命令，让实现端和命令端扩展的都更轻松

// 示例
const commander = (function(){
    var action = {
        add1: function(){},
        add2: function(){},
        add3: function(){},
    }
    return function(){
        return action[name] && action[name].apply( action, [].slice.call(arguments, 1) );
    }
})()

commander("add1")
commander("add2")

观察者模式

目的：减少对象间的耦合，来提高扩展性 应用场景：当两个模块直接沟通会增加他们的耦合性时，所以不方便直接沟通

职责链模式

目的： 为了方便我们以后加入新操作，或者去掉某个操作，形成一个链条 应用场景： 当面临一个半成品需求的时候