javascript-桥接模式

桥接模式
 1.在系统沿着多个维度变化的同时,又不增加其复杂度并以达到解耦
 2.最主要特点:将实现层(如元素绑定的事件)与抽象层(如修饰页面UI逻辑)解耦分离,使两部分独立变化
 3.避免需求的改变造成对象内部的修改,体现了面向对象对拓展的开发及修改的关闭原则
 demo实例:创建一个对象桥接method,实现为对象拓展方法的功能

提取共同点(抽象层)

1         Object.prototype.addMethod = function(name,fn){
2             this[name] = fn;
3         }

创建类并实例化对象(实现层)

1         function Box(x,y,z){
2             this.x=x;
3             this.y=y;
4             this.z=z;
5         }
6     
7         var box=new Box(20,10,10);

为对象拓展方法(桥接方法)

1         box.addMethod("init",function(){
2             console.log("盒子的长度为:"+this.x+" , 宽度为:"+this.y+" , 高度为:"+this.z);
3         });
4         box.addMethod("getWidth",function(){
5             console.log(this.y);
6         });

测试代码

1         box.init();
2         box.getWidth();

控制台显示

 

转载于:https://www.cnblogs.com/jtnote/p/5993250.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值