举例来说，如果我们又很多相似类型的元素或者结构（比如菜单，或者ul里的多个li）都需要监控他的click事件的话，那就需要多每个元素进行事件绑定，如果元素有非常非常多，那性能就可想而知了，而结合冒泡的知识，任何一个子元素有事件触发的话，那触发以后事件将冒泡到上一级元素，所以利用这个特性，我们可以使用享元模式，我们可以对这些相似元素的父级元素进行事件监控，然后再判断里面哪个子元素有事件触发了，再进行进一步的操作。
在这里我们结合一下jQuery的bind/unbind方法来举例。
HTML:
复制代码 代码如下:
<div>
<div href="#">更多信息 (地址)
<span>
这里是更多信息
</span></div>
<div href="#">更多信息 (地图)
<span>
<iframe src="http://www.map-generator.net/extmap.php?name=London&address=london%2C%20england&width=500...gt;"</iframe>
</span>
</div>
</div>
JavaScript:
复制代码 代码如下:
stateManager = {
fly: function(){
var self = this;
$('#container').unbind().bind("click", function(e){
var target = $(e.originalTarget || e.srcElement);
// 判断是哪一个子元素
if(target.is("div.toggle")){
self.handleClick(target);
}
});
},
handleClick: function(elem){
elem.find('span').toggle('slow');
}
});
例2：应用享元模式提升性能
另外一个例子，依然和jQuery有关，一般我们在事件的回调函数里使用元素对象是会后，经常会用到$(this)这种形式，其实它重复创建了新对象，因为本身回调函数里的this已经是DOM元素自身了，我们必要必要使用如下这样的代码：
复制代码 代码如下:
$('div').bind('click', function(){
console.log('You clicked: ' + $(this).attr('id'));
});
// 上面的代码，要避免使用，避免再次对DOM元素进行生成jQuery对象，因为这里可以直接使用DOM元素自身了。
$('div').bind('click', function(){
console.log('You clicked: ' + this.id);
});
其实，如果非要用$(this)这样的形式，我们也可以实现自己版本的单实例模式，比如我们来实现一个jQuery.signle(this)这样的函数以便返回DOM元素自身：
复制代码 代码如下:
jQuery.single = (function(o){
var collection = jQuery([1]);
return function(element) {
// 将元素放到集合里
collection[0] = element;
// 返回集合
return collection;
};
});
使用方法：
复制代码 代码如下:
$('div').bind('click', function(){
var html = jQuery.single(this).next().html();
console.log(html);
});
这样，就是原样返回DOM元素自身了，而且不进行jQuery对象的创建。
总结
Flyweight模式是一个提高程序效率和性能的模式,会大大加快程序的运行速度.应用场合很多:比如你要从一个数据库中读取一系列字符串,这些字符串中有许多是重复的,那么我们可以将这些字符串储存在Flyweight池(pool)中。
如果一个应用程序使用了大量的对象，而这些大量的对象造成了很大的存储开心时就应该考虑使用享元模式；还有就是对象的大多数状态可以外部状态，如果删除对象的外部状态，那么就可以用相对较少的共享对象取代很多组对象，此时可以考虑使用享元模式。
您可能感兴趣的文章: