js装饰设计模式详解

装饰设计模式

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

结构图:

js装饰设计模式详解

接口

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;  }

登录后复制

相关推荐:

Node.js中通用基础设计模式实例分析

php设计模式之服务定位器模式实例详解

详解PHP设计模式之备忘录模式

以上就是js装饰设计模式详解的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2786414.html

(0)
上一篇 2025年3月8日 17:44:23
下一篇 2025年3月8日 17:44:30

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • 几个JavaScript异步加载相关问题

    默认的js是同步加载的,这里的“加载”可以理解成是解析、执行,而不是“下载”,在最新版本的浏览器中,浏览器对于代码请求的资源都是瀑布式的加载,而不是阻塞式的,但是js的执行总是阻塞的。这会引起什么问题呢?如果我的index页面要加载一些js…

    编程技术 2025年3月8日
    000
  • JS属性名加引号与不加引详解

    一般情况下属性名加引号和不加引号是都可以的,效果是一样的。本文主要和大家介绍了js声明对象时属性名加引号与不加引号的问题及解决方法,需要的朋友可以参考下,希望能帮助到大家。 var obj = {   name  : ‘你好’,   ‘ag…

    编程技术 2025年3月8日
    200
  • JavaScript如何严格判断NaN

    删除数组中的所有假值。 在JavaScript中,假值有false、null、0、”“、undefined 和 NaN。 对于NaN的判断,JS提供了函数isNaN()。但是使用isNaN()函数只能判断变量是否非数字,而无法判断变量值是否…

    编程技术 2025年3月8日
    200
  • javascript函数中的this的四种绑定形式

    一谈到this,很多让人晕晕乎乎的抽象概念就跑出来了,这里我就只说最核心的一点——函数中的this总指向调用它的对象,接下来的故事都将围绕这一点展开。 【故事】有一个年轻人叫”迪斯”(this),有一天,迪斯不小心穿…

    2025年3月8日 编程技术
    200
  • JS实现文字间歇循环滚动

    本文主要和大家介绍了js实现的文字间歇循环滚动效果,涉及javascript结合时间函数定时触发实现页面元素动态操作相关技巧,需要的朋友可以参考下,希望能帮助到大家。 具体代码如下: nbsp;html>  – 间歇循环滚动#box{…

    编程技术 2025年3月8日
    200
  • tween.js缓动补间动画算法详解

    本文主要和大家介绍了tween.js缓动补间动画示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧,希望能帮助到大家。 一、理解tween.js 如果看到上面的已经理解了,可以跳过下面的部分.下面为对Tween…

    编程技术 2025年3月8日
    200
  • nodejs和express搭建多人聊天室

    准备工作:新建一个文件夹 chatroom在终端输入以下命令,按照步骤npm(没装过的去官网安装下node和npm)会自动给你生成一个package.json文件 安装express和socket.io package.json文件如下: …

    2025年3月8日 编程技术
    200
  • NodeJS爬虫详解

    一、爬虫流程 我们最终的目标是实现爬取立马理财每日的销售额,并知道卖了哪些产品,每个产品又被哪些用户在什么时间点买的。首先,介绍下爬虫爬取的主要步骤: 1. 结构分析 我们要爬取页面的数据,第一步当然是要先分析清楚页面结构,要爬哪些页面,页…

    2025年3月8日
    200
  • js代理设计模式详解

    代理模式是常见的设计模式之一,是指不直接调用实际的对象,而是通过代理对象,来间接的调用实际的对象。 为什么要采用这种间接的形式来调用对象呢?一般是因为客户端不想直接访问实际的对象,或者访问实际的对象存在困难,因此通过一个代理对象来完成间接的…

    2025年3月8日
    200
  • JS内存管理实例讲解

    js有完善的内存处理机制,所以之前我们不用特别的去关注这块的实现。页面不快了,刷新一下就好了;浏览器卡顿,重启一下就ok。但是随着spa和移动app的流行,以及未来可能存在的pwa的实现,js内存可能成为新的内存瓶颈。 1.什么是内存泄漏 …

    2025年3月8日 编程技术
    200

发表回复

登录后才能评论