如何使用原生JavaScript基于数组替换字符串中的指定内容？

云上老周

2026-8-17

实现数组多关键词批量替换功能

方法1：循环遍历数组逐个替换

基于你现有的replaceAll函数，新增一个接收搜索词数组的函数，通过循环遍历数组内每个关键词，依次完成替换：

let x = document.querySelector("form.form").elements;
let input = x["formName"].value;

// 原单关键词替换函数
function replaceAll(string, search, replace) {
  return string.split(search).join(replace);
}

// 新增多关键词替换函数
function replaceAllFromArray(string, searchArray, replace) {
  let result = string;
  // 遍历搜索数组，逐个执行替换
  for (const searchWord of searchArray) {
    result = replaceAll(result, searchWord, replace);
  }
  return result;
}

// 使用示例：替换数组内所有关键词为"-"
const stopWords = ["example", "test", "demo"];
let noStop = replaceAllFromArray(input, stopWords, "-");

方法2：正则表达式批量替换（更高效）

如果搜索词数量较多，用正则一次性匹配所有关键词能提升性能。注意要转义搜索词中的正则特殊字符（如.、*、+等），避免匹配异常：

let x = document.querySelector("form.form").elements;
let input = x["formName"].value;

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

// 多关键词替换函数
function replaceAllFromArray(string, searchArray, replace) {
  // 将数组转为正则匹配串，开启全局匹配
  const regexPattern = new RegExp(searchArray.map(escapeRegExp).join('|'), 'g');
  return string.replace(regexPattern, replace);
}

// 使用示例
const stopWords = ["example", "test", "demo"];
let noStop = replaceAllFromArray(input, stopWords, "-");