我正在尝试理解React TicTacToe教程。他们的calculateWinner帮助程序功能如何运行?

时间:2018-12-11 18:11:12

标签: javascript reactjs

首先,这不是对React tutorial function calculateWinner(squares) don't understand的欺骗。

https://reactjs.org/tutorial/tutorial.html#declaring-a-winner

function calculateWinner(squares) {
    const lines = [
    [0, 1, 2],
    [3, 4, 5],
    [6, 7, 8],
    [0, 3, 6],
    [1, 4, 7],
    [2, 5, 8],
    [0, 4, 8],
    [2, 4, 6],
  ];


  for (let i = 0; i < lines.length; i++){
    const[a, b, c] = lines[i];
    if (squares[a] && squares[a] === squares[b] && squares[a] === squares[c]){
      return squares[a];
    }

  }
  return null;
}

const[a, b, c] = lines[i];的作用是什么?什么是方格[a],方格[b]和方格[c]?我知道lines数组包含导致获胜的所有正方形位置组合,但是我不明白它们是如何定义和比较的,并且本教程实际上没有提供任何解释,只是“这是一个辅助函数这样就可以了。”

2 个答案:

答案 0 :(得分:0)

lines[i]是指三个值([0, 1, 2][3, 4, 5]等)的八个组合之一。 const[a, b, c] = lines[i];将这三个值分配给变量abc。这使得以下if语句中的条件更加简洁,因为这三个变量被用作squares数组的索引。

答案 1 :(得分:0)

const[a, b, c] = lines[i];

等同于

const a = lines[i][0];
const b = lines[i][1];
const c = lines[i][2];

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment

井字代码 https://codepen.io/gaearon/pen/LyyXgK?editors=0010

squares是网格中slice的{​​{1}}