JavaScript設(shè)計(jì)模式之享元模式實(shí)例詳解

2019-11-19 12:16:58

字體：大中小

來源：轉(zhuǎn)載

供稿：網(wǎng)友

本文實(shí)例講述了JavaScript設(shè)計(jì)模式之享元模式。分享給大家供大家參考，具體如下：

通過兩個(gè)例子的對比來凸顯享元模式的特點(diǎn)：享元模式是一個(gè)為了提高性能(空間復(fù)雜度)的設(shè)計(jì)模式，享元模式可以避免大量非常相似類的開銷。

第一實(shí)例，沒有使用享元模式，計(jì)算所花費(fèi)的時(shí)間和空間使用程度。

要求為：有一個(gè)城市要進(jìn)行汽車的登記

（1）汽車類

/*** 制造商* 型號* 擁有者* 車牌號碼* 最近一次登記日期*/var Car = function(make,model,year,owner,tag,renewDate){    this.make = make;    this.model = model;    this.year = year;    this.owner = owner;    this.tag = tag;    this.renewDate = renewDate;    this.getMake = function(){      return this.make;    }}

（2）使用裝飾者模式--計(jì)算函數(shù)的耗時(shí)

//裝飾者 .. 計(jì)算函數(shù)的耗時(shí)var simpleProfiler = function(componet){    this.componet = componet;    this.action = function(methodName){      var self = this;      var method = componet[methodName];      //如果是函數(shù)那就進(jìn)行裝飾      if(typeof method == "function"){        var startDate = new Date().getTime();//開始時(shí)間        method.apply(self.componet,arguments);        var endDate = new Date();//結(jié)束時(shí)間        alert(endDate - startDate);      }    }}

（3）具體的實(shí)例，現(xiàn)有4150000輛車需要登記

var ca = new Array();function addCar(){    this.begin = function(){      for (var i = 0; i < 4150000; i++) {        ca.push(new Car("BMW","寶馬","2017-10-18",          "","GBMW88","2017-10-19"));      }    }}new simpleProfiler(new addCar()).action("begin")

第二個(gè)例子：使用享元模式

（1）汽車類

/*** 制造商* 型號* 擁有者* 車牌號碼* 最近一次登記日期*/var Car = function(make,model,year){    this.make = make;    this.model = model;    this.year = year;    this.getMake = function(){      return this.make;    }}

（2）單例模式的簡單工廠

//單例模式的簡單工廠  var myCarInfo = function(){    this.createCar = function(make,model,year,owner,tag,renewDate){      var c = carInfoFactory(make,model,year);      c["owner"] = owner;      c["tag"] = tag;      c["renewDate"] = renewDate;      return c;    }  }  var carInfoFactory = (function(){    var carInfo = {};    return function(make,model,year){      if(carInfo[make+model+year]){        return carInfo[make+model+year];      }else{        var newCar = new Car(make,model,year);        carInfo[make+model+year] = newCar;        return newCar;        a      }    }  })();

（3）現(xiàn)有4150000輛車需要登記

var test = new myCarInfo();var startDate = new Date().getTime();var ca = new Array();for (var i = 0; i < 4150000; i++) {    ca.push(test.createCar("BMW","寶馬","2017-10-18",          "","GBMW88","2017-10-19"))}var endDate = new Date();alert(endDate - startDate);

從上述兩個(gè)例子可以知道，第一個(gè)例子沒有使用享元模式相對于第二個(gè)使用享元模式耗時(shí)間少，但空間消耗大，第二個(gè)耗時(shí)多，但空間消耗小。

第一種情況圖解：每次都生成相同的實(shí)例