javascript - 在 .map 中 react setState

Question

我想在 React.js 中制作一个刽子手游戏，我有一个从单词列表中随机取一个单词的函数，我想拆分这个单词并用“_”替换每个字母但是当我设置.map中的setState，它只需要一个“_”，而且没有字母那么多。

有人可以帮助我吗？

const words = [...this.state.wordList];

const length = words.length;

const random = Math.floor(Math.random() * length);

const word = this.state.wordList[random].word;

const splitedWord = word.split("");

splitedWord.map(( letter, index ) => {
  const hiddenLetter = letter.replace(/./, "_");

  this.setState({usedWord: hiddenLetter});
}

Answer 1

您只替换一个字符的原因是因为对于每次迭代，您替换的是原始 字符串，而不是您在每个循环中生成的新字符串。话虽这么说，你不应该那样做。正如评论中提到的，在循环中使用 setState() 是低效且不必要的。

---

您已经知道，对于单词 Orange(6 个字母)，您需要 6 个 _。因此，无需遍历每个字符并逐个替换它们。只需创建一个具有上述长度的 _ 字符串!

你可以这样做:

new Array(word.length + 1).join("_");

您现在已准备好将其放入您的状态。换句话说:

this.setState({usedWord: new Array(word.length + 1).join("_")});