JavaScript Tic-Tac-Toe AI (Minimax algorithm) Throwing Error -


i'm writing simple tic-tac-toe game, , i'm using minimax algorithm write ai, id doesn't work code seems loop forever, think made mistake recursion.

can please help? here codepen: https://codepen.io/jonnnyk20/pen/brveyk

thank you! here code

$( document ).ready(function() {    const player_token = 'x';    const computer_token = 'o';        const grid = [      [' ', ' ', ' '],      [' ', ' ', ' '],      [' ', ' ', ' ']    ];    //initialize      //  (var = 0;  < 3; i++){      //   (var j = 0;  j < 3; j++){      //     $('.col[data-i='+ +'][ data-j=' + j + ']').html(grid[i][j]);      //   }      // }        function isgameover(grid){      // check if game on        //check horizontal      (var = 0;  < 3; i++){        if (grid[i][0] !== ' ' &&            grid[i][0] === grid[i][1] &&            grid[i][0] === grid[i][2]) {            return grid[i][0];        }      }         //check vertical      (var j = 0;  j < 3; j++){        if (grid[0][j] !== ' ' &&            grid[0][j] === grid[1][j] &&            grid[0][j] === grid[2][j]) {            return grid[0][j];        }      }        //check diagonal - top left bottom right        if (grid[0][0] !== ' ' &&            grid[0][0] === grid[1][1] &&            grid[0][0] === grid[2][2]) {            return grid[0][0];        }         //check diagonal - bottom left top right        if (grid[2][0] !== ' ' &&            grid[2][0] === grid[1][1] &&            grid[2][0] === grid[0][2]) {            return grid[2][0];        }          (var = 0;  < 3; i++){        (var j = 0;  j < 3; j++){            if (grid[i][j] === ' '){              return false;            }        }      }      return null;    }        var loop = 0; // helps debugging      function minmax(newgrid, depth, player){      loop++;      console.log("loop: "+loop);      console.log("depth: " + depth);      const gamestatus = isgameover(newgrid);      console.log(gamestatus);      console.log(newgrid);            if (gamestatus === false){        var values = [];        (var = 0;  < 3; i++){        (var j = 0;  j < 3; j++){            var gridcopy = _.clonedeep(newgrid);             if (gridcopy[i][j] !== ' ') continue;             gridcopy[i][j] = player;             var value = minmax(gridcopy, depth + 1, (player === player_token) ? computer_token : player_token)             values.push({              cost: value,              cell: {                i: i,                j: j              }             });        }      }        console.log("values");        console.log(values);        if (player === computer_token){          let max = _.maxby(values, (v) => {            return v.cost;          });            if (depth === 0) {            return max.cell;          } else {            return max.cost;          }          } else {           var min = _.minby(values, (v) => {            return v.cost;          });            if (depth === 0) {            return min.cell;          } else {            return min.cost;          }          }            } else if ( gamestatus === null) {        return 0;      } else if ( gamestatus === player_token ) {        return depth - 10;      } else if ( gamestatus === computer_token ) {        return 10 - depth;      }      }      function moveai(){      return minmax(grid, 0, computer_token);    }     //move user    $('.col').click(function(){      $this = $(this);      $this.html(player_token);      const = $this.data('i');      const j = $this.data('j');      grid[i][j] = player_token;        let gamestate = isgameover(grid);      if (gamestate) {         console.log("done! " + gamestate + " wins!");         return;      } else {        // move ai / computer        console.log("nah!");        const move = moveai();        grid[move.i][move.j] = computer_token;        $('.col[data-i='+ move.i +'][ data-j=' + move.j + ']').html(computer_token);      }         gamestate = isgameover(grid);      if(gamestate) {        console.log("done! " + gamestate + " wins!");      }      });      var rstart =  function(){    console.log("restart!");       (var = 0;  < 3; i++){        (var j = 0;  j < 3; j++){            grid[i][j] = ' ';             $('.col[data-i='+ +'][ data-j=' + j + ']').html(' ');        }      }      }      $('#rstart').click(function(){    rstart();  });          });
td {      border: solid 1px;      padding: 4px;  }    #old {    display: none;  }    body{    margin: 8px;    margin-top: 10px;    background-color: skyblue;    text-align: center;  }  .row {    width: 50%;    margin: auto;    }    .col {    display: inline-block;    min-width: 110px;    min-height: 110px;    text-align: center;    background-color: white;    margin: 2px;    font-size: 40px;    padding: 20px;    padding-top: 30px;    }    button {    padding: 20px;    font-size: 30px;    margin-top: 10px;  }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoiresju2yc3z8gv/npezwav56rsmlldc3r/azzgrngxqqknkkofvhfqhnuweyj" crossorigin="anonymous">  <script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha384-a7fzj7v+d/sdmmqp/noqwlilvusjfdhw+k9omg/a/eheadgtzns3hpfag6ed950n" crossorigin="anonymous"></script>  <script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" integrity="sha384-dztdapbwprxsa/3eyeeuwrwcy7g5kfbe8ffjk5jaixuyhkkdx6qin1dkwx51bbrb" crossorigin="anonymous"></script>  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" integrity="sha384-vbwwzlzj8ea9acx4pew3rvhjgjt7zpknpzk+02d9phzyevke+jo0iegizqplforn" crossorigin="anonymous"></script>


Comments

Popular posts from this blog

ubuntu - PHP script to find files of certain extensions in a directory, returns populated array when run in browser, but empty array when run from terminal -

php - How can i create a user dashboard -

javascript - How to detect toggling of the fullscreen-toolbar in jQuery Mobile? -