javascript - 如何用下划线替换数组中的某些字母

Question

我正在尝试使文本将显示在输入框下方，其中一些字母应替换为下划线。此文本将是用户应该输入以获得正确输出的答案。
我希望循环用 _ 替换像 e 这样的字母，但它什么也不做。没有错误消息，它只是不替换字母 e。我试图放一个 for循环，我在其他地方找到了如何替换数组元素中的某些字符，但没有任何效果。
这是JS代码:

let array = ['blue', 'green', 'red', 'orange', 'pink', 'silver', 'purple', 'lime']
let arraySecond = ['blue', 'green', 'red', 'orange', 'pink', 'silver', 'purple', 'lime']; 

//The other array is the one that shows the element, 
//that matches the first array, but with "_", instead of certain letters

document.getElementById('check').addEventListener('click', thisFunction);

function thisFunction() {
   let value = document.getElementById('input').value;
   
   if (value == theColor) {
    alert(`Congrats you gussed right, its ${value}`)
        } else {
    alert(`Oof, your guess was incorrect, it\'s ${array[randomizedArray]}`)
    }
}

let randomizedArray = Math.floor(Math.random() * array.length);

let theColor = array[randomizedArray]; 

//One thing the code above is used for is be in the for loop, to replace letters

for (let i = 0; i < theColor.length; i++) {
    theColor[i] = theColor[i].replace('e', '_');
} 

//This loop that should do the replacing, but it doesn't work

document.getElementById('output').innerHTML = theColor;

Answer 1

您正在使用 replace作用于单词的单个字母而不是整个单词 - 您不需要遍历每个字母来替换它们。
完全取决于您想要什么 replace ，您可以按如下方式操作(以 e 为例):

替换第一个实例 信件:theColor.replace('e', '_');

替换所有实例 信件:theColor.replace(/e/g, '_'); - 请注意 / ... /g意味着进行全局搜索和替换。

不区分大小写的替换 : 添加 /gi到上面theColor.replace(/e/gi, '_');

但是，我的猜测是，您不仅要替换一个特定的字母，还可以像这样一次性替换多个字母(例如 a、e、i、o 和 u):

替换多个字母的所有实例 :theColor.replace(/aeiou/gi, '_'); - 对 / 之间的所有字母进行不区分大小写的替换和 /gi与 _

示例:

var theColor = "green";
console.log("Replace first instance of e in "+theColor+": " 
            + theColor.replace('e', '_'));

var theColor = "GREeN";
console.log("Replacing all instances of e (case insensitive) in "+theColor+": " 
            + theColor.replace(/e/gi, '_'));

var theColor = "orange";
console.log("Replacing all vowels in one go in "+theColor+": "
            + theColor.replace(/[aeiou]/gi, '_'));

在您的代码中 例如，要替换所有元音(a、e、i、o 或 u)，您只需要执行以下操作:

document.getElementById('output').innerHTML = theColor.replace(/[aeiou]/gi, '_');

注意，不要改变 theColor 的值直接，因为这是您用来比较猜测的内容。上面的行只替换显示的颜色，而不是颜色本身的名称。
工作示例

let array = ['blue', 'green', 'red', 'orange', 'pink', 'silver', 'purple', 'lime']
let arraySecond = ['blue', 'green', 'red', 'orange', 'pink', 'silver', 'purple', 'lime'];

//The other array is the one that shows the element, 
//that matches the first array, but with "_", instead of certain letters
document.getElementById('check').addEventListener('click', thisFunction);

function thisFunction() {
  let value = document.getElementById('input').value;

  if (value == theColor) {
    alert(`Congrats you gussed right, its ${value}`)
  } else {
    alert(`Oof, your guess was incorrect, it\'s ${array[randomizedArray]}`)
  }
}

let randomizedArray = Math.floor(Math.random() * array.length);
let theColor = array[randomizedArray];

/* THIS IS WHERE THE NEW CODE IS
   DISPLACE THE COLOR WITH ALL a,e,i,o OR u REPLACED WITH _ */
document.getElementById('output').innerHTML = theColor.replace(/[aeiou]/gi, '_');

<input id="input">
<button id="check">Check</button>
<div id="output"></div>

引用 : MDN Docs for replace function