本文實例為大家分享了H5+C3+JS實現五子棋游戲的具體代碼,供大家參考,具體內容如下
新增全局變量
<script> //所有贏法總和 var count = 0; //容納所有贏法的三維數組 var allWin = []; for(var i =0; i <15; i++){ allWin[i] = []; for(var j=0; j <15; j++){ allWin[i][j] = []; } } //橫線贏法 for(var i =0; i <15; i++){ for(var j =0; j <11; j++){ for(var k =0; k <5; k++){ allWin[j+k][i][count] = true; } count++; } } //豎線贏法 for(var i =0; i <15; i++){ for(var j =0; j <11; j++){ for(var k =0; k <5; k++){ allWin[i][j+k][count] = true; } count++; } } //斜線贏法 for(var i =0; i <11; i++){ for(var j =0; j <11; j++){ for(var k =0; k <5; k++){ allWin[i+k][j+k][count] = true; } count++; } } //反斜線贏法 for(var i =14; i >3; i--){ for(var j =0; j <11; j++){ for(var k =0; k <5; k++){ allWin[i-k][j+k][count] = true; } count++; } } /*此時可以輸出一下count,如果為572種就表示上面的代碼沒有問題 */ /* alert(count); */ //記錄所有贏法當前所下的棋子, 為6表示已被堵住,不可達 */ var myWin = []; var compWin = []; for(var i =0; i <count; i++){ myWin[i] = 0; compWin[i] = 0; } //判斷當前是否游戲結束 var meover = false; var compover = false;</script>chess.onclick的微調:白棋不再用戶下
<script> chess.onclick = function(event) { //如果游戲結束或者該點已經被下 if(meover || compover || curIndex[x][y] != 0) return; //獲取要下的棋子的位置 var x = Math.floor(event.offsetX /30); var y = Math.floor(event.offsetY /30); //開始繪制 context.beginPath(); //繪制指定圓 context.arc(15 +x *30, 15 +y *30, 15, 0, 2 *Math.PI); context.fillStyle = "#636766"; context.fill() ; //當前位置已經被玩家下了 curIndex[x][y] = 1; <1> }</script>玩家是否贏進行判斷:在上面代碼<1>處加入代碼
<script> for(var k =0; k <count; k++){ if(allWin[x][y][k]){ //此種贏法步數加1,如果為5表示全部走到 //此贏法computer已不可達,設置為6 myWin[k]++; compWin[k] = 6; } if(myWin[k] == 5){ alert("你贏了"); compover; } } if(compover) return; //電腦AI算法檢測下一步 AIcode();<2></script>AI算法核心
<script> function AIcode(){ //表示所有位置的玩家總分數和電腦總分數 var myScore = []; var compScore = []; for(var i =0; i <15; i++){ myScore[i] = []; compScore[i] = []; for(var j =0; j <15; j++){ myScore[i][j] = 0; compScore[i][j] = 0; } } //對分數進行統計判斷,選出分數最大的位置進行電腦下棋 var max = 0; var maxX = 0; var maxY = 0; //創建加分規則 for(var i =0; i < 15; i++){ for(var j =0; j <15; j++){ if(curIndex[i][j] == 0){ for(var k=0; k <count; k++){ if(allWin[i][j][k]){ if(myWin[k] == 1){ myScore[i][j] += 200; } else if(myWin[k] == 2){ myScore[i][j] += 500; } else if(myWin[k] == 3){ myScore[i][j] += 2000; } else if(myWin[k] == 4){ myScore[i][j] += 50000; } if(compWin[k] == 1){ compScore[i][j] += 300; } else if(compWin[k] == 2){ compScore[i][j] += 800; } else if(compWin[k] == 3){ compScore[i][j] += 20000; } else if(compWin[k] == 4){ compScore[i][j] += 500000; } } } if(myScore[i][j] > max){ max = myScore[i][j]; maxX = i; maxY = j; } if(compScore[i][j] > max){ max = compScore[i][j]; maxX = i; maxY = j; } } } } //進行最終下棋 context.beginPath(); context.arc(15 +maxX *30, 15 +maxY *30, 15, 0, 2 *Math.PI); context.fillStyle = "#fefefe"; context.fill(); //標記當前位置已經被白棋占據 curIndex[maxX][maxY] = 2; <3> context.closePath();};</script>電腦是否贏進行判斷<3>
<script> for(var k =0; k <count; k++){ if(allWin[maxX][maxY][k]){ compWin[k]++; myWin[k] = 6; } if(compWin[k] == 5){ alert("你輸了"); meover = true; } }</script>實現效果圖

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持武林網。
新聞熱點
疑難解答