自己写的javascript五子棋

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>five-in-a-raw</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <style>
 <!--
  table{text-align: center;font-size: 20px;cursor: hand;empty-cells: show;table-layout: fixed;}
 -->
 </style>
  </head>
  <script type="text/javascript">
 <!--
 function FiveRawGame(){
  this.redChess="<font color=/"red/">X</font>";
  this.blackChess="<font color='black'>O</font>";
  //初始化棋盘和数据
  this.init=function(){
   var str="<table  width=/"600/" height=/"600;/" border=/"1/" cellpadding=/"0/" cellspacing=/"0/"  >";
   for(var i=0;i<25;i++){
    str+="<tr height='7'>";
    for(var j=0;j<25;j++){
     str+="<td id='r"+i+"c"+j+"' onclick=/"FiveRawGame.chess("+i+","+j+")/" onmouseover=/"FiveRawGame.showMsg("+i+","+j+")/">&nbsp;</td>";
    }
    str+="</tr>";
   }
   str+="</table>";
   document.getElementById("main").innerHTML=str;
   this.allGrids=new Array();
   for(var a=0;a<25;a++){
    this.allGrids[a]=new Array();
   }
   for(var i=0;i<25;i++){
    for(var j=0;j<25;j++){
     this.allGrids[i][j]=new grid(i,j,"O");
    }
   }
   this.isChess=true;
   this.redArr=new Array();
   this.blackArr=new Array();
   this.allArr=new Array();
  };
 }
 FiveRawGame.prototype.chess=function(i,j){
  if(this.isChess&&this.allGrids[i][j].piece=='O'){
   document.getElementById("r"+i+"c"+j).innerHTML=this.blackChess;
   this.isChess=false;
   this.allGrids[i][j].piece="B";
   //把该步棋子装入黑方数组
   this.blackArr[this.blackArr.length]=this.allGrids[i][j];
   this.allArr[this.allArr.length]=this.allGrids[i][j];
   //判断输赢 赢则结束游戏
   //给该棋子8个方向的棋子赋值
   this.insertPiece(i,j,'B');
   //调用红方下子
   this.computerChess();
  }else{
   document.getElementById("msg").innerHTML="请等红方下完!";
  }
 };
 FiveRawGame.prototype.computerChess=function(){//电脑下棋
  //1、找玩家最后一颗棋子四个方向个有几个?顺便赋值
  var hasGrid;
  hasGrid=this.assignPiece(this.blackArr[this.blackArr.length-1]);
  if(hasGrid==null||hasGrid==false)return;
  //2、找自己是否有走一颗棋子就直接胜利的位置
   hasGrid=this.enumeration("R",1);
   if(hasGrid==null||hasGrid==false){
    //3、找对方是否有走一颗棋子就直接胜利的位置
     hasGrid=this.enumeration("B",1);
     if(hasGrid==null||hasGrid==false){
      //4、找对方是否有走一颗棋子就堵不住的位置
      hasGrid=this.enumeration("B",2);
      if(hasGrid==null||hasGrid==false){
      //5、找自己是否有走一颗棋子就堵不住的位置
       hasGrid=this.enumeration("R",2);
       if(hasGrid==null||hasGrid==false){
        //6、否则找最优最好位置堵
        hasGrid=this.assignPiece(this.blackArr[this.blackArr.length-1]);
        if(hasGrid==null||hasGrid==false)return;
        if(hasGrid==true){
         for(var j=this.redArr.length-1;j>=0;j--){
          hasGrid=this.assignPiece(this.redArr[j]);
          if(hasGrid!=null&&hasGrid!=false&&hasGrid!==true)
          break;
         }
        }
       }
      }
     }
   }
  var r=hasGrid.rowNum;
  var c=hasGrid.colNum;
  this.allGrids[r][c].piece="R";
  document.getElementById("r"+r+"c"+c).innerHTML=this.redChess;
  this.redArr[this.redArr.length]=this.allGrids[r][c];
  this.allArr[this.allArr.length]=this.allGrids[r][c];
  this.isChess=true;
  //给该棋子8个方向的棋子赋值
  this.insertPiece(r,c,'R');
  this.assignPiece(this.allGrids[r][c]);
  return;
 };
 //找出这个棋子四个方向的数量,并且返回该棋子四周最好下子的位置
 FiveRawGame.prototype.assignPiece=function(grid){
  var piece=grid.piece;
  this.goodChess=new Array();
  //横向
  var count=0;
  var r=grid.rowNum;
  var c=grid.colNum;
  //alert(r+","+c+","+piece);
  do{c--;}while(c>=0&&this.allGrids[r][c].piece==piece);
  this.goodChess[this.goodChess.length]=this.allGrids[r][c];
  do{c++;count++;}while(c<25&&this.allGrids[r][c].piece==piece);
  this.goodChess[this.goodChess.length]=this.allGrids[r][c];
  this.allGrids[grid.rowNum][grid.colNum].num1=count-1;
  var num1=count-1;
  //alert(r+","+c+","+this.allGrids[r][c].piece+","+(count-1));
  //竖向
  var count=0;
  var r=grid.rowNum;
  var c=grid.colNum;
  do{r--;}while(r>=0&&this.allGrids[r][c].piece==piece);
  this.goodChess[this.goodChess.length]=this.allGrids[r][c];
  do{r++;count++;}while(r<25&&this.allGrids[r][c].piece==piece);
  this.goodChess[this.goodChess.length]=this.allGrids[r][c];
  this.allGrids[grid.rowNum][grid.colNum].num2=count-1;
  var num2=count-1;
  //撇向
  var count=0;
  var r=grid.rowNum;
  var c=grid.colNum;
  do{r++;c--;}while(r<25&&c>=0&&this.allGrids[r][c].piece==piece);
   this.goodChess[this.goodChess.length]=this.allGrids[r][c];
  do{r--;c++;count++;}while(r>=0&&c<25&&this.allGrids[r][c].piece==piece);
   this.goodChess[this.goodChess.length]=this.allGrids[r][c];
  this.allGrids[grid.rowNum][grid.colNum].num3=count-1;
  var num3=count-1;
  //捺向
  var count=0;
  var r=grid.rowNum;
  var c=grid.colNum;
  do{r--;c--;}while(c>=0&&this.allGrids[r][c].piece==piece&&r>=0);
   this.goodChess[this.goodChess.length]=this.allGrids[r][c];
  do{r++;c++;count++;}while(r<25&&c<25&&this.allGrids[r][c].piece==piece);
   this.goodChess[this.goodChess.length]=this.allGrids[r][c];
  this.allGrids[grid.rowNum][grid.colNum].num4=count-1;
  var num4=count-1;
  var maxValue=0;
  maxValue=Math.max(num1,num2);
  maxValue=Math.max(maxValue,num3);
  maxValue=Math.max(maxValue,num4);
  if(maxValue>=5){
   if(piece=='R'){
    alert("红方胜出!");
    if(window.confirm("是否重新开局?")){
    this.init();
    }
    return false;
   }else if(piece=='B'){
    alert("黑方胜出!");
    if(window.confirm("是否重新开局?")){
    this.init();
    }
    return false;
   }
  }
  //判断哪个值与最大值相同
  if(maxValue==num1){
   if(this.goodChess[0].piece=="O")return this.goodChess[0];
   if(this.goodChess[1].piece=="O")return this.goodChess[1];
  }
  if(maxValue==num2){
   if(this.goodChess[2].piece=="O")return this.goodChess[2];
   if(this.goodChess[3].piece=="O")return this.goodChess[3];
  }
  if(maxValue==num3){
   if(this.goodChess[4].piece=="O")return this.goodChess[4];
   if(this.goodChess[5].piece=="O")return this.goodChess[5];
  }
  if(maxValue==num4){
   if(this.goodChess[6].piece=="O")return this.goodChess[6];
   if(this.goodChess[7].piece=="O")return this.goodChess[7];
  }
  return true;
 };
 FiveRawGame.prototype.insertPiece=function(i,j,piece){
  var row=i;
  var col=j;
  //找出四个方向的属于自己的棋子并且逐个加1
  while(row-1>=0&&col-1>=0&&this.allGrids[row-1][col-1].piece==piece){//左上
   this.allGrids[row-1][col-1].num4=this.allGrids[row-1][col-1].num4+1;
   row--;
   col--;
   if(this.allGrids[row-1][col-1].piece!=piece)break;
  }
  row=i;
  col=j;
  while(row-1>0&&this.allGrids[row-1][col].piece==piece){//上
   this.allGrids[row-1][col].num4=this.allGrids[row-1][col].num4+1;
   row--;
   if(this.allGrids[row-1][col].piece!=piece)break;
  }
  row=i;
  col=j;
  while(row-1>=0&&col+1>=0&&this.allGrids[row-1][col+1].piece==piece){//右上
   this.allGrids[row-1][col+1].num4=this.allGrids[row-1][col+1].num4+1;
   row--;
   col++;
   if(this.allGrids[row-1][col+1].piece!=piece)break;
  }
  row=i;
  col=j;
  while(col-1>0&&this.allGrids[row][col-1].piece==piece){//左
   this.allGrids[row][col-1].num4=this.allGrids[row][col-1].num4+1;
   col--;
   if(this.allGrids[row][col-1].piece!=piece)break;
  }
  row=i;
  col=j;
  while(col+1>0&&this.allGrids[row][col+1].piece==piece){//右
   this.allGrids[row][col+1].num4=this.allGrids[row][col+1].num4+1;
   col++;
   if(this.allGrids[row][col+1].piece!=piece)break;
  }
  row=i;
  col=j;
  while(row+1>=0&&col-1>=0&&this.allGrids[row+1][col-1].piece==piece){//左下
   this.allGrids[row+1][col-1].num4=this.allGrids[row+1][col-1].num4+1;
   row++;
   col--;
   if(this.allGrids[row+1][col-1].piece!=piece)break;
  }
  row=i;
  col=j;
  while(row+1>0&&this.allGrids[row+1][col].piece==piece){//下
   this.allGrids[row+1][col].num4=this.allGrids[row+1][col].num4+1;
   row++;
   if(this.allGrids[row+1][col].piece!=piece)break;
  }
  row=i;
  col=j;
  while(row+1>=0&&col+1>=0&&this.allGrids[row+1][col+1].piece==piece){//右下
   this.allGrids[row+1][col+1].num4=this.allGrids[row+1][col+1].num4+1;
   row++;
   col++;
   if(this.allGrids[row+1][col+1].piece!=piece)break;
  }
 };
 FiveRawGame.prototype.enumeration=function(piece,stype){
  var checks=this.allGrids;
  var canX="";
  //找出所有没有下棋子的,并且在距离它两个子内没有棋子的
  var len=this.allArr.length;
  for(var i=0;i<len;i++){
   var r=this.allArr[i].rowNum;
   var c=this.allArr[i].colNum;
   //找该棋子附近的24个位置
   if(r-2>=0&&c-2>=0&&checks[r-2][c-2].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r-2)+","+(c-2);
   if(r-2>=0&&c-1>=0&&checks[r-2][c-1].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r-2)+","+(c-1);
   if(r-2>=0&&checks[r-2][c].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r-2)+","+(c);
   if(r-2>=0&&c+1<25&&checks[r-2][c+1].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r-2)+","+(c+1);
   if(r-2>=0&&c+2<25&&checks[r-2][c+2].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r-2)+","+(c+2);
   if(r-1>=0&&c-2>=0&&checks[r-1][c-2].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r-1)+","+(c-2);
   if(r-1>=0&&c-1>=0&&checks[r-1][c-1].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r-1)+","+(c-1);
   if(r-1>=0&&checks[r-1][c].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r-1)+","+(c);
   if(r-1>=0&&c+1<25&&checks[r-1][c+1].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r-1)+","+(c+1);
   if(r-1>=0&&c+2<25&&checks[r-1][c+2].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r-1)+","+(c+2);
   if(c-2>=0&&checks[r][c-2].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r)+","+(c-2);
   if(c-1>=0&&checks[r][c-1].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r)+","+(c-1);
   if(c+1<25&&checks[r][c+1].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r)+","+(c+1);
   if(c+2<25&&checks[r][c+2].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r)+","+(c+2);
   if(r+1>=0&&c-2>=0&&checks[r+1][c-2].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r+1)+","+(c-2);
   if(r+1>=0&&c-1>=0&&checks[r+1][c-1].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r+1)+","+(c-1);
   if(r+1>=0&&checks[r+1][c].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r+1)+","+(c);
   if(r+1>=0&&c+1<25&&checks[r+1][c+1].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r+1)+","+(c+1);
   if(r+1>=0&&c+2<25&&checks[r+1][c+2].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r+1)+","+(c+2);
   if(r+2>=0&&c-1>=0&&checks[r+2][c-2].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r+2)+","+(c-2);
   if(r+2>=0&&c-1>=0&&checks[r+2][c-1].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r+2)+","+(c-1);
   if(r+2>=0&&checks[r+2][c].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r+2)+","+(c);
   if(r+2>=0&&c+1<25&&checks[r+2][c+1].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r+2)+","+(c+1);
   if(r+2>=0&&c+2<25&&checks[r+2][c+2].piece=="O")if(canX.indexOf(r+","+c)==-1)canX+="@"+(r+2)+","+(c+2);
  }
  var arrlen=canX.split("@");
  for(var j=0;j<arrlen.length;j++){
   if(arrlen[j]!=null&&arrlen[j]!=""){
    var r=arrlen[j].split(",")[0];
    var c=arrlen[j].split(",")[1];
    checks=new Array();
    checks=this.allGrids;
    //把棋子放在这个位置,看能发生什么状况
    checks[r][c].piece=piece;
    var has=findGD(r,c,checks,stype);
    this.allGrids[r][c].piece="O";
    if(has){
     return this.allGrids[r][c];
    }
   }
  }
  return false;
 };
 function findGD(sr,sc,checks,stype){
  var grid=checks[sr][sc];
  var piece=grid.piece;
  var testChess=new Array();
  //横向
  var count=0;
  var r=sr;
  var c=sc;
  while(c>0&&checks[r][c].piece==piece){c--;}
  testChess[testChess.length]=checks[r][c];
  do{c++;count++;}while(c<24&&checks[r][c].piece==piece);
  testChess[testChess.length]=checks[r][c];
  checks[grid.rowNum][grid.colNum].num1=count-1;
  var num1=count-1;
  //竖向
  var count=0;
  var r=sr;
  var c=sc;
  while(r>0&&checks[r][c].piece==piece){r--;}
  testChess[testChess.length]=checks[r][c];
  do{r++;count++;}while(r<24&&checks[r][c].piece==piece);
  testChess[testChess.length]=checks[r][c];
  checks[grid.rowNum][grid.colNum].num2=count-1;
  var num2=count-1;
  //撇向
  var count=0;
  var r=sr;
  var c=sc;
  while(r<24&&c>0&&checks[r][c].piece==piece){r++;c--;}
   testChess[testChess.length]=checks[r][c];
  do{r--;c++;count++;}while(r>0&&c<24&&checks[r][c].piece==piece);
   testChess[testChess.length]=checks[r][c];
  checks[grid.rowNum][grid.colNum].num3=count-1;
  var num3=count-1;
  //捺向
  var count=0;
  var r=sr;
  var c=sc;
  while(c>0&&r>0&&checks[r][c].piece==piece){r--;c--;}
   testChess[testChess.length]=checks[r][c];
  do{r++;c++;count++;}while(r<24&&c<24&&checks[r][c].piece==piece);
   testChess[testChess.length]=checks[r][c];
  checks[grid.rowNum][grid.colNum].num4=count-1;
  var num4=count-1;
  var maxValue=0;
  maxValue=Math.max(num1,num2);
  maxValue=Math.max(maxValue,num3);
  maxValue=Math.max(maxValue,num4);
  var allNum=0;
  //判断哪个值与最大值相同
  if(maxValue==num1){
   if(maxValue>=5)return true;
   if(stype==2&&maxValue==4&&testChess[0].piece=="O"&&testChess[1].piece=="O")return true;
   if(stype==2&&maxValue==3&&testChess[0].piece=="O"&&testChess[1].piece=="O")allNum++;
  }
  if(maxValue==num2){
   if(maxValue>=5)return true;
   if(stype==2&&maxValue==4&&testChess[2].piece=="O"&&testChess[3].piece=="O")return true;
   if(stype==2&&maxValue==3&&testChess[2].piece=="O"&&testChess[3].piece=="O")allNum++;
  }
  if(maxValue==num3){
   if(maxValue>=5)return true;
   if(stype==2&&maxValue==4&&testChess[4].piece=="O"&&testChess[5].piece=="O")return true;
   if(stype==2&&maxValue==3&&testChess[4].piece=="O"&&testChess[5].piece=="O")allNum++;
  }
  if(maxValue==num4){
   if(maxValue>=5)return true;
   if(stype==2&&maxValue==4&&testChess[6].piece=="O"&&testChess[7].piece=="O")return true;
   if(stype==2&&maxValue==3&&testChess[6].piece=="O"&&testChess[7].piece=="O")allNum++;
  }
  if(allNum>1){
   return true;
  }else{
   return false;
  }
 }
 FiveRawGame.prototype.showMsg=function (i,j){
  var grid=this.allGrids[i][j];
  var msg="坐标:X:"+i+",Y:"+j;
  //+"<br>"+grid.piece;
  document.getElementById("showMsg").innerHTML=msg;
 };
 //格子对象
 function grid(r,c,piece){
  this.rowNum=r;
  this.colNum=c;
  this.piece=piece;
  //4个方向各有几个自己的棋子
  this.num1=0;//横
  this.num2=0;//竖
  this.num3=0;//撇
  this.num4=0;//捺
 };
 //-->
 </script>
  <body bgcolor="#ffffff" >
   <div id="main" style="float: left;width: 60%;">
   </div>
   <div style="float:right;width: 35%;" >
    <b style="color:red;">红方:&nbsp;&nbsp;&nbsp;&nbsp;X&nbsp;&nbsp;&nbsp;&nbsp;电脑</b><br><br>
    <b style="color:black;">黑方:&nbsp;&nbsp;&nbsp;&nbsp;O&nbsp;&nbsp;&nbsp;&nbsp;玩家</b><br><br>
    <b style="color:black;">黑方先手!</b><br><br>
    <div id="msg" style="color: green;font-size: 20;"></div>
    <div id="showMsg" style="color: green;font-size: 20;"></div>
    <div id="error" style="color: green;font-size: 20;"></div>
   </div>
  </body>
<script type="text/javascript">
<!--
 function   document.oncontextmenu(){event.returnValue=false;}//屏蔽鼠标右键
 window.FiveRawGame=new FiveRawGame();
 FiveRawGame.init();
//-->
</script>   
</html>

 

<!--上面代码复制保存,欢迎交流指正-->

阅读更多
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/spring1986/article/details/5631744
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭