react井字棋游戏使用return退出循环失效

项目场景：

使用react完成官网的井字棋游戏

---

问题描述

return失效

  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],
    ];
    lines.map((line) => {
      const [a, b, c] = line;
      if (squares[a] && squares[a] == squares[b] && squares[a] == squares[c]) {
        console.log("成功");
        return squares[a];
      }
    });
    console.log("失败");

    return null;
  }

以上代码会使控制台输出如下：

就是，成功后并没有直接return返回出去，而是继续往下执行，所以输出了“成功”后又输出了“失败”

---

原因分析：

Array.map()方法无法通过 return 退出循环

只有for或forEach支持使用return 退出循环

---