资讯专栏INFORMATION COLUMN

js设计模式 --- 装饰设计模式

zhoutk / 2466人阅读

摘要:装饰设计模式每种设都有其独特的应用场景和解决问题的方式装饰设计模式是动态的为对象添加新的功能是一种用于代替继承的技术,无需通过继承增加子类就能扩展对象的新功能。

装饰设计模式
每种设都有其独特的应用场景和解决问题的方式, 装饰设计模式是动态的为对象添加新的功能, 是一种用于代替继承的技术,无需通过继承增加子类就能扩展对象的新功能。使用对象的关联关系代替继承关系,更加灵活,同时避免类型体系的快速膨胀, 这种模式适合新添加的功能不足以用继承为代价解决问题的情况时使用 - 杀鸡焉用宰牛刀  ^_^

装饰设计模式: 动态地为一个对象添加一些额外的职责,若要扩展一个对象的功能,装饰者提供了比继承更有弹性的替代方案。

结构图:

接口

var Bicycle = new Interface("Bicycle", ["assemble", "wash", "repair", "getPrice"]);

对象类

var AcmeComfortCuiser = function(){
    
};
AcmeComfortCuiser.prototype = {
    assemble: function(){
        
    },
    wash: function(){
        
    },
    repair: function(){
        
    },
    getPrice: function(){
        
    }
}

装饰类

var BicycleDecorator = function(bicycle){
    Interface.ensureImplements(bicycle, Bicycle);
    this.bicycle = bicycle;
};
BicycleDecorator.prototype = {
    assemble: function(){
        return this.bicycle.assemble();
    },
    wash: function(){
        return this.bicycle.wash();
    },
    repair: function(){
        return this.bicycle.repair();
    },
    getPrice: function(){
        return this.bicycle.getPrice();
    }
}

拓展类

    var HeadlightDecorator = function(bicycle){
        BicycleDecorator.call(this, bicycle);
    };
    extend(HeadlightDecorator, BicycleDecorator);
    HeadlightDecorator.prototype.getPrice = function(){
        return this.bicycle.getPrice() + 15.00;
    }

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/107500.html

相关文章

  • JS或Jquery

    摘要:大潮来袭前端开发能做些什么去年谷歌和火狐针对提出了的标准,顾名思义,即的体验方式,我们可以戴着头显享受沉浸式的网页,新的标准让我们可以使用语言来开发。 VR 大潮来袭 --- 前端开发能做些什么 去年谷歌和火狐针对 WebVR 提出了 WebVR API 的标准,顾名思义,WebVR 即 web + VR 的体验方式,我们可以戴着头显享受沉浸式的网页,新的 API 标准让我们可以使用 ...

    CatalpaFlat 评论0 收藏0
  • js设计模式--模板方法模式

    摘要:前言本系列文章主要根据设计模式与开发实践整理而来,其中会加入了一些自己的思考。模板方法模式由两部分结构组成,第一部分是抽象父类,第二部分是具体的实现子类。 前言 本系列文章主要根据《JavaScript设计模式与开发实践》整理而来,其中会加入了一些自己的思考。希望对大家有所帮助。 文章系列 js设计模式--单例模式 js设计模式--策略模式 js设计模式--代理模式 js设计模式--迭...

    yuanxin 评论0 收藏0
  • JS设计模式入门和框架中的实践

    摘要:下面笔者就结合诸如的的里面的里面的来给大家简单介绍下设计模式在这些库语法和框架中的使用。笔者认为把设计模式单独抽象出来探讨,就和算法中抽象出来冒泡排序一样,是为了描述一种常用的。 本文为饥人谷讲师slashhuang原创文章。 在编写JS代码的过程中,运用一定的设计模式可以让我们的代码更加优雅、灵活。 下面笔者就结合诸如redux的subscribe、ES6的class、vue里面的$...

    lmxdawn 评论0 收藏0
  • JS设计模式入门和框架中的实践

    摘要:下面笔者就结合诸如的的里面的里面的来给大家简单介绍下设计模式在这些库语法和框架中的使用。笔者认为把设计模式单独抽象出来探讨,就和算法中抽象出来冒泡排序一样,是为了描述一种常用的。 本文为饥人谷讲师slashhuang原创文章 在编写JS代码的过程中,运用一定的设计模式可以让我们的代码更加优雅、灵活。 下面笔者就结合诸如redux的subscribe、ES6的class、vue里面的$d...

    ccj659 评论0 收藏0
  • js设计模式--组合模式

    摘要:文章系列设计模式单例模式设计模式策略模式设计模式代理模式设计模式迭代器模式设计模式发布订阅模式设计模式命令模式概念组合模式就是用小的子对象来构建更大的对象,而这些小的子对象本身也许是由更小的孙对象构成的。 前言 本系列文章主要根据《JavaScript设计模式与开发实践》整理而来,其中会加入了一些自己的思考。希望对大家有所帮助。 文章系列 js设计模式--单例模式 js设计模式--策略...

    blankyao 评论0 收藏0
  • [译]理解设计模式

    摘要:例如可以用构造函数实现单例模式。例如当这个构造函数被调用,它会检查是否存在。工厂模式工厂模式使用工厂方法创建对象,而不指定所创建对象的确切类或构造函数。虽然了解审设计模式很重要,但是不要过度使用它们。 By Sukhjinder Arora | Oct 16, 2018 原文 当你开始了一个新项目,你不会马上开始编写代码。第一步,你必须定义这个项目解决什么问题和适用范围,然后列出这个项...

    NeverSayNever 评论0 收藏0

发表评论

0条评论

zhoutk

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<