React 教程历史地图（步骤，移动）

Question

在此处的“显示过去的动作”部分中，我们有以下代码：

const moves = history.map((step, move) => {
      const desc = move ?
        'Go to move #' + move :
        'Go to game start';
      return (
        <li>
          <button onClick={() => this.jumpTo(move)}>{desc}</button>
        </li>
      );
    });

这段代码似乎首先将内置变量“step”映射到变量“move”，然后基本上具有以下 Python 逻辑：

const moves = [lambda move: const desc = move ... for move in history]

作为熟悉Python但不熟悉javascript的人，您能解释一下：

1) 没有在任何地方分配“step”变量，而且我无法搜索内置的 step 变量，那么“step”是如何分配给游戏移动次数的？

2) 这个语法背后的逻辑是什么：(step, move) 意思是首先将 step 映射到 move 中，然后执行一个 lambda 函数？首先，第一个“地图步入移动”部分对我来说没有意义。

Answer 1

JavaScript Array map()函数具有以下语法：

array.map(function(currentValue, index, arr), thisValue)

在这种情况下，step变量是由 map 函数迭代的数组的当前元素的值history。的move变量是索引的当前元素的。

通常，您使用 map 函数返回基于原始数组的新数组。在这种情况下，他们正在迭代移动历史并根据历史创建一个新的 HTML<btn>元素数组。

您可以使用forEach如下方式完成相同的操作：

let moves = [];
history.forEach((step, move) => {
    const desc = move ?
          'Go to move #' + move :
          'Go to game start';
    moves.push(
        <li>
            <button onClick={() => this.jumpTo(move)}>{desc}</button>
        </li>
    );
});