JavaScript设计模式-17.装饰者模式(下)
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>javascript高级语法17-装饰者模式下</title>
</head>
<body>
<div id="demo2"> </div> <script type="text/javascript">
//装饰者可以用在类上,也可以用在函数上
function demo1(){
//写一个装饰者函数,函数的目的是把目标函数的返回值变成大写
function upperCase(fun){
return function(){
return fun().toUpperCase();
}
}
//被封装的函数
function getDate(){
return new Date().toString();
}
//执行装饰
var getDateCaps = upperCase(getDate);
document.write(getDate());
document.write("<br>")
document.write(getDateCaps());
/*如果原有的功能不适合你的项目,需要大量扩充原油功能
* 并且不想改变原有的接口,那么可以用装饰者模式。
*/
}
//demo1(); function demo2(){
//装饰者完成对函数性能测试的任务
var listBuilder = function(el,listSize){
this.el = document.getElementById(el);
this.size = listSize;
//创建列表
this.Buildlist = function(){
var root = document.createElement("ol");
this.el.appendChild(root);
for(var i=0;i<this.size;i++){
var li = document.createElement("li");
root.appendChild(li);
}
}
};
var list = new listBuilder("demo2",8000);
//list.Buildlist();
//利用装饰者检测函数执行的时间 var simpleProfiler = function(component){
this.component = component;
this.ListBuilder = function(){
var startDate = new Date().getTime();
this.component.Buildlist()
var endDate = new Date().getTime();
alert(endDate - startDate);
}
}
//new simpleProfiler(list).ListBuilder();
//改造为通用的装饰者,可以完成所有函数的效率测试。 var simpleProfiler2 = function(component){
this.component = component;
this.action = function(methodName){
var self= this;
var method = component[methodName];
//如果是函数那就进行装饰
if(typeof method == "function"){
var startDate = new Date().getTime();
method.apply(self.component,arguments);
var endDate = new Date().getTime();
alert(endDate - startDate);
}
}
} new simpleProfiler2(list).action("Buildlist"); }
demo2(); </script>
</body>
</html>
JavaScript设计模式-17.装饰者模式(下)的更多相关文章
- 再起航,我的学习笔记之JavaScript设计模式13(装饰者模式)
装饰者模式 装饰者模式(Decorator): 在不改变原对象的基础上,通过对其进行过包装拓展(添加属性高或者方法)使原有对象可以满足用户的更复杂需求. 如果现在我们有个需求,需要做一个提交表单,当我 ...
- Javascript设计模式之装饰者模式详解篇
一.前言: 装饰者模式(Decorator Pattern):在不改变原类和继承的情况下动态扩展对象功能,通过包装一个对象来实现一个新的具有原对象相同接口的新的对象. 装饰者模式的特点: 1. 在不改 ...
- JavaScript设计模式(装饰者模式)
一.模拟传统面向对象语言的装饰者模式: 假设我们在编写一个飞机大战的游戏,随着经验值的增加,我们操作的飞机对象可以升级成更厉害的飞机,一开始这些飞机只能发射普通的子弹,升到第二级时可以发射导弹,升到第 ...
- JavaScript设计模式(8)-装饰者模式
装饰者模式 1. 作用: 可用来透明地把对象包装在具有同样接口的另一对象之中,这样可以给一个方法添加一些行为,然后将方法调用传递给原始对象. 可用于为对象增加功能,用来代替大量子类. 装饰者对其组件进 ...
- JavaScript设计模式-16.装饰者模式(上)
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- javascript设计模式之装饰者模式
/* * 装饰者模式提供比继承更有弹性的替代方案 * 在不改变原构造函数的情况下,添加新的属性或功能 */ //需要装饰的类(函数) function Macbook() { this.cost = ...
- 学习javascript设计模式之装饰者模式
1.装饰者模式定义:给对象动态添加职责的方式称为装饰者(decorator)模式. js如何实现装饰者模式 通过保存原函数引用方式改写某函数 window.onload = function(){al ...
- Java 设计模式泛谈&装饰者模式和单例模式
设计模式(Design Pattern) 1.是一套被反复使用.多人知晓的,经过分类编目 的 代码设计经验总结.使用设计模式是为了可重用代码,让代码更容易维护以及扩展. 2.简单的讲:所谓模式就是得到 ...
- C#设计模式(9)——装饰者模式(Decorator Pattern)
一.引言 在软件开发中,我们经常想要对一类对象添加不同的功能,例如要给手机添加贴膜,手机挂件,手机外壳等,如果此时利用继承来实现的话,就需要定义无数的类,如StickerPhone(贴膜是手机类).A ...
随机推荐
- Template Method Design Pattern in Java
Template Method is a behavioral design pattern and it’s used to create a method stub and deferring s ...
- polymer技巧
1.添加一个div元素 我们完全可以自己造一个这样的东西出来,比如下面例子我们给 div 元素添加一个 is="demo-test" <script> var Poly ...
- prog1,2,3
1.第一版本程序Prog1:+ 给定一个数组,实现数组元素求和:具体要求:实现对一维数组(a[100])的所有元素相加运算.+ 数据准备:a)数组长度:100:b)数组数据来源:实验数据A列:1~10 ...
- 生成Webservice的两种方式(Axis2,CXf2.x)
一天之中,用了各种方式生成webservice,就是为了node.js能和程序顺利通信.最终还是用axis2成功了.工作基本完成了,现在可以总结一下. 关于生成方式,推荐使用eclipse,比较方便, ...
- [转载]WCF系列_分布式事务(下)
浏览到chnking的WCF的分布式事务处理不错,转载过来分享一下. 1. WCF分布式事务例子这里也用转账的例子说事.用户在系统A和系统B都有账户,账户间的资金可以互转,系统A的资金减少多少,系统B ...
- 安装git出现templates not found的问题
背景 goods.api需要在新机器上部署,该机器上没有安装git,需要安装git,查询git版本为2.4.5-1.el6 ,使用yum 一顿安装后,执行git clone命令告知warning: t ...
- ASP.NET MVC5实现伪静态
目录 1.什么是伪静态?为什么要实现伪静态? 2.实现APS.NET MVC伪静态的方式有哪些? 3.那么如何实现使用ASP.NET MVC5的伪静态呢? (1)在路由注册中启用特性路由 (2)为需要 ...
- asp.net 错误页面自定义
在我们上网浏览信息的时候,总会有出现404页面的时候,在我们开发的时候也可以自定义这些页面.刚回这次项目中也使用到了,就在网上找到一些方法,今天就把这些方法重新写一遍加深记忆. 在项目的web.con ...
- 考取RHCE认证的历程,总结的经验
昨天去考试的,今天下午结果出来了,达到了我的预期.成功的获取了RHCE认证,以后我也是有证的人咯~,开个玩笑. 其实去年的时候我就曾经想要去考取的,我原来一直以为考取RHCE认证时考题都是英文的呢?因 ...
- Aircrack-ng无线破解总结
过年回来家,奈何没网,实属无奈,只好看破解教程,看能否破出来.于是总结如下 测试环境在linux平台下,我用的是ubuntu环境.ubuntu安装可以直接用sudo apt-get install a ...