使用replace函数实现加密时控制台输出undefined问题

核心问题 #

你的代码控制台输出undefined有两个关键原因：

• 函数无返回值：trocaLetras函数仅执行了replace操作，但没有返回处理后的字符串，调用时自然得到undefined。
• 忽略字符串不可变性：JavaScript中字符串是不可变类型，replace方法不会修改原字符串，而是返回新字符串，你需要将每次替换的结果保存下来。

修正后的代码 #

JavaScript部分 #

var botaoCriptografar = document.querySelector('#criptografar');

function trocaLetras(conteudoInput) {
    // 链式调用replace，每次替换后返回新字符串，最终返回处理结果
    return conteudoInput
        .replace(/a/g, 'ai')
        .replace(/e/g, 'enter')
        .replace(/i/g, 'imes')
        .replace(/o/g, 'ober')
        .replace(/u/g, 'ufat');
}

botaoCriptografar.addEventListener('click', function(event){
    event.preventDefault();
    var texto = document.querySelector('#texto-para-coleta').value;
    var textoAtualizado = trocaLetras(texto);
    console.log(textoAtualizado);
});

HTML部分（无需修改） #

<textarea id="texto-para-coleta"></textarea>
<button id="criptografar">Criptografar</button>

补充说明 #

• 链式调用replace能让代码更简洁，同时确保每次替换都基于上一次的结果进行。
• 如果偏好分步操作，也可以这样写：

function trocaLetras(conteudoInput) {
    let resultado = conteudoInput;
    resultado = resultado.replace(/a/g, 'ai');
    resultado = resultado.replace(/e/g, 'enter');
    resultado = resultado.replace(/i/g, 'imes');
    resultado = resultado.replace(/o/g, 'ober');
    resultado = resultado.replace(/u/g, 'ufat');
    return resultado;
}

内容的提问来源于stack exchange，提问作者Hans Christian