前端设计模式3

一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第7天，点击查看活动详情。

##装饰器模式 装饰器模式的定义：在不改变自身对象的的基础上，在程序运行期间给对象动态地添加方法，常见应用，react的高阶组件，或者react-dedux中的@connect或者自己定义一些高阶组件

Function.prototype.before = function (beforeFn) {
  var _this =this;
  return function () {
      beforeFn.call(_this,arguments);
      return _this.apply(_this,arguments)
  }
};

Function.prototype.after = function (beforeFn) {
    var _this =this;
    return function () {
       var ret =  _this.apply(_this,arguments)
       beforeFn.call(_this,arguments);
       return ret
    }
};

• ##外观模式
• 外观模式即让多个方法一起被调用涉及到兼容性，参数支持多格式，有很多这种代码，对外暴露统一的api，比如上面的$on,$off参数支持多个情况，对面只有一个函数，内部判断实现
• ##工厂模式
• **提供创建对象的接口，吧成员对象的创建工作转角给一个外部对象，好处在于对象质检的耦合(也就是相互影响)
• 常见例子，我们的弹窗或者Message的实例，就是典型的工厂模式
• ##建设者模式
• 和工厂模式相比，参与了更多的创建过程(就过程来说 只是工厂模式的加强版)
• ##迭代器模式
• 迭代器模式是指提供一种方法顺序访问一个聚合对象中的各个元素，而又不需要暴露该对象的内部表示，迭代器模式可以把迭代的过程从业务逻辑中分离处理，在使用迭代器模式之后，即使不关心独享的内部构造，也可以按顺序访问其中的每个元素
• es6支持有api支持这种模式比如 map ，foreach，some，filter，every
• ##备忘录模式
• 可以恢复到对象之前的某个状态，react或redux就有时间旅行模式，就算备忘录的一种
• 简单的说就是把每次更新的状态全部都记录下来，让用户可以反悔
• ##组合模式
• 定义：将对象组合成属性结构以表示'树形-整体'的层次结构。组合模式使得用户对单个对象和组合对象的使用具有一致性。 将一个复杂对象的构建与它的表示分离，使得同样的构建过程可以创建不同的表示。