桥接设想形式
桥接设想形式是很多其他设想形式的基本,比方装潢形式, 代办形式都或多或少看到他的影子, 在面向对象设想中最主要的一个特性就是继续, 但是作为拓展类的功用的体式格局有两种 — 继续和桥接, 桥接用我简朴的明白就是摒弃运用继续的体式格局拓展类, 而是采纳包括另一个具有肯定功用的对象来拓展类, 下面来看两种构造
起首我们假设有一个需求, 有一个图形接口, 然后有长方形, 正方形, 圆形等图形类, 我们须要种种色彩的图形, 下面用继续和桥接的体式格局来完成这类需求.
- 继续
- 桥接
桥接形式构造
完成
图形抽象类
let Shape = function(color) { this.color = color; }; Shape.prototype.setColor = function(color) { this.color = color; }; Shape.prototype.draw = function() { new Error(); }
图形类
let Rectangle = function (color) { Shape.call(this, color); }; extend(Rectangle, Shape); Rectangle.prototype.draw = function () { color.bepaint("长方形"); }; let Square = function (color) { Shape.call(this, color); }; extend(Square, Shape); Square.prototype.draw = function () { color.bepaint("正方形"); } let Circle = function (color) { Shape.call(this, color); }; extend(Circle, Shape); Circle.prototype.draw = function () { color.bepaint("圆型"); };
色彩抽象类
let Color = function() { }; Shape.prototype.bepaint = function() { new Error(); };
色彩类
let Red = function () { Color.call(this); }; extend(Red, Color); Red.prototype.bepaint = function(shape) { console.log("白色的" + shape); }; let Green = function () { Color.call(this); }; extend(Green, Color); Green.prototype.bepaint = function(shape) { console.log("绿色的" + shape); }; let Blue = function () { Color.call(this); }; extend(Blue, Color); Blue.prototype.bepaint = function(shape) { console.log("蓝色的" + shape); };
运用
let red = new Red(); //正方形 let square = new Square(); //赤色的正方形 square.setColor(red); square.draw(); //长方形 let rectange = new Rectangle(); //赤色长方形 rectange.setColor(red); rectange.draw();
桥式设想适用于一个类存在两个或多个自力变化的维度,且这两个维度都须要举行扩大,
桥接形式完成了抽象化与完成化的脱耦。他们两个相互自力,不会影响到对方, 关于两个自力变化的维度,运用桥接形式再合适不过了。