基于jsp的井字游戏示例

做一个童年回忆游戏，这个游戏代码比较简单，主要是掌握算法的原理，但是也有一些需要注意的点。

游戏界面

言归正传。项目效果图如下：

游戏有一个开始界面，用于选择玩家的角色，然后选择哪一方是第一个玩家，然后开始游戏。在选择界面，制作一个蒙版图层，为用户提供选择。选择后，遮罩层被隐藏，游戏开始。

具体实现

说了这么多，可能就没意思了。下面我们来介绍一下具体的代码实现。

使用二维数组面板保存棋盘的状态，其中-1为电脑的值，-1为玩家的值。WinArr保存所有可能赢的8种棋组合；维护computerWin和userWin，初始值等于winArr，每次电脑或玩家下棋时，分别更新这两个数组，删除不能赢的棋位组合。更新面板将分别更新computerWin和userWin。

核心方法是play，play执行步骤的伪代码如下：

如果可以攻击并遍历computerWin数组，找到可以攻击的棋位，下一盘棋，显示自己是否赢了。不能进攻，如果需要防守和遍历userWin，根据玩家能赢的组合找出需要防守的棋位，进行对弈，更新面板；没必要辩解，如果是电脑在中央位置下棋的第一步，更新面板；这不是第一步。如果中央位置没被占用，就在中央位置下棋，更新面板；如果是特例，在边上下棋，更新面板；如果角落还有位置，选择一个角落下棋，更新面板；回到上一个案例，找到剩余空缺，优先考虑computerWin中的空缺，下棋，更新面板；返回

播放算法实现如下：

if(canAttack()){ console . log(' attack ')；var attach pos=findAttackPos()；更新面板(attackPos，computerVal)；} else if(NeedDefence()){ console . log(' Defence ')；var defendPos=Findedefendpos()；更新面板(defendPos，ComputeVal)；} else if(FirstStep()){ console . log(' first ')；更新面板(第一位置，计算机值)；running=true} else { console . log(' other ')；if(panel[1][1]==0){ updatePanel(first pos，computer val)；返回；} if(special()){ console . log(' special ')；var pos=FindSpecialpos()；更新面板(pos，ComputeVal)；返回；} var random=math . floor(math . random()* 2)；if(panel[0][0]==0 panel[2][2]==0){ var pos=(random==0)？0 : 8;更新面板(pos，ComputeVal)；} else if(panel[0][2]==0 panel[2][0]==0){ var pos=(random==0)？2: 6;更新面板(pos，ComputeVal)；} else { var OtherPos=FindEmptypos()；更新面板(其他位置，计算机值)；}}摘要

编码过程中遇到的一个难题是JavaScript的数组对象。第一次调用play方法输出panel时，执行完play后得到panel的值。后来咨询了一位大神，发现因为面板是一个对象，因为对象遍历和引用的是同一个内存地址，一旦有什么变化，所有的都会发生变化。如果用下标直接输出每个值，可以得到初始值，也可以用JSON方法打印出数组字符串并检查结果。