做一款回憶童年的游戲，這款游戲代碼比較簡(jiǎn)單，主要是掌握算法的原理，但是也有一些需要注意的地方。
游戲界面
進(jìn)入正題。項(xiàng)目的效果圖如下：
游戲有一個(gè)開(kāi)始界面可供選擇玩家的角色，然后選擇先手是哪一方，接著開(kāi)始游戲。選擇界面做了一個(gè)遮罩層，里面提供給用戶選擇，選擇之后便把遮罩層隱藏并開(kāi)始游戲。
具體實(shí)現(xiàn)
說(shuō)了那么多，可能比較枯燥，下面介紹一下具體的代碼實(shí)現(xiàn)。
使用一個(gè)二維數(shù)組panel保存棋盤(pán)的狀態(tài)，1是電腦的值，－1是玩家的值。
winArr保存所有可能贏的8個(gè)棋位組合；維護(hù)computerWin和userWin，初始值等于winArr，當(dāng)電腦或玩家每次下棋時(shí)，都分別更新這兩個(gè)數(shù)組，刪除掉不能贏的棋位組合。在更新panel的時(shí)候會(huì)分別更新computerWin和userWin。
核心的方法是play，play的執(zhí)行步驟偽代碼如下：
如果可以攻擊
遍歷computerWin數(shù)組，找到可以攻擊的棋位，下棋，顯示是否贏了。
不能攻擊，如果需要防守
遍歷userWin，根據(jù)玩家可贏的組合，找出需要防守的棋位，下棋，更新panel；
不需要防守，如果是電腦先手的第一步
在中心位置下棋，更新panel；
不是先手第一步
如果中心位置沒(méi)有被占去，在中心位置下棋，更新panel；返回
如果是特殊情況，在棱位下棋，更新panel； 返回
如果角位仍有位置，選擇一個(gè)角位下棋，更新panel； 返回
最后一種情況，找到剩余的空位，優(yōu)先選擇位于computerWin的空位，下棋，更新panel； 返回
play算法的實(shí)現(xiàn)如下：
if(canAttack()) { console.log("attack"); var attackPos = findAttackPos(); updatePanel(attackPos, computerVal);} else if(needDefend()) { console.log("defend"); var defendPos = findDefendPos(); updatePanel(defendPos, computerVal);} else if(firstStep()) { console.log("first"); updatePanel(firstPos, computerVal); running = true;} else { console.log("other"); if(panel[1][1] == 0) { updatePanel(firstPos, computerVal); return; } if(special()) { console.log('special'); var pos = findSpecialPos(); updatePanel(pos, computerVal); return; } var random = Math.floor(Math.random() * 2); if(panel[0][0] == 0 && panel[2][2] == 0) { var pos = (random == 0) ? 0 : 8; updatePanel(pos, computerVal); } else if(panel[0][2] == 0 && panel[2][0] == 0) { var pos = (random == 0) ? 2: 6; updatePanel(pos, computerVal); } else { var otherPos = findEmptyPos(); updatePanel(otherPos, computerVal); }}總結(jié)
在編碼的過(guò)程中遇到的一個(gè)難題就是JavaScript的數(shù)組對(duì)象，我在第一次調(diào)用play方法開(kāi)頭輸出panel的時(shí)候，得到的是play執(zhí)行后panel的值，后來(lái)請(qǐng)教一位大神，發(fā)現(xiàn)是因?yàn)閜anel是一個(gè)對(duì)象，因?yàn)閷?duì)象遍歷引用的都是同一塊內(nèi)存地址，所以一旦有改變，就全部改了。如果直接使用下標(biāo)輸出每一個(gè)值的話是可以得到初始的值的，也可以用JSON方法將數(shù)組字符串，然后打印出來(lái)查看結(jié)果。
新聞熱點(diǎn)
疑難解答
圖片精選
