JavaScript批量替换数组内指定文本的简洁高效实现方案咨询

核心思路是将所有替换规则统一存放在映射表中，结合正则匹配实现单轮替换，避免重复调用replace方法。

完整实现代码 #

const string = "google windows ico.Win10 ubuntu ico.Microsoft"
// 替换规则映射表，新增规则只需要修改这个对象即可
const iconMap = {
  'ico.Win10': '<i class="fab fa-windows"></i>',
  'ico.Apple': '<i class="fab fa-apple"></i>',
  'ico.Android': '<i class="fab fa-android"></i>',
  'ico.Linux': '<i class="fab fa-linux"></i>',
  'ico.Ubuntu': '<i class="fab fa-ubuntu"></i>',
  'ico.Unity': '<i class="fab fa-unity"></i>',
  'ico.Snapchat': '<i class="fab fa-snapchat"></i>',
  'ico.Whatsapp': '<i class="fab fa-whatsapp"></i>',
  'ico.Instagram': '<i class="fab fa-instagram"></i>',
  'ico.Google': '<i class="fab fa-google"></i>',
  'ico.Microsoft': '<i class="fab fa-microsoft"></i>'
}
// 生成匹配所有替换键的正则，自动转义特殊字符
const iconRegex = new RegExp(Object.keys(iconMap).map(key => key.replace(/\./g, '\\.')).join('|'), 'g')

// 分割、过滤、批量替换一步完成
const keysArray = string.split("+")
  .filter(Boolean)
  .map(item => item.replace(iconRegex, match => iconMap[match]))

console.log(keysArray)

方案优势 #

• 易维护：所有替换规则集中在iconMap对象中，新增、修改、删除规则都不需要调整核心处理逻辑
• 性能优异：不管有多少条替换规则，每个字符串元素仅需要执行1次replace操作，规则数量越多，相比原写法的性能提升越明显
• 代码简洁：消除了重复的硬编码replace调用，使用map简化遍历逻辑，可读性更高

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