享元模式
- 共享内存,节约内存空间
- 相同的数据共享使用
- 将数据的方法分为内部数据、内部方法和外部数据、外部方法
- 内部状态保存在对象内部,通常不会改变,可以共享
- 外部状态保存在对象外部,可以随场景改变,不可以共享
使用场景
- 一个系统有大量相同或者相似的对象,造成内存的大量耗费
- 对象的大部分状态可以外部化,可以将这些外部状态传入对象中
- 在使用享元模式时需要维护一个存储享元对象的享元池,而这需要耗费一定的系统资源,因此,应当在需要多次重复使用享元对象时才值得使用享元模式
享元模式的实现
使用享元模式实现分页加载数据,只创建5个div,一次显示5条数据,当切换pageIndex时,根据数据的索引获取对应的数据即可,相比于每条数据使用一个元素的显示方式,享元模式显示方式减少元素的渲染,更加高效。
let flyWeight = (function () {
let created = [];
function create() {
let dom = document.createElement('div');
document.getElementById('container').appendChild(dom);
created.push(dom);
return dom;
}
return {
getDiv() {
if (created.length < 5) {
return create();
} else {
let div = created.shift();
created.push(div);
return div;
}
}
}
})();
// 初始化
function init(){
for(let i = 0; i < 5; i++){
FlyWeight.getDiv().innerHTML = i;
}
}
// 点击下一页创建对应的数据
function getPage(){
let page = 0,
num = 5,
len = 10,
n = ++page * num % len;
for(let i = 0; i < num; i++){
FlyWeight.getDiv().innerHTML = i;
}
}
优缺点
优点
- 极大减少内存张相似或相同对象数量,节约系统资源,提高系统性能
- 享元模式中的外部状态相对独立,且不影响内部状态
缺点
为了是对象可以共享,需要将享元模式的部分状态外部化,分离内部状态和外部状态,是程序逻辑复杂