Javascript Tic Tac Toe- AI问题

时间:2016-07-17 20:41:56

标签: javascript

我正在尝试使用只能获胜或抽奖的人工智能建立一个简单的Tic Tac Toe游戏。我已经采用蛮力方法来构建这个AI,因为minmax方法相当复杂,因为我是javascript的新手。人工智能似乎有效,但我遇到的问题是它在人工智能的转弯时会产生太多的动作,所以有时人工智能将采取两个方格,我希望它只采用一个,有时它会赢得#39完全没有任何动作。

代码:

 $(document).ready(function() {
  var userChoice;
  var computerChoice;
  var dialogBox = $("#dialogBox");
  var s1 = $("#top-left");
  var s2 = $("#top");
  var s3 = $("#top-right");
  var s4 = $("#left");
  var s5 = $("#middle");
  var s6 = $("#right");
  var s7 = $("#bottom-left");
  var s8 = $("#bottom");
  var s9 = $("#bottom-right");
  var turn = 1; // turn 1=computer turn 2=user

  var countMoves = 9;

  renderDialog();
  dialogChoice(); // user chooses X or O
  move();

  // make dialog box
  function renderDialog() {
    var winW = window.innerWidth;
    var centerDialog = (winW / 2) - (600 * 0.5); // to center
    dialogBox.css("display", "block")
    dialogBox.css("left", centerDialog + "px");
    dialogBox.css("top", "100px")
  }
  // make dialog interactive
  function dialogChoice() {
    var cross = $('#cross');
    var circle = $('#circle');

    cross.on("click", function() {
      dialogBox.css("display", "none");
      userChoice = "X";
      computerChoice = "O";
      computerRandom();

    });
    circle.on("click", function() {
      dialogBox.css("display", "none");
      userChoice = "O";
      computerChoice = "X";
      computerRandom();

    });
  }

  // make function to allow user to click on square to move
  function move() {

    $("#top-left").on("click", function() {
      if ($("#top-left").html() === '') {
        $("#top-left").text(userChoice);
        turn = 1;
        userTurn();
      };
    });
    $("#top").on("click", function() {
      if ($("#top").html() === '') {
        $("#top").text(userChoice);
        turn = 1;
        userTurn();
      };
    });
    $("#top-right").on("click", function() {
      if ($("#top-right").html() === '') {
        $("#top-right").text(userChoice);
        turn = 1;
        userTurn();
      }
    });
    $("#left").on("click", function() {
      if ($("#left").html() === '') {
        $("#left").text(userChoice);
        turn = 1;
        userTurn();
      };
    });
    $("#middle").on("click", function() {
      if ($("#middle").html() === '') {
        $("#middle").text(userChoice);
        turn = 1;
        userTurn();
      };
    });
    $("#right").on("click", function() {
      if ($("#right").html() === '') {
        $("#right").text(userChoice);
        turn = 1;
        userTurn();
      };
    });
    $("#bottom-left").on("click", function() {
      if ($("#bottom-left").html() === '') {
        $("#bottom-left").text(userChoice);
        turn = 1;
        userTurn();
      };
    });
    $("#bottom").on("click", function() {
      if ($("#bottom").html() === '') {
        $("#bottom").text(userChoice);
        turn = 1;
        userTurn();
      };
    });
    $("#bottom-right").on("click", function() {
      if ($("#bottom-right").html() === '') {
        $("#bottom-right").text(userChoice);
        turn = 1;
        userTurn();
      };
    });

  };

  // switch turns on every round aswell as check for gameover tests.
  function userTurn() {
    computerAI();

    computerRandom();

    countMoves--;
    console.log(turn);

    if (isWinner() || draw()) {
      countMoves = 9;
      restartGame();
    }

  };

  //check for winner
  function isWinner() {
    var result = false;
    // first row
    if (s1.text() == "X" && s2.text() == "X" && s3.text() == "X" || s1.text() == "O" && s2.text() == "O" && s3.text() == "O") {
      s1.css("background", "green");
      s2.css("background", "green");
      s3.css("background", "green");

      result = true;
      return result;
    }

    //seconds row
    if (s4.text() == "X" && s5.text() == "X" && s6.text() == "X" || s4.text() == "O" && s5.text() == "O" && s6.text() == "O") {
      s4.css("background", "green");
      s5.css("background", "green");
      s6.css("background", "green");

      result = true;
      return result;
    }

    //third row   
    if (s7.text() == "X" && s8.text() == "X" && s9.text() == "X" || s7.text() == "O" && s8.text() == "O" && s9.text() == "O") {
      s7.css("background", "green");
      s8.css("background", "green");
      s9.css("background", "green");

      result = true;
      return result;
    }

    // first column
    if (s1.text() == "X" && s4.text() == "X" && s7.text() == "X" || s1.text() == "O" && s4.text() == "O" && s7.text() == "O") {
      s1.css("background", "green");
      s4.css("background", "green");
      s7.css("background", "green");

      result = true
      return result;
    }
    //second column 
    if (s2.text() == "X" && s5.text() == "X" && s8.text() == "X" || s2.text() == "O" && s5.text() == "O" && s8.text() == "O") {
      s2.css("background", "green");
      s5.css("background", "green");
      s8.css("background", "green");

      result = true
      return result;
    }

    //third column
    if (s3.text() == "X" && s6.text() == "X" && s9.text() == "X" || s3.text() == "O" && s6.text() == "O" && s9.text() == "O") {
      s3.css("background", "green");
      s6.css("background", "green");
      s9.css("background", "green");

      result = true
      return result;
    }

    // first diagonal
    if (s1.text() == "X" && s5.text() == "X" && s9.text() == "X" || s1.text() == "O" && s5.text() == "O" && s9.text() == "O") {
      s1.css("background", "green");
      s5.css("background", "green");
      s9.css("background", "green");

      result = true
      return result;
    }

    //second diagonal
    if (s3.text() == "X" && s5.text() == "X" && s7.text() == "X" || s3.text() == "O" && s5.text() == "O" && s7.text() == "O") {
      s3.css("background", "green");
      s5.css("background", "green");
      s7.css("background", "green");

      result = true
      return result;
    }

  };

  function draw() {
    var result = false;
    if (countMoves == 0) {
      result = true;

    }
    return result;
  }

  function restartGame() {

    setTimeout(function() {
      $(".col-xs-4").text('');
      $(".col-xs-4").css("background", "red");

      if (s5.text() == '') {
        s5.text(computerChoice)

      };

    }, 2000)
  }

  function computerAI() {

    countMoves--;
    if (turn == 1) {
      computerWin()
    };
    if (turn == 1) {
      computerBlock()
    };

    if (turn == 1) {
      computerFork()
    };

    if (turn == 1) {
      blockFork()
    }
    if (turn == 1) {
      computerRandom();
    }

  };

  // computer will block opponent move
  function computerBlock() {
    // first Row1
    if (s1.text() == userChoice && s2.text() == userChoice && s3.text() == '') {

      s3.text(computerChoice);
      turn = 2;
    };
    //first Row2
    if (s3.text() == userChoice && s2.text() == userChoice && s1.text() == '') {
      s1.text(computerChoice);
      turn = 2;
    };
    //first Row3
    if (s1.text() == userChoice && s3.text() == userChoice && s2.text() == '') {
      s2.text(computerChoice);
      turn = 2;
    };
    //second Row
    if (s4.text() == userChoice && s5.text() == userChoice && s6.text() == '') {
      s6.text(computerChoice);
      turn = 2;
    };
    //second Row2
    if (s6.text() == userChoice && s5.text() == userChoice && s4.text() == '') {
      s4.text(computerChoice);
      turn = 2;
    };
    //second Row3
    if (s6.text() == userChoice && s4.text() == userChoice && s5.text() == '') {
      s5.text(computerChoice);
      turn = 2;
    };

    //third row
    if (s7.text() == userChoice && s8.text() == userChoice && s9.text() == '') {
      s9.text(computerChoice);
      turn = 2;
    };
    //third row2
    if (s9.text() == userChoice && s8.text() == userChoice && s7.text() == '') {
      s7.text(computerChoice);
      turn = 2;
    };
    //third Row3
    if (s9.text() == userChoice && s7.text() == userChoice && s8.text() == '') {
      s8.text(computerChoice);
      turn = 2;
    };
    //first column
    if (s1.text() == userChoice && s3.text() == userChoice && s7.text() == '') {
      s7.text(computerChoice);
      turn = 2;
    };
    //first column2
    if (s7.text() == userChoice && s4.text() == userChoice && s1.text() == '') {
      s1.text(computerChoice);
      turn = 2;
    };
    //first column3
    if (s1.text() == userChoice && s7.text() == userChoice && s4.text() == '') {
      s4.text(computerChoice);
      turn = 2;
    };
    //second column
    if (s2.text() == userChoice && s5.text() == userChoice && s8.text() == '') {
      s8.text(computerChoice);
      turn = 2;
    };
    //second column2
    if (s8.text() == userChoice && s5.text() == userChoice && s2.text() == '') {
      s2.text(computerChoice);
      turn = 2;
    };
    //second column3
    if (s2.text() == userChoice && s8.text() == userChoice && s5.text() == '') {
      s5.text(computerChoice);
      turn = 2;
    };
    //third column
    if (s3.text() == userChoice && s6.text() == userChoice && s9.text() == '') {
      s9.text(computerChoice);
      turn = 2;
    };
    //third column2
    if (s9.text() == userChoice && s6.text() == userChoice && s3.text() == '') {
      s3.text(computerChoice);
      turn = 2;
    };
    //third column3
    if (s3.text() == userChoice && s9.text() == userChoice && s6.text() == '') {
      s6.text(computerChoice);
      turn = 2;
    };
    // first diagonal
    if (s1.text() == userChoice && s5.text() == userChoice) {
      s9.text(computerChoice);
      turn = 2;
    };
    //first diagonal 2
    if (s9.text() == userChoice && s5.text() == userChoice && s1.text() == '') {
      s1.text(computerChoice);
      turn = 2;
    };
    // first diagonal 3
    if (s1.text() == userChoice && s9.text() == userChoice && s5.text() == '') {
      s5.text(computerChoice);
      turn = 2;
    };

    //second diagonal
    if (s3.text() == userChoice && s5.text() == userChoice && s7.text() == '') {
      s7.text(computerChoice);
      turn = 2;
    };
    //second diagonal2
    if (s7.text() == userChoice && s5.text() == userChoice && s3.text() == '') {
      s3.text(computerChoice);
      turn = 2;
    };
    //second diagonal 3
    if (s7.text() == userChoice && s3.text() == userChoice && s5.text() == '') {
      s5.text(computerChoice);
      turn = 2;
    };
  };

  // computer will make move to win
  function computerWin() {
    // take third for win
    // first Row1
    if (s1.text() == computerChoice && s2.text() == computerChoice && s3.text() == '') {
      s3.text(computerChoice);
      turn = 2;
    };
    //first Row2
    if (s3.text() == computerChoice && s2.text() == computerChoice) {
      s1.text(computerChoice);
      turn = 2;
    };
    //second Row
    if (s4.text() == computerChoice && s5.text() == computerChoice && s6.text() == '') {
      s6.text(computerChoice);
      turn = 2;
    };
    //second Row2
    if (s6.text() == computerChoice && s5.text() == computerChoice && s4.text() == '') {
      s4.text(computerChoice);
      turn = 2;
    };
    //third row
    if (s7.text() == computerChoice && s8.text() == computerChoice && s9.text() == '') {
      s9.text(computerChoice);
      turn = 2;
    };
    //third row2
    if (s9.text() == computerChoice && s8.text() == computerChoice && s7.text() == '') {
      s7.text(computerChoice);
      turn = 2;
    };
    //first column
    if (s1.text() == computerChoice && s3.text() == computerChoice && s7.text() == '') {
      s7.text(computerChoice);
      turn = 2;
    };
    //first column2
    if (s7.text() == computerChoice && s4.text() == computerChoice && s1.text() == '') {
      s1.text(computerChoice);
      turn = 2;
    };
    //second column
    if (s2.text() == computerChoice && s5.text() == computerChoice && s8.text() == '') {
      s8.text(computerChoice);
      turn = 2;
    };
    //second column2
    if (s8.text() == computerChoice && s5.text() == computerChoice && s2.text() == '') {
      s2.text(computerChoice);
      turn = 2;
    };
    //third column
    if (s3.text() == computerChoice && s6.text() == computerChoice && s9.text() == '') {
      s9.text(computerChoice);
      turn = 2;
    };
    //third column2
    if (s9.text() == computerChoice && s6.text() == computerChoice && s3.text() == '') {
      s3.text(computerChoice);
      turn = 2;
    };
    // first diagonal
    if (s1.text() == computerChoice && s5.text() == computerChoice && s9.text() == '') {
      s9.text(computerChoice);
      turn = 2;
    };
    //first diagonal2
    if (s9.text() == computerChoice && s5.text() == computerChoice && s1.text() == '') {
      s1.text(computerChoice);
      turn = 2;
    };
    //second diagonal
    if (s3.text() == computerChoice && s5.text() == computerChoice && s7.text() == '') {
      s7.text(computerChoice);
      turn = 2;
    };
    //second diagonal2
    if (s7.text() == computerChoice && s5.text() == computerChoice && s3.text() == '') {
      s3.text(computerChoice);
      turn = 2;
    };
  };
  // computer make move to create a fork
  function computerFork() {
    // fork1
    if (s1.text() == computerChoice && s5.text() == computerChoice && s3.text() == '') {
      s3.text(computerChoice);
      turn = 2;
    };
    //fork2
    if (s3.text() == computerChoice && s5.text() == computerChoice && s1.text() == '') {
      s1.text(computerChoice);
      turn = 2;
    };
    //fork3
    if (s7.text() == computerChoice && s5.text() == computerChoice && s9.text() == '') {
      s9.text(computerChoice);
      turn = 2;
    };
    //fork4
    if (s9.text() == computerChoice && s5.text() == computerChoice && s7.text() == '') {
      s7.text(computerChoice);
      turn = 2;
    };

  };

  function blockFork() {
    // fork1
    if (s1.text() == userChoice && s5.text() == userChoice && s3.text() == '') {
      s3.text(computerChoice);
      turn = 2;
    };
    //fork2
    if (s3.text() == userChoice && s5.text() == userChoice && s1.text() == '') {
      s1.text(computerChoice);
      turn = 2;
    };
    //fork3
    if (s7.text() == userChoice && s5.text() == userChoice && s9.text() == '') {
      s9.text(computerChoice);
      turn = 2;
    };
    //fork4
    if (s9.text() == userChoice && s5.text() == userChoice && s7.text() == '') {
      s7.text(computerChoice);
      turn = 2;
    };
  };

  function computerRandom() {

    var squareArr = [s1, s2, s3, s4, s5, s6, s7, s8, s9];
    var randomNum = Math.floor(Math.random() * 8);

    if (squareArr[randomNum].text() == '') {
      squareArr[randomNum].text(computerChoice);
      squareArr.splice(randomNum, 1);
      turn = 2;

    }
  };

});

例如:http://codepen.io/aliz16/full/yJgQQd/

1 个答案:

答案 0 :(得分:0)

检查为电脑播放的功能。

我们以computerWin为例。什么阻止功能制作多个标记?有几个条件可能是真的。委派转牌并不会停止支票。

P.S。并非所有的行都是正确的。