目的：

  • 遵循DRY原则

  • 减少代码量，节省开销

    什么是好的复用

  • 对象可以再重复使用，不用修改

  • 重复代码少

  • 模块功能单一

    提高可复用性的设计模式

    减少代码数量，高效复用代码

    桥接模式

    1. - 目的： 通过桥接代替耦合
    2. - 应用场景： 减少模块之间的耦合

    ```javascript / 有三种形状，每种形状都有三种颜色

function react(color){ showcolor(color); }

function circle(color){ showcolor(color); } function delta(color){ showcolor(color); } function showcolor(color){

}

// 红色， 绿色，黄色 // 需要一个红色的圆形 new circle(‘red’);

  1. 对于三种形状，每种形状有3种颜色的需求，可以不用创建9种不同颜色的不同形状。
  2. <a name="qgqqt"></a>
  3. ### 享元模式
  5.       - 目的： 减少对象/代码数量
  6.       - 应用场景： 当代码中创建了大量类似对象和类似的代码块
  7. ```javascript
  8. // 有一百种不同不同文字的弹窗，每种弹窗行为相同，但是文字和样式不同，我们没必要新建一百个弹窗对象
  9. function Pop(){
  11. }
  12. // 保留同样的行为
  13. Pop.prototype.action = function(){
  15. }
  16. Pop.prototype.show = function(){
  17.     // 显示弹窗
  18. }
  20. //提取出每个弹窗不同的部分作为一个外部数组
  21. var popArr = [
  22.     {text: "this is window1", style: [400, 400]},
  23.     {text: "this is window2", style: [400, 200]},
  24. ]
  25. var poper = new Pop();
  26. for(var i = 0; i < popArr.length; i++){
  27.     poper.show(popArr[i]);
  28. }
  1. 只需要一个类，不需要new一百次弹窗

  2. 这个类只保留所有弹窗共有的，每个弹窗不同的部分留作为一个公共享元

    创建高可复用性的代码

    模板方法模式

    • 目的： 定义一系列操作的骨架，简化后面类似操作的内容
    • 应用场景： 当项目中出现很多类似操作内容
      1. // 编写导航组件，有的带消息提示，有的是竖着，有的是横着
      2. function baseNav(){
      3. // 基础类，此处定下基本骨架
      4. }
      5. baseNav.prototype.action = function(fn){
      6. //特异性的处理，留出一个回调等待具体实现
      7. }
      导航组件多种多样，可能后面还会新增类型，那么我们不妨写一个基础的组件类，然后具体的实现，延迟到具体的使用时。

      javaScript 的组合和继承

      组合

      1、JavaScript最初没有专门的继承，所以最初JavaScript推崇函数式编程，然后进行统一组合桥接到一起。
      2、桥接模式可以看出组合的一种体现，组合的好处是耦合低，方便方法复用，方便扩展。

      继承

      1、在es6出现calss和extend，继承的方式多种多样，但是都是各有弊端。
      2、模板方法模式可以看出继承的一种体现，继承的好处是可以自动获得父类的内容与接口，方便统一化。
      缺点是不方便扩展
      如果能使用组合就不要使用继承