再一次,javascript设计模式与开发实践-享元模式

简述

一种优化性能的模式,享元的核心是运用共享技术来有效支持大量细粒度的对象。

假设服装工厂有50种款式的衣服,为了推销产品工厂决定请模特来穿服装拍摄,在现实中不会请50名模特来试穿,所以在程序中享元模式指的就是这种情况。

使用场景

  • 地图图钉
  • 标签页
  • ..

案例

假如我们在设计一个标签页功能,每个标签都需要载入iframe,没有必要每张标签都创建一个iframe元素,那么可以使用享元模式。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
var objPoolFactory = function (createObjFn) {
    var objPool = [];

    return {
        create : function () {
            return objPool.length ? objPool.shift() : createObjFn.apply(this, arguments);
        },
        recover: function (obj) {
            objPool.push(obj);
        }
    }
};

var iframeFactory = objPoolFactory(function() {
    var iframe = document.createElement('iframe');
    document.body.appendChild(iframe);

    iframe.onload = function() {
        iframe.onload = null;
        iframeFactory.recover(iframe);
    };

    return iframe;
});

var iframe1 = iframeFactory.create();
iframe1.src = 'http://baidu.com';

var iframe2 = iframeFactory.create();
iframe2.src = 'http://google.com';

setTimeout(function () {
    var iframe3 = iframeFactory.create();
    iframe3.src = 'http://baidu.com';
}, 3000);