秋雨
首页
  • HTML
  • CSS
  • JavaScript
设计模式
webpack
  • 前端常识
  • ES
  • React
  • Redux
  • ReactRouter
  • 事件循环
  • 浏览器渲染流程
  • Vue项目性能优化
  • Vue
  • App
Github
首页
  • HTML
  • CSS
  • JavaScript
设计模式
webpack
  • 前端常识
  • ES
  • React
  • Redux
  • ReactRouter
  • 事件循环
  • 浏览器渲染流程
  • Vue项目性能优化
  • Vue
  • App
Github
  • 构造器模式
  • 原型链模式
  • 工厂模式
  • 抽象工厂模式
  • 建造者模式
  • 单例模式
  • 装饰器模式
  • 适配器模式
  • 适配器模式
  • 代理模式
  • 观察者模式
  • 发布订阅模式
  • 模块模式
  • 桥接模式
  • 组合模式
  • 命令模式
  • 命令模式
  • 迭代器模式
  • 职责链模式

简介

桥接模式:将抽象部分与它的实现部分分离,使它们可以独立的变化 使用场景:一个类存在两个或多个独立变化的维度,

优点:把抽象和实现隔离开,有助于独立地管理各组成部分。 缺点:每使用一个桥接元素都要增加一次函数调用,这对应用程序的性能会有一些负面影响--提高了系统的复杂程度。

示例

function Aodi1(engine) {
  this.engine = engine;
}

Aodi1.prototype.platform = function () {
  console.log("aodi1 平台");
};

Aodi1.prototype.loadEngine = function () {
  console.log("aodi1 平台");
  this.engine.run();
};

function Aodi2(engine) {
  this.engine = engine;
}

Aodi2.prototype.platform = function () {
  console.log("aodi2 平台");
};

Aodi2.prototype.loadEngine = function () {
  console.log("aodi2 平台");
  this.engine.run();
};

function V6() {
  this.run = function () {
    console.log("V6发动机");
  };
}
function V8() {
  this.run = function () {
    console.log("V8发动机");
  };
}

let aodi1 = new Aodi1(new V6());
let aodi2 = new Aodi2(new V8());
aodi1.loadEngine();
aodi2.loadEngine();
最后更新:
贡献者: Mrlishizhen
Prev
模块模式
Next
组合模式