<!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设计模式-18.享元模式的更多相关文章

  1. JavaScript设计模式(9)-享元模式

    享元模式 1. 介绍 一种优化模式 适合解决因创建大量类似对象而累积性能问题 javaScript 代码可能很快就用光浏览器的内容,通过把大量独立对象转化为少量共享对象,可以降低运行 Web 应用所需 ...

  2. 再起航，我的学习笔记之JavaScript设计模式16(享元模式)

    ### 享元模式 **享元模式(Flyweight):** 运用共享技术有效地支持大量的细粒度的对象,避免对象间拥有相同内容造成多余的开销. 上回我们在组合模式中创建了文章列表类,这次我们要向不同的文 ...

  3. 深入理解JavaScript系列（37）：设计模式之享元模式

    介绍 享元模式(Flyweight),运行共享技术有效地支持大量细粒度的对象,避免大量拥有相同内容的小类的开销(如耗费内存),使大家共享一个类(元类). 享元模式可以避免大量非常相似类的开销,在程序设 ...

  4. python设计模式之享元模式

    python设计模式之享元模式 由于对象创建的开销,面向对象的系统可能会面临性能问题.性能问题通常在资源受限的嵌入式系统中出现,比如智能手机和平板电脑.大型复杂系统中也可能会出现同样的问题,因为要在其 ...

  5. 乐在其中设计模式(C#) - 享元模式(Flyweight Pattern)

    原文:乐在其中设计模式(C#) - 享元模式(Flyweight Pattern) [索引页][源码下载] 乐在其中设计模式(C#) - 享元模式(Flyweight Pattern) 作者:weba ...

  6. 设计模式之享元模式(Flyweight)摘录

    23种GOF设计模式一般分为三大类:创建型模式.结构型模式.行为模式. 创建型模式抽象了实例化过程,它们帮助一个系统独立于怎样创建.组合和表示它的那些对象.一个类创建型模式使用继承改变被实例化的类,而 ...

  7. 【php设计模式】享元模式

    享元模式其实就是共享独享模式,减少重复实例化对象的操作,从而将实例化对象造成的内存开销降到最低. 享元模式尝试重用现有的同类对象,如果未找到匹配的对象,则创建新对象.我们将通过创建 5 个对象来画出 ...

  8. 【GOF23设计模式】享元模式

    来源:http://www.bjsxt.com/ 一.[GOF23设计模式]_享元模式.享元池.内部状态.外部状态.线程池.连接池 package com.test.flyweight; /** * ...

  9. JS常用的设计模式(16)—— 享元模式

    享元模式主要用来减少程序所需的对象个数. 有一个例子, 我们这边的前端同学几乎人手一本<JavaScript权威指南>. 从省钱的角度讲, 大约三本就够了. 放在部门的书柜里, 谁需要看的 ...

随机推荐

  1. Tomcat 系统架构与设计模式2

    门面设计模式 门面设计模式在 Tomcat 中有多处使用,在 Request 和 Response 对象封装中.Standard Wrapper 到 ServletConfig 封装中.Applica ...

  2. 使用VPD解决EBS中信息屏蔽问题

    本文描述的是2005年在一个项目中采用Oracle VPD技术解决同一个OU下按照不同办事处屏蔽销售订单的解决方案. VPD技术提供了数据库对象(表,同义词,视图)行级别访问的控制.关于VPD更多的信 ...

  3. [20190423]oradebug peek测试脚本.txt

    [20190423]oradebug peek测试脚本.txt --//工作测试需要写一个oradebug peek测试脚本,不断看某个区域内存地址的值. 1.环境: SCOTT@book> @ ...

  4. 介绍 ASP.NET Identity - ASP.NET 应用程序的成员身份认证系统

    ASP.NET Identity 是构建 ASP.NET web 应用程序的一种新的身份认证系统.ASP.NET Identity 可以让您的应用程序拥有登录功能,并可以轻松地自定义登录用户的相关数据 ...

  5. easyui 导出 excel

    <div style="margin-bottom:5px" id="tb"> <a href="#" class=&qu ...

  6. Volo.Abp.EntityFrameworkCore.MySQL 使用

    创建新项目 打开 https://cn.abp.io/Templates ,任意选择一个项目类型,然后创建项目,我这里创建了一个Web Api 解压项目,还原Nuget,项目目录如下: 首先我们来查看 ...

  7. JgrId 无数据返回设置

    在addJSONData方法中 while (i < len) { 前增加以下代码 ) { rowData.push('<tr role="row" id=" ...

  8. 在VC++中执行VBS代码

    此代码来自https://blog.csdn.net/zhu2695/article/details/13770671 作者: zhu2695   时间:2013年10月31日 13:08:41 #i ...

  9. 【12c OCP】最新CUUG OCP-071考试题库（49题）

    49.(11-1) choose the best answer Examine the structure of the SHIPMENTS table: You want to generate ...

  10. json相关知识

    整理json相关知识: 1.for in 循环获取json中的键(key)与值(value) <!DOCTYPE html> <html lang="en"> ...