TheBlog
0%

JavaScript设计模式--享元模式

Posted on Edited on In ,

在构建JavaScript应用的过程中，对象的创建是一种非常普遍的解决需求的方式，合理地使用对象可以让代码更加有秩序，程序执行效率更高，但是对象在创建后会占据一定的内存空间，倘若在短时间内创建大量的对象，会使得浏览器卡顿甚至陷入假死状态，因此，我们需要对对象进行优化，重用以及共享，俗语道“不当家不知柴米贵”，在浏览器中运行的程序，对内存的要求不能太高，否则会因为浏览器或者电脑的性能瓶颈导致页面体验不佳。
使用享元模式可以在以下场景中使得程序的内存占用得到优化：

1.同一功能模块中使用了大量的相似对象
2.由于这些对象的使用造成了很大的内存开销
3.对象的大多数状态可以变为外部状态
4.抽离出外部状态后，可以使用少量的共享对象代替外部对象

关于内部状态和外部状态，可以简要描述为：

内部状态

保存在对象内部，可以被所有同类对象共享，即在所有同类对象中该状态有着统一的特征的状态。内部状态独立于具体的场景，可以说描述的是一种特定状态，这种状态又可以作为其他多种更加细分状态的描述者。比如鸭子作为一个对象，那么鸭子的喙，蹼，叫声都可以作为内部状态，这些状态在一起可以描述一只鸭子，也可以描述一只雄鸭子或者一只雌鸭子。

外部状态

相对于内部状态处于被描述一方的状态可以称为外部状态，比如鸭子的性别、重量等状态，这些状态量在描述具体鸭子时再进行添加，比如说大鸭子、小鸭子等等，这些状态不能被所有对象进行共享。

时间换空间

在使用外部状态来处理不同任务的时候，由于通过同一个对象来进行，因此会造成时间上的开销相比多个对象来增加不少，但是计算机擅长做的正是重复计算，增加的时间开销对性能的影响会小于增加空间开销对性能的影响（在浏览器环境中尤其如此）。

对象池

在JavaScript中，对象的销毁无法自动进行，因此销毁一个对象和创建一个对象都会造成一定的开销，节省重复的销毁和创建行为可以使得性能得到优化，这也就是对象的重用，对象池的实现和单例模式类似，当我们要创建某个对象时，先向内存询问是否已有同类的闲置对象可以直接使用，若有，则返回同类对象，否则才进行真正的创建对象的操作。示例如下

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
const objFactory=function(createFn){
    const pool=[];
    const create=function(){
        if(pool.length!==0){
            return pool.shift()
        }
        return createFn.apply(this,arguments)
    }
    const recover=function(obj){
        pool.push(obj)
    }
    return{
        create,
        recover
    }
}
let a=objFactory(function(){return {"a":1}})
let b=a.create()
a.recover(b)
let c=a.create()
let d=a.create()
b===c  //true
b===d  //false