JavaScript如何将字符串中指定数组内的所有URL替换为***

问题诊断 #

你的实现逻辑存在多处错误：

• 直接报错的原因是：JavaScript 字符串原型上没有原生的replaceAt方法，调用不存在的方法自然会抛出异常。
• 额外的逻辑缺陷：
  • map是用来生成新数组的遍历方法，不适合做字符串批量修改操作；且你每次操作的都是原始message，没有保存替换后的新字符串，就算replaceAt方法存在，最终也只能生效最后一个URL的替换。
  • indexOf只能找到单个URL第一次出现的位置，如果同一个URL在字符串中多次出现会出现漏替换的情况。

正确实现方案 #

方案1：遍历URL逐次全局替换（易理解） #

let message = "hello https://ggogle.com parul https://yahoo.com and http://web.com";
let url = ["https://ggogle.com", "https://yahoo.com", "http://web.com"];

url.forEach(item => {
  // 转义URL中的正则特殊字符，避免匹配异常
  const escapeReg = item.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
  // 全局匹配当前URL并替换
  message = message.replace(new RegExp(escapeReg, 'g'), '***');
})

console.log(message);
// 输出结果：hello *** parul *** and ***

方案2：单次正则匹配替换（性能更高） #

把所有URL拼接成单个正则表达式，只做一次替换操作，适合URL数量较多的场景：

let message = "hello https://ggogle.com parul https://yahoo.com and http://web.com";
let url = ["https://ggogle.com", "https://yahoo.com", "http://web.com"];

// 所有URL转义后拼接成正则多选分支
const allUrlReg = new RegExp(
  url.map(item => item.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')).join('|'),
  'g'
);
const result = message.replace(allUrlReg, '***');

console.log(result);
// 输出结果：hello *** parul *** and ***

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