交叉赢法

/* 交叉赢法 */ for (var x = 0; x < this.col-4; x++) { // 左 -> 右 开始的所有交叉赢法 总共11 * 11种 for (var y = 0; y < this.col-4; y ++) { this.winsCount ++; /* 如: 1. [0,0] [1,1] [2,2] [3,3] [4,4] 2. [0,1] [1,2] [2,3] [3,4] [4,5] 3. [0,2] [1,3] [2,4] [3,5] [4,6] ... [1,0] [2,1] [3,2] [4,3] [5,5] 相当于从左至右 一列列计算过去 */ for (var k = 0; k < 5; k ++) { this.wins[x+k][y+k][this.winsCount] = true; } } } for (var x = this.col-1; x >= 4; x --) { //右 -> 左 开始的所有交叉赢法 总共11 * 11种 for (var y = 0; y < this.col-4; y ++) { this.winsCount ++; for (var k = 0; k < 5; k ++) { this.wins[x-k][y+k][this.winsCount] = true; } } } } 9. 落子实现 //落子实现 Gobang.prototype.dorpChess = function(){ var that = this; this.canvas.addEventListener('click', function(e) { // 判断是否结束 if (that.over) return; var x = Math.floor((e.offsetX)/30), y = Math.floor((e.offsetY)/30); //判断该棋子是否已存在 if (that.allChesses[x][y]) return; // 检查落子情况 that.checkChess(x, y) if (!that.over) { that.player = false; that.computerDropChess();//计算机落子 } }) } //检查落子情况 Gobang.prototype.checkChess = function(x, y){ //画棋 this.drawChess(x, y, this.player); //记录落下的棋子 this.existChesses.push({ x: x, y: y, player: this.player }); //该位置棋子置为true,证明已经存在 this.allChesses[x][y] = true; this.currWinChesses(x, y, this.player); } //判断当前坐标赢的方法各自拥有几粒棋子 Gobang.prototype.currWinChesses = function(x, y, player){ var currObj = player ? this.myWins : this.computerWins; var enemyObj = player ? this.computerWins : this.myWins; var currText = player ? '我' : '电脑'; for (var i = 1; i 0) { var n = 10; for (var i = 0; i < o; i++) { n *= 3; } return n } return 0 } // 获取没有落子的棋盘区域 function existChess(arr) { var existArr = []; for (var i = 0; i < arr.length; i++) { for (var j = 0; j < arr[i].length; j++) { if (!arr[i][j]) { existArr.push({x:i, y:j}) } } } return existArr; } var exceptArr = existChess(this.allChesses); // 循环未落子区域，找出分数最大的位置 for (var i = 0; i < exceptArr.length; i++) { var o = exceptArr[i]; // 循环所有赢的方法 for (var k = 0; k < this.winsCount; k++) { //判断每个坐标对应的赢法是否存在 if (this.wins[o.x][o.y][k]) { // 计算每种赢法，拥有多少棋子，获取对应分数 // 电脑起始分数需要高一些，因为现在是电脑落子， 优先权大 myScore[o.x][o.y] += formatScore(this.myWins[k-1], 10); computerScore[o.x][o.y] += formatScore(this.computerWins[k-1], 11); } } //我的分数判断 if (myScore[o.x][o.y] > maxScore) { //当我的分数大于最大分数时， 证明这个位置的是对我最有利的 maxScore = myScore[o.x][o.y]; x = o.x; y = o.y; }else if (myScore[o.x][o.y] === maxScore) { //当我的分数与最大分数一样时， 证明我在这两个位置下的效果一样， 所以我们应该去判断在这两个位置时，电脑方对应的分数 if (computerScore[o.x][o.y] > computerScore[x][y]) { x = o.x; y = o.y; } } // 电脑分数判断， 因为是电脑落子， 所以优先权大 if (computerScore[o.x][o.y] > maxScore) { maxScore = computerScore[o.x][o.y]; x = o.x; y = o.y; }else if (computerScore[o.x][o.y] === maxScore) { if (myScore[o.x][o.y] > myScore[x][y]) { x = o.x; y = o.y; } } } this.checkChess(x, y) if (!this.over) { this.player = true; } } var gobang = new Gobang(); gobang.init()

github地址
线上地址

原文地址:https://segmentfault.com/a/1190000012218251，作者:咚子

以上就是对JS+canvas实现五子棋人机大战的相关介绍，希望对您学习html5有所帮助，感谢您关注织梦者!

这些内容可能对你也有帮助

更多HTML教程可查看HTML教程列表页。