本文实例为大家分享了canvas实现五子棋游戏的具体代码，供大家参考，具体内容如下

html部分

  
  
  


  
  
五子棋
  
轮到:黑
  胜者:

外部js文件部分

let gomoku = new Array(15)
for(let i = 0;i=0)?
     totalLength++:bflag=false
   }
   break;
 case 1:
   if(aflag){
     (gomoku[curnode[0]][curnode[1]+dictNum]===colorflag)
     &&((curnode[1]+dictNum)<=14)?
     totalLength++:aflag=false
   }
   if(bflag){
     (gomoku[curnode[0]][curnode[1]-dictNum]===colorflag)
     &&((curnode[1]-dictNum)>=0)?
     totalLength++:bflag=false
   }
   break;
 case 2:
   if(aflag){
     (gomoku[curnode[0]+dictNum][curnode[1]+dictNum]===colorflag)
     &&((curnode[1]+dictNum)<=14)
     &&((curnode[0]+dictNum)<=14)?
     totalLength++:aflag=false
   }
   if(bflag){
     (gomoku[curnode[0]-dictNum][curnode[1]-dictNum]===colorflag)
     &&((curnode[1]-dictNum)>=0)
     &&((curnode[0]-dictNum)>=0)?
     totalLength++:bflag=false
   }
   break;
 case 3:
   if(aflag){
     (gomoku[curnode[0]+dictNum][curnode[1]-dictNum]===colorflag)
     &&((curnode[1]-dictNum)>=0)
     &&((curnode[0]+dictNum)<=14)?
     totalLength++:aflag=false
   }
   if(bflag){
     (gomoku[curnode[0]-dictNum][curnode[1]+dictNum]===colorflag)
     &&((curnode[1]+dictNum)<=14)
     &&((curnode[0]-dictNum)>=0)?
     totalLength++:bflag=false
   }
   break;
      }
      if(totalLength>=5){
 if(colorflag===0){
   document.getElementById('res').innerHTML='胜者:黑方'
   cav.removeEventListener("click",initer)
 }else{
   document.getElementById('res').innerHTML='胜者:白方'
   cav.removeEventListener("click",initer)
 }
 break;
      }
      if((aflag===false)&&(bflag===false)){
 break;
      }
    }
    if(totalLength>=5){
      break;
    }
  }
}
//all work and no play makes jack a dull boy

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持考高分网。