Javascript中的Tic Tac Toe - 获奖者问题

时间:2016-05-23 02:33:13

标签: javascript tic-tac-toe

我正在尝试使用Javascript Tic-Tac-Toe游戏。除了一个序列之外,它在所有方面都能正常工作,并且不确定为什么会发生此错误。

基本结构是每个图块发送一个ID号并且点击,图块得到x / o,记录整个图案并将自由正方形插入到自由数组中。由于这是人类与AI,因此每次单击活动(选定的ID-x或o)时,该值将设置为图块,而非活动值将自动放置在空闲图块中。

我的JSFiddle在这里:https://jsfiddle.net/vaspv/Lqoct19a/18/

JS代码如下:

var aid = "x"; //the selection variable
var iid = "o"; // the inactive variable
var live = []; //live rendering of patterns
var free = []; // shows the free boxes in zero array 
var squaresFilled = 0;

live = ["f", "f", "f", "f", "f", "f", "f", "f", "f"];
wins = [
[0, 1, 2],
[3, 4, 5],
[6, 7, 8],
[0, 3, 6],
[1, 4, 7],
[2, 5, 8],
[0, 4, 8],
[2, 4, 6]
];

function setval(bno) {

checkfree();

//if cell is free, enter active id, check for winning combinations and update free array
if (live[bno - 1] == "f") {

document.getElementById("c" + bno).innerHTML = aid;
document.getElementById("c" + bno).style.color = 'skyblue';
live.splice(bno - 1, 1, aid);
squaresFilled++;
checkfree();

// if cell is free and total squares are less than or equal to 8, auto set the inactive variable. this is done to ensure that on 9th turn there is no waiting for auto set. Check for winning combinations of inactive variable and update free array


if (squaresFilled < 9) {
  var fid = free[0];
  var fidd = fid + 1;
  document.getElementById("c" + fidd).innerHTML = iid;
  live.splice(fidd - 1, 1, iid);
  squaresFilled++;
  myResulty(live[fidd - 1]);
}
checkfree();
myResult(live[bno - 1]);

//document.getElementById("test1").innerHTML = free + " / " + live;   This statement is only there to uncomment and add to p text to see arrays unfolding

} else alert("cell is already filled");

} // end of setval function

function myReload() {
location.reload(true);
}

// allows user selection of active id. if blank, value is x.

function seto() {
  aid = "o";
 iid = "x";
 document.getElementById("buttono").style.color = 'skyblue';
 document.getElementById("buttonx").style.color = 'coral';
}

function setx() {
  aid = "x";
  iid = "o";
 document.getElementById("buttonx").style.color = 'skyblue';
document.getElementById("buttono").style.color = 'coral';
}

//resets and inserts free tiles in array

function checkfree() {
free = [];
for (var i = 0; i < 9; i++)
 if (live[i] == "f")
  free.push(i);
 }

// winners using active id
function myResult(wid) {
 for (var a = 0; a < 9; a++) {
 if (live[wins[a][0]] == wid &&
  live[wins[a][1]] == wid &&
  live[wins[a][2]] == wid) {
  alert("The Winner is " + wid);
  myReload();
    }
  }
}

// winners using inactive id

function myResulty(wido) {
  for (var b = 0; b < 9; b++) {
    if (live[wins[b][0]] == wido &&
      live[wins[b][1]] == wido &&
      live[wins[b][2]] == wido) {
      alert("The Winner is " + wido);
      myReload();
    }
  }
}

我遇到的问题是,当我在侧栏中插入3x时,不会立即声明获胜者。要复制,在前三个回合中,在图块3,6和9中输入X.没有通知获胜者是x。现在在图块7和8中输入两个x值。现在提供两个获胜通知。

不确定为什么?有任何想法吗?谢谢!

1 个答案:

答案 0 :(得分:1)

您的错误正在停止myResult

for (var a = 0; a < 9; a++) {
    if (live[wins[a][0]] == wid &&
                  ^a goes up to 8 but wins has 7 elements