Question

我只是选择了JavaScript并希望让我的tic-tac-toe游戏面向对象。现在我无法让我的球员轮流上场。下面我创建了一个全局变量turn，以true开头，然后在玩家点击棋盘时在true和false之间切换。此处未提供HTML，但3x3板中的每个网格都是一个表单。

如果turn === true，它应该是播放器_1，而播放器_2则不是，但它不起作用。关于我应该做些什么才能做到正确的任何想法？我理解＆＃34; if ... else if＆＃34;底部的声明只运行一次，这就是为什么它不起作用。关于我的条件陈述应该在什么地方和哪里工作的任何想法？

$(document).ready(function() {

 var turn = true;

  var Player = function(id,symbol){
    this.symbol = symbol;
    this.id = id;

  function playerMove(player){
    $("#tictac").on("click", function(event){
      event.preventDefault();
      var $button = $(event.target);
      $button.val(symbol);
      turn = turn ? false : true;
      console.log(checkIfWinner());
      console.log("turn:"+turn);
      })
    };
    this.playerMove = playerMove;

  function checkIfWinner(player) {
    var $board = $("#tictac").children();

    if ($board.find("#cell0").children().val() == symbol &&
       $board.find("#cell1").children().val() == symbol &&
       $board.find("#cell2").children().val() == symbol)
    return true;

    if ($board.find("#cell2").children().val() == symbol &&
       $board.find("#cell5").children().val() == symbol &&
       $board.find("#cell8").children().val() == symbol)
    return true;

    if($board.find("#cell0").children().val() == symbol &&
      $board.find("#cell3").children().val() == symbol &&
      $board.find("#cell6").children().val() == symbol)
    return true;

    if ($board.find("#cell0").children().val() == symbol &&
      $board.find("#cell4").children().val() == symbol &&
      $board.find("#cell8").children().val() == symbol)
    return true;

    if ($board.find("#cell2").children().val() == symbol &&
      $board.find("#cell4").children().val() == symbol &&
      $board.find("#cell6").children().val() == symbol)
    return true;

    if ($board.find("#cell3").children().val() == symbol &&
      $board.find("#cell4").children().val() == symbol &&
      $board.find("#cell5").children().val() == symbol)
    return true;

    if ($board.find("#cell6").children().val() == symbol &&
      $board.find("#cell7").children().val() == symbol &&
      $board.find("#cell8").children().val() == symbol)
    return true;

    if ($board.find("#cell1").children().val() == symbol &&
      $board.find("#cell4").children().val() == symbol &&
      $board.find("#cell7").children().val() == symbol)
    return true;

  return false;
  }
  this.checkIfWinner = checkIfWinner;
};

  var startGame = function(player_1,player_2){
    this.player_1 = player_1;
    this.player_2 = player_2;
    setMessage('<p>'+ player_1.symbol + ' starts the game</p>');

  function setMessage(msg){
    $("#message").html(msg);
  };

};

var player_1 = new Player(1,"X");
var player_2 = new Player(2,"O");
var game = new startGame(player_1,player_2);

if (turn === true){
  game.player_1.playerMove();
}
else if (turn === false){
  game.player_2.playerMove();   
}

game.player_1.playerMove();

});

Answer 1

这还不够：

if (turn === true){
  game.player_1.playerMove();
}
else if (turn === false){
  game.player_2.playerMove();   
}

你必须否定turn。此外，您可以简化if ... else条件：

if (turn) {
  game.player_1.playerMove();
} else {
  game.player_2.playerMove();
}
turn = !turn;  // Negate the value to alternate moves.

如果您愿意，可以更简洁地编写玩家动作：

game['player_' + (turn ? '1' : '2')].playerMove();

别忘了让玩家在某种循环中移动：

while (true) {
  // Make the player move.
  // Check if the game is over.
  // Has the player won? Is the board full? Display an appropriate message.
  if (gameOver) {
    break;  // Break out of the loop if the game is over.
  }
  turn = !turn;
}

让玩家轮流在JavaScript中玩tic-tac-toe

1 个答案: