javascript之享元模式

BlackHole1 发布于2019-08-26 10:45 / 2392人阅读

摘要：享元模式享元模式是一种优化程序性能的模式本质为减少对象创建的个数。

享元模式

享元模式是一种优化程序性能的模式, 本质为减少对象创建的个数。

以下情况可以使用享元模式:
有大量相似的对象, 占用了大量内存
对象中大部分状态可以抽离为外部状态

demo
某商家有 50 种男款内衣和 50 种款女款内衣, 要展示它们

方案一: 造 50 个塑料男模和 50 个塑料女模, 让他们穿上展示, 代码如下:

  const Model = function(gender,underwear){
    this.gender = gender
    this.underwear = underwear
  }
  Model.prototype.takephoto = function(){
    console.log(`${this.gender}穿着${this.underwear}`);
  }
  for(let i=1;i<51;i++){
    const maleModel = new Model("male",`第${i}款衣服`)
    maleModel.takephoto()
  }
  for(let i =1;i<51;i++){
    const female = new Model("female",`第${i}款衣服`)
    female.takephoto()
  }

方案二: 造 1 个塑料男模特 1 个塑料女模特, 分别试穿 50 款内衣

  const Model = function(gender){
    this.gender = gender
  }
  Model.prototype.takephoto = function(){
    console.log(`${this.gender}穿着${this.underwear}`)
  }
  const maleModel = new Model("male")
  const femaleModel = new Model("female")
  for(let i =1;i<51;i++){
    maleModel.underwear = `第${i}款衣服`
    maleModel.takephoto()
  }
  for(let i =1; i<51;i++){
    femaleModel.underwear = `第${i}款衣服`
    femaleModel.takephoto()
  }

对比发现: 方案一创建了 100 个对象, 方案二只创建了 2 个对象, 在该 demo 中, gender(性别) 是内部对象, underwear(穿着) 是外部对象。

当然在方案二的 demo 中, 还可以进一步改善:

1 一开始就通过构造函数显示地创建实例, 可用工场模式将其升级成可控生成
2 在实例上手动添加 underwear 不是很优雅, 可以在外部多带带在写个 manager 函数

    const Model = function (gender) {
      this.gender = gender
    }

    Model.prototype.takephoto = function () {
      console.log(`${this.gender}穿着${this.underwear}`)
    }

    const modelFactory = (function () { // 优化第一点
      const modelGender = {}
      return {
        createModel: function (gender) {
          if (modelGender[gender]) {
            return modelGender[gender]
          }
          return modelGender[gender] = new Model(gender)
        }
      }
    }())

    const modelManager = (function () {
      const modelObj = {}
      return {
        add: function (gender, i) {
          modelObj[i] = {
            underwear: `第${i}款衣服`
          }
          return modelFactory.createModel(gender)
        },
        copy: function (model, i) { // 优化第二点
          model.underwear = modelObj[i].underwear
        }
      }
    }())

    for (let i = 1; i < 51; i++) {
      const maleModel = modelManager.add("male", i) 
      modelManager.copy(maleModel, i)
      maleModel.takephoto()
    }
    for (let i = 1; i < 51; i++) {
      const femaleModel = modelManager.add("female", i)
      modelManager.copy(femaleModel, i)
       femaleModel.takephoto()
    }

GPU云服务器云服务器 javascript命令模式 javascript严格模式 javascript设计模式代码设计模式工厂模式

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

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

每天一个设计模式之享元模式

摘要：作者按每天一个设计模式旨在初步领会设计模式的精髓，目前采用和两种语言实现。享元模式提醒我们将一个对象的属性划分为内部和外部状态。作者按：《每天一个设计模式》旨在初步领会设计模式的精髓，目前采用javascript和python两种语言实现。诚然，每种设计模式都有多种实现方式，但此小册只记录最直截了当的实现方式 :) 个人技术博客-godbmw.com 欢迎来玩! 每周至少 1 篇原创...

jone5679 2019-08-23 14:11 评论0 收藏0
每天一个设计模式之享元模式

摘要：作者按每天一个设计模式旨在初步领会设计模式的精髓，目前采用和两种语言实现。享元模式提醒我们将一个对象的属性划分为内部和外部状态。作者按：《每天一个设计模式》旨在初步领会设计模式的精髓，目前采用javascript和python两种语言实现。诚然，每种设计模式都有多种实现方式，但此小册只记录最直截了当的实现方式 :) 个人技术博客-godbmw.com 欢迎来玩! 每周至少 1 篇原创...

ormsf 2019-07-30 18:40 评论0 收藏0
设计模式之享元模式

摘要：而享元模式的核心就是运用共享技术来有效支持大量细粒度的对象。享元模式要求将对象的属性划分为内部状态和外部状态，所以在了解享元模式之前我们先要了解两个概念内部状态外部状态。一般情况下在这四种情况下应该考虑使用享元模式。享元模式（flyweight）是一种用于性能优化的模式，之所以用fly其意为蝇量级。而享元模式的核心就是运用共享技术来有效支持大量细粒度的对象。虽然面向对象可以非常方便的...

Jioby 2019-08-22 10:33 评论0 收藏0
设计模式之享元模式

摘要：类图相关的设计模式享元模式和代理模式当代理模式消耗性能比较大的时候，就可以用享元模式享元模式和单例模式容器单例，享元模式就是复用对象的思想。源码中的享元模式源码地址享元模式参考慕课网设计模式精讲设计模式读书笔记享元模式 0x01.定义与类型定义：提供了减少对象数量从而改善应用所需的对象结构的方法，系统使用少量对象,而且这些都比较相似，状态变化小，可以实现对象的多次复用。运用共享技...

vvpale 2019-08-19 10:19 评论0 收藏0
JavaScript设计模式之结构型设计模式

摘要：享元模式通过分析应用程序的对象，将其解析为内在数据和外在数据，减少对象数量，从而提高程序的性能。通过这种方式进行事件绑定，可以减少事件处理程序的数量，这种方式叫做事件委托，也是运用了享元模式的原理。事件处理程序是公用的内在部分，每个菜单项各 github 全文地址： YOU-SHOULD-KNOW-JS JavaScript设计模式之外观模式概念外观模式：为一组复杂子系统接口提...

xiaoqibTn 2019-08-21 18:24 评论0 收藏0