访问者模式，即 visitor pattern，是一个很常见的模式，这是因为它能有效地构建出复杂的系统。更关键的是，在函数式语言中，它表现起来是如此的直观。因此，我决定利用一个简单的例子，来谈谈访问者模式，并且希望能够通过这个例子，让大家感受到这一模式的威力。
王垠曾在他的文章 解密“设计模式” 中提到过访问者模式：
所谓的 visitor，本质上就是函数式语言里的含有‘模式匹配’（pattern matching）的递归函数。
这一定义还是非常精确的，在我们介绍完访问者模式后，会再回顾一下这句话。
一个简单的例子
下面我们将会利用一个小例子，介绍访问者模式。
假设在一个二维的坐标系中，定义一个类 Point，有两个方法，
- getDistance 用于计算 point 到原点的距离
- minus 接收一个点 p 作为参数，将两个点的坐标相减得到一个新坐标，通过新坐标创建一个新的点
代码如下：
class Point {
constructor(x, y) {
this.x = x;
this.y = y;
}
// 计算 point 到原点的距离
getDistance() {
return Math.sqrt(this.x * this.x + this.y * this.y);
}
// point 与另一个点 p 的坐标相减得到一个新坐标，通过新坐标创建一个新的点
minus (p) {
const delX = this.x - p.x;
const delY = this.y - p.y;
return new Point(delX, delY);
}
}
再定义一个基本的形状类 Circle，Circle 有一个方法 hasPoint 用于判断传进来的 point 是否在 circle 的范围内，代码如下：
class Circle {
constructor(r) {
this.r = r;
}
// 判断 p 是否在 circle 的范围内
hasPoint (p) {
return p.getDistance() <= this.r;
}
}
再定义一个基本的形状类 Square，和 Circle 一样有一个 hasPoint 方法，代码如下：
class Square {
constructor(s) {
this.s = s;
}
// 判断 p 是否在 square 的范围内
hasPoint (p) {
return (p.x <= this.s) && (p.y <= this.s);
}
}
在有了上面的几个类定义后，我们通过下面的代码观察下如何使用这些类：
var p1 = new Point(1, 2);
var square1 = new Square(2);
var circle1 = new Circle(2);
square1.hasPoint(p1); // true
circle1.hasPoint(p1); // false
上面的例子虽然符合我们的期望。但是，这个系统还过于简单。
仔细观察就会发现，创建出来的形状都是基于原点的。为了增加一些难度，我们新增一个类 Trans，让形状可以位移。注意新的类 Trans 的 hasPoint 方法的实现。
class Trans {
constructor(point, shape) {
this.point = point;
this.shape = shape;
}
hasPoint (p) {
var { point, shape } = this;
var newP = p.minus(point);
return shape.hasPoint(newP);
}
}
让我们再添加一些简单的例子吧。
var p1 = new Point(1, 2);
var p2 = new Point(1, 1);
var square1 = new Square(2);
var circle1 = new Circle(2);
var trans1 = new Trans(p2, circle1);
square1.hasPoint(p1); // true
trans1.hasPoint(p1); // true
通过上面的例子可以发现，传递给 Trans 的 shape 不仅仅只能是基本的形状 Circle，Square，还能是位移之后的 Trans。这是因为 Trans.hasPoint 的实现是依赖传进来的 shape.hasPoint，但是这个 shape 具体是什么它并不关心。而这正是访问者模式的核心所在。
通过让 Circle，Square，Trans 实现同一个方法 hasPoint，并且通过 Trans 实现形状的组合功能，从而让这个系统更加强大。可以想象，我们可以像定义 Trans 一样，引入更多的转换功能，比如实现 Rotate，Scale 类等等，并且让各种 shape 相互组合，得到更加复杂的 shape。从而做到，在不修改原有代码的情况下，构建出更加复杂的系统。
分析与变换
细心的读者也许发现了，上面的例子虽然有趣，当是似乎和本文开头所讲的函数式语言关系不大，和王垠所定义的访问者模式也不相同（甚至和 Java 中的访问者模式也不一样）。
这是因为，在实际开发中，为了让系统各个部分更加清晰，尤其是大型系统，人们会更倾向于将所有的 hasPoint 方法的实现放在一起，然后将这些实现作为部件添加到 Shape 中。而完成了这一步，才算是真正实现了访问者模式。
想在 Java 中实现访问者模式会比较绕，所幸我们用的是 JavaScript。下面，我会将上面的例子做一些简单的变换，使其更符合预期。但要记住，这些变换从本质上来说其实都是等价的，只是代码形式的转换而已。
首先，去除所有形状中的 hasPoint 方法，并且引入一个 type 的属性。代码如下：
var CIRCLE = 'CIRCLE';
var SQUARE = 'SQUARE';
var TRANS = 'TRANS';
class Circle {
constructor(r) {
this.r = r;
this.type = CIRCLE;
}
}
class Square {
constructor(s) {
this.s = s;
this.type = SQUARE;
}
}
class Trans {
constructor(point, shape) {
this.point = point;
this.shape = shape;
this.type = TRANS;
}
}
然后，我们创建一个新函数，将原先所有的 hasPoint 方法集中在一起，这个函数就是访问者模式的关键啦。
var hasPoint = (s, p) => {
// 利用 switch 做模式匹配
switch (s.type) {
case CIRCLE:
return p.getDistance() <= s.r;
case SQUARE:
return (p.x <= s.s) && (p.y <= s.s);
case TRANS:
var { point, shape } = s;
var newP = p.minus(point);
return hasPoint(shape, newP); // 递归调用 hasPoint
default:
console.error('HAS_POINT -- unexpteced type', s.type);
}
}
这个新函数只是利用 switch 将原来的 hasPoint 方法集合，但它确实符合王垠定义中的两个关键点
- 模式匹配
- 递归
而这正是访问者模式的特征所在。
如果你是面向对象的忠实粉丝的话，还可以添加一个抽象类，通过让所有的 shape 都继承这一抽象类，重新获得原来的 hasPoint方法。代码如下：
class AbstractShape {
hasPoint (p) { return hasPoint(this, p) }
}
最后
希望这个简单的例子，能向大家阐明访问者模式是如何构建复杂系统的。其关键是：
- 通过组合的方式构建出更加复杂的系统
- 利用递归达到解耦的效果
比如上面的例子，定义了组合类 Trans（ 甚至 Rotate，Scale 等），让基本类 Circle，Square 得以通过不同的组合方式构建出更加复杂的 shape。而 hasPoint 函数中的递归，则让 Trans 可以不关心其接收的 shape 的类型，从而达到解耦的效果。
希望这篇文章，能够对你有所启发，有所帮助。
