无法获取索引，返回 NaN

Question

我正在尝试在六边形网格中获取瓷砖的邻居。网格和图块都是 React 组件，我的 Grid 组件中有一个方便的方法来查找图块的所有邻居

该方法适用于索引内的邻居，并且我设置了一个模数以在某个图块超出范围时环绕到网格的另一侧。那些索引 return NaN.

  /**
   * Returns all neighbouring tiles of this tile
   */
  getTileNeighbours(tile) {
    // Checks all arrays in the two-dimensional grid if this tile exists
    for (let i in this.state.grid) {
      let array = this.state.grid[i]

      for (let j in array) {
        console.log("Looking...")
        let item = array[j]

        if (item.state.name === tile.state.name) {
          console.log("Found you!")
          // Gets the position of the tile
          let j = array.indexOf(tile)
          //console.log(`Tile was found at position [${i}, ${j}]. Returning neighbours.`)

          let neighbours = []
          // All possible permutations of neighbours
          let positions = [
            {i:0,j:-2}, {i:1,j:-1}, {i:1,j:1}, {i:0,j:2}, {i:-1,j:1}, {i:-1,j:-1}
          ]

          // If neighbouring indexes are out of bounds, wraps around to the other edge of the arrays
          for (let k in positions) {
            let position = positions[k]

            let xIndex = (i + position.i) % this.state.grid.length
            let yIndex = (j + position.j) % array.length
            console.log(`Resolving '(${i} + ${position.i}) % ${this.state.grid.length}': ${(i + position.i) % this.state.grid.length}`)
            console.log(`Actual indexes used: 'this.state.grid[${xIndex}][${yIndex}]'`)

            let match = this.state.grid[xIndex][yIndex]

            if (match) neighbours.push(match)
          }
          return neighbours
        }
      }
    }
  }

Here's a capture of my JavaScript console in Chrome

Answer 1

我弄清楚出了什么问题，这全都归结为变量类型并非都是数字。 i、j 和 k 都是字符串（因为它们在 for (x in y) 上下文中使用），在 k = 5 时，我们最终得到 i + position.i 等于 0-1 作为字符串，这不能与模数一起使用。通过强制 i 和 j 为数字，我们不再遇到 NaN。同样，使用模数环绕也完全不是一个好主意。当结果索引为负时，它已被替换为三元以添加数组的长度我只需要更改两行，它们就在这里

let xIndex = Number(i) + position.i < 0 ? Number(i) + position.i + this.state.grid.length : Number(i) + position.i
let yIndex = Number(j) + position.j < 0 ? Number(j) + position.j + array.length : Number(j) + position.j

这都是因为我的注意力严重不足，我应该更好地解决问题。

无法获取索引，返回 NaN

Unable to get index, NaN was returned

javascript

reactjs

preact