【JavaScriptGame】迷宫（其二）

上篇说道，挖坑er已经成功打通迷宫。但自己亲力亲为未免有些太浪费时间，趁着愚人节来临之际，挖坑er还想量产更多迷宫，所以他必须提供制作方案，然后雇人完成打通迷宫的事情。

——————————————————分割线——————————————————

解决方案中，首先应该有整个迷宫的长度、宽度、格子大小（可选）；

然后按房间顺序搭建迷宫，并给这些房间编上号；

至于雇来的人应该打通哪些墙壁，就根据房间的编号，计算出4面墙壁分别是否需要打通，并做相应的记录。

那么——

function Grid(left, top, right, bottom) {
        this.left = left;
        this.top = top;
        this.right = right;
        this.bottom = bottom;
}

left、top、right、bottom分别记录四面墙是否打通，打通为true，不打通为false？

用1代表true，0代表false如何？

4个变量都是0和1，组合在一起如何？

如图，我们根据left、top、right、bottom的顺序，将要打通的墙壁写为1，不打通的墙壁写为0，组合成一个二进制数，最终转换为十进制作为此格子的状态保存。

以上就是格子的16种可能性，仅用 0~15 这16个数就能表示出来了。

而且利用按位运算符，我们可以很方便的操作这些格子的状态。

要计算某一格子，例如上面的12，要判断左方向可以通过，只需要用按位与判断 12 & 8 是否大于 0 就行了：

12 & 8 = 8，即得左方向可以通过。

12 & 2 = 0，即得右方向不可通过。

要设置这个格子的某个方向可以通过，进行按位或运算即可：

12 | 8 = 12，因为之前左方向已经能够通过，所以格子状态未发生改变。

12 | 2 = 14，因为之前右方向不能通过，所以格子状态改变从1100改变为1110，即14。

但是通常情况下使用按位异或，将某方向能否通过设置成相反值更为灵活：

12 ^ 8 = 4，则得到左方向不能通过的状态。

12 ^ 2 = 14，得到了右方向可以通过的状态。

之后，挖坑er只要预先计算每个格子的状态，再将制作方案交给施工队，就可以按照顺序搭建迷宫了，对于管理性来说无疑是提升了一个大的层次。

不过问题又出来了，既然现在的顺序是先搭建迷宫格子，再打通墙壁，多余的墙壁为什么不能直接不搭建，而省去拆墙、运送废料之苦呢？

这关系到DOM的reflow问题，我们下篇再说。

DEMO下载