如何用JavaScript将product[0][name]替换为product[1][name]？

嘿，我完全懂你的困扰——这种包含方括号的字符串替换，一不小心就会因为正则转义的问题踩坑，尤其是之前尝试的方法还出现了多余斜杠的情况。下面给你几种靠谱的解决方案：

方法1：全局正则替换（最直接） #

因为方括号[和]在正则表达式里属于特殊字符（用来定义字符集），所以我们需要用反斜杠\把它们转义，让正则把它们当成普通字符匹配，再加上g标志实现全局替换（替换所有出现的目标字符串）：

const originalStr = '<input name="product[0][name]" id="product[0][name]" />';
const replacedStr = originalStr.replace(/product\[0\]\[name\]/g, 'product[1][name]');
console.log(replacedStr);
// 输出：<input name="product[1][name]" id="product[1][name]" />

方法2：简单字符串替换（仅替换第一个匹配项） #

如果你只需要替换第一个出现的product[0][name]，可以直接用字符串作为replace的第一个参数，不需要正则，也就不用转义：

const originalStr = '<input name="product[0][name]" id="product[0][name]" />';
const replacedStr = originalStr.replace('product[0][name]', 'product[1][name]');
console.log(replacedStr);
// 输出：<input name="product[1][name]" id="product[0][name]" />

注意：这种方法只会替换第一个匹配的字符串，适合只有一处需要替换的场景。

方法3：动态匹配的通用方案（适合动态生成目标字符串） #

如果你的目标字符串是动态生成的，不想手动转义特殊字符，可以用一个通用的转义函数把特殊字符转义后，再创建正则表达式：

const originalStr = '<input name="product[0][name]" id="product[0][name]" />';
const targetStr = 'product[0][name]';
const replacementStr = 'product[1][name]';

// 转义正则特殊字符的函数
function escapeRegExp(str) {
  return str.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
}

const regex = new RegExp(escapeRegExp(targetStr), 'g');
const replacedStr = originalStr.replace(regex, replacementStr);
console.log(replacedStr);

为什么之前的方法会出现斜杠？ #

你之前尝试的//[这类写法属于错误的正则语法，正则的边界是/，正确的转义应该是在特殊字符前加单个反斜杠，比如\[，如果不小心多写了斜杠或者语法错误，就会导致替换结果出现多余的斜杠。

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