桥接Bridge Pattern
又称为柄体Handle and Body
模式或接口Interface
模式,是用于把抽象化与实现化解耦,使得二者可以独立变化。这种类型的设计模式属于结构型模式,其通过提供抽象化和实现化之间的桥接结构,来实现二者的解耦。
假如要绘制矩形、圆形、椭圆、正方形,我们至少需要4
个形状类,但是如果绘制的图形需要具有不同的颜色,如红色、绿色、蓝色等,此时至少有如下两种设计方案:第一种设计方案是为每一种形状都提供一套各种颜色的版本。第二种设计方案是根据实际需要对形状和颜色进行组合。对于有两个变化维度(即两个变化的原因)的系统,采用方案二来进行设计系统中类的个数更少,且系统扩展更为方便,设计方案二即是桥接模式的应用,桥接模式将继承关系转换为关联关系,从而降低了类与类之间的耦合,减少了代码编写量。
Abstraction
: 抽象类。RefinedAbstraction
: 扩充抽象类。Implementor
: 实现类接口。ConcreteImplementor
: 具体实现类。class Shape {
draw(){
console.log(this.shape);
}
fill(color){
this.color = color;
}
}
class Rectangle extends Shape{
constructor(){
super();
this.shape = "Rectangle";
}
}
class Square extends Shape{
constructor(){
super();
this.shape = "Square";
}
}
class Circle extends Shape{
constructor(){
super();
this.shape = "Circle";
}
}
class Color {
fill(){
console.log(this.color);
}
}
class Red extends Color{
constructor(){
super();
this.color = "Red";
}
}
class Green extends Color{
constructor(){
super();
this.color = "Green";
}
}
class Blue extends Color{
constructor(){
super();
this.color = "Blue";
}
}
class Bridge{
constructor(shape, color){
this.shape = shape;
this.color = color;
this.shape.fill(color);
}
draw(){
this.shape.draw();
this.color.fill();
}
}
(function(){
var product = new Bridge(new Rectangle(), new Red());
product.draw(); // Rectangle Red
var product = new Bridge(new Square(), new Green());
product.draw(); // Square Green
var product = new Bridge(new Circle(), new Blue());
product.draw(); // Circle Blue
})();
https://github.com/WindrunnerMax/EveryDay
https://segmentfault.com/a/1190000012547750
https://www.runoob.com/design-pattern/bridge-pattern.html
https://design-patterns.readthedocs.io/zh_CN/latest/structural_patterns/bridge.html
原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。
如有侵权,请联系 cloudcommunity@tencent.com 删除。
原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。
如有侵权,请联系 cloudcommunity@tencent.com 删除。