js设计模式笔记-桥接模式

发表于

桥接模式

  1. 某些类型由于自身的逻辑，会向多个维度变化，使其不增加复杂度并达到解耦的目的
    • 将一个函数或者类当做一个桥梁，提取公共部分，将实现和抽象通过桥接的方法链接在一起
    • 针对多维度变化，可以创建许多个桥梁
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
'use strict'
let log = console.log.bind(console)
function Speed (x, y) {
  this.x  = x
  this.y = y
}

Speed.prototype.run = function () {
  log('run')
}

function Color (cl) {
  this.cl = cl
}

Color.prototype.draw = function () {
  log('draw')
}

function Shape (sp) {
  this.shape = sp
}

Shape.prototype.change = function () {
  log('改变形状')
}

function Speek (word) {
  this.word = word
}

Speek.prototype.say = function () {
  log('fuck')
}

// 创建一座桥梁，在生成 Ball的时候直接 new Ball
function Ball (x, y, c) {
  this.speed = new Speed(x, y)
  this.color = new Color(c)
}

Ball.prototype.init = function () {
  this.speed.run()
  this.color.draw()
}

function People (x, y, f) {
  this.speed = new Speed(x, y)
  this.speek = new Speek(f)
}
People.prototype.init = function () {
  this.speed.run()
  this.speek.say()
}

// 通过桥梁生成实体
var ball = new Ball(1, 2, '#ccc')
ball.init()