JavaScript中slice方法索引正确却无法删除元素问题排查

你编写的trouverEtRemplacerChar函数意图替换字符串中的元音为其他元音，通过从元音列表移除当前选中的元音避免重复，但调用slice方法后列表并未发生变化，导致偶尔出现相同元音的情况。

你的代码 #

function trouverEtRemplacerChar(truc, liste, proba) {
    let indexCorrespondances = []
    if (Math.random() <= proba) {
            for (let x = 0 ; x < truc.length; x++) {
                if (liste.indexOf(truc[x].toLowerCase()) > -1) {
                    indexCorrespondances.push(x)
                }
            }
            const index = Math.floor(Math.random() * (indexCorrespondances.length))
            if (liste.includes(truc[indexCorrespondances[index]])) {
                indexASupp = liste.indexOf(truc[indexCorrespondances[index]])
                help = liste[indexASupp]
                console.log(liste, indexASupp)
                liste.slice(indexASupp, 1)
                console.log(liste)
                }
    }
}

测试调用 #

trouverEtRemplacerChar("magiquement", ["a", "e", "i", "o", "u", "y"], 1)

核心原因 #

slice方法不会修改原数组，它的作用是返回一个包含原数组指定范围元素的新数组。你只是调用了liste.slice(indexASupp, 1)，但没有将返回的新数组赋值给任何变量，所以原数组完全没有变化。

解决方案 #

要原地修改数组并移除元素，使用splice方法即可——这是专门用于原地修改数组的方法，语法为array.splice(起始索引, 删除数量)。

将代码中的liste.slice(indexASupp, 1)替换为：

liste.splice(indexASupp, 1)

额外优化建议 #

1. indexASupp和help没有声明，会变成全局变量，建议添加const声明；
2. 当输入字符串中没有元音时，indexCorrespondances为空，后续取随机索引会得到NaN导致报错，建议增加空数组判断；

优化后的代码示例：

function trouverEtRemplacerChar(truc, liste, proba) {
    let indexCorrespondances = []
    if (Math.random() <= proba) {
        for (let x = 0 ; x < truc.length; x++) {
            if (liste.indexOf(truc[x].toLowerCase()) > -1) {
                indexCorrespondances.push(x)
            }
        }
        // 处理无匹配元音的情况
        if (indexCorrespondances.length === 0) return;
        
        const index = Math.floor(Math.random() * indexCorrespondances.length)
        const targetChar = truc[indexCorrespondances[index]].toLowerCase()
        if (liste.includes(targetChar)) {
            const indexASupp = liste.indexOf(targetChar)
            // 使用splice原地删除元素
            liste.splice(indexASupp, 1)
            console.log("修改后的元音列表:", liste)
        }
    }
}

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