概念
- 共享内存(主要考虑内存,而非效率)
- 相同的数据,共享使用
- (JS中未找到经典应用场景)
演示
<!-- 无限下拉列表,将事件代理到高层节点上 -->
<!-- 如果都绑定到`<a>`标签,对内存开销太大 -->
<div id="div1"><a href="#">a1</a><a href="#">a2</a><a href="#">a3</a><a href="#">a4</a><!-- 无限下拉列表 -->
</div><script>var div1 = document.getElementById('div1')div1.addEventListener('click',function(e) {var target = e.targetif (e.nodeName === 'A') {alert(target.innerHTML)}})
</script>
设计原则验证
- 将相同的部分抽象出来
- 符合开放封闭原则