JavaScript中使用map()修改数组失败的问题求助

你遇到的问题有两个核心原因：

• JavaScript的字符串是不可变类型，直接通过索引给字符串赋值（比如color[1] = "1"）不会生效。
• map()方法不会修改原数组，它会返回一个新数组，你需要接收这个返回值才能得到修改后的结果。

正确解法1：字符串拼接 #

利用字符串切片和拼接，保留#，替换第二个字符为1，再拼接后面的内容：

const colors = ["#9abc9c", "#9ecc71", "#9498db", "#9b59b6", "#967e22", "#974c3c", "#91c40f"];
const updatedColors = colors.map(color => `#1${color.slice(2)}`);
// 结果：["#1abc9c", "#1ecc71", "#1498db", "#1b59b6", "#167e22", "#174c3c", "#11c40f"]

color.slice(2)会提取从索引2开始到末尾的子串，和#1拼接后就是你要的新颜色值。

正确解法2：正则表达式替换 #

用正则匹配#后的第一个字符，直接替换成1，代码更简洁：

const colors = ["#9abc9c", "#9ecc71", "#9498db", "#9b59b6", "#967e22", "#974c3c", "#91c40f"];
const updatedColors = colors.map(color => color.replace(/^#./, "#1"));

正则/^#./的含义：

• ^匹配字符串开头
• #匹配字符#
• .匹配任意单个字符
  整体就是匹配#后面的第一个字符，替换成#1，完美符合你的需求。

如果需要覆盖原数组，要把const改成let，再赋值：

let colors = ["#9abc9c", "#9ecc71", "#9498db", "#9b59b6", "#967e22", "#974c3c", "#91c40f"];
colors = colors.map(color => color.replace(/^#./, "#1"));

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