前端设计模式--混入模式和修饰模式

混入模式(Mixin)

混入模式的目的是为了函数复用,丰富一些需要使用这些复用函数的类

var Car = function(settings) {
      this.modal = settings.modal || 'no';
    }
    var Mixin = function() {};
    Mixin.prototype = {
      driveForword: function() {
        console.log('--向前')
      },
      driveBackward: function() {
        console.log('--向后')
      },
      driveSideways: function() {
        console.log('靠边')
      }
    };
    function augment(receivingClass, givingClass) {
      if (arguments[2]) {
        for (let i = 2; i<arguments.length;i++) {
          receivingClass.prototype[arguments[i]] = givingClass.prototype[arguments[i]];
        }
      }
    }
    // 混入模式目的是函数复用,丰富一些需要这些复用函数的类
    augment(Car, Mixin, 'driveForword', 'driveBackward');
    var carObj = new Car({
      modal: '自动挡'
    });
    carObj.driveForword();
    carObj.driveBackward();

修饰模式

修饰模式主要是对构造函数的实例进行修改

function MacBook() {
      this.cost = function() {
        return 997;
      }
      this.screenSize = function() {
        return 11.6
      }
    }
    // 装饰器1 主要修改的是类的实例 不改变原类的构造函数
    function memory( macbook ) {
      var v = macbook.cost();
      macbook.cost = function() {
        return v + 1000;
      };
    }
    // 装饰器2
    function engraving( macbook ){
      var v = macbook.cost();
      macbook.cost = function(){
        return v + 200;
      };
    }
    var mb = new MacBook();
    memory( mb );
    console.log( mb.cost());
    engraving( mb );
    console.log(mb.cost());
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Swift1> Swift和OC的区别1.1> Swift没有地址/指针的概念1.2> 泛型1.3> 类型严谨 对...
    cosWriter阅读 11,171评论 1 32
  • 这是16年5月份编辑的一份比较杂乱适合自己观看的学习记录文档,今天18年5月份再次想写文章,发现简书还为我保存起的...
    Jenaral阅读 2,910评论 2 9
  • 第3章 基本概念 3.1 语法 3.2 关键字和保留字 3.3 变量 3.4 数据类型 5种简单数据类型:Unde...
    RickCole阅读 5,281评论 0 21
  • 简介 JavaScript是一门灵活的语言,早些年被认为是玩具式的语言,只能做一点为网页涂脂抹粉的小差事。项目工程...
    DHFE阅读 488评论 0 0
  •   面向对象(Object-Oriented,OO)的语言有一个标志,那就是它们都有类的概念,而通过类可以创建任意...
    霜天晓阅读 2,172评论 0 6