訪問者模式，即 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 的類型，從而達到解耦的效果。
希望這篇文章，能夠對你有所啟發，有所幫助。
