桥接设想形式

桥接设想形式是很多其他设想形式的基本,比方装潢形式, 代办形式都或多或少看到他的影子, 在面向对象设想中最主要的一个特性就是继续, 但是作为拓展类的功用的体式格局有两种 — 继续和桥接, 桥接用我简朴的明白就是摒弃运用继续的体式格局拓展类, 而是采纳包括另一个具有肯定功用的对象来拓展类, 下面来看两种构造

起首我们假设有一个需求, 有一个图形接口, 然后有长方形, 正方形, 圆形等图形类, 我们须要种种色彩的图形, 下面用继续和桥接的体式格局来完成这类需求.

• 继续

• 桥接

桥接形式构造

完成

• 图形抽象类

  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();

桥式设想适用于一个类存在两个或多个自力变化的维度，且这两个维度都须要举行扩大,

桥接形式完成了抽象化与完成化的脱耦。他们两个相互自力，不会影响到对方, 关于两个自力变化的维度，运用桥接形式再合适不过了。