JS replace方法基础用法：参数含义与简单示例

一、replace 方法的核心语法与不可变原则

replace() 是挂载在 String.prototype 上的原生方法。它的基本调用形式如下：

let newStr = str.replace(searchValue, replaceValue);

学习此方法前，必须确立一个基本原则：JavaScript 中的字符串是不可变的（Immutable）。调用 str.replace() 绝不会修改原字符串 str 的内容，而是计算并返回一个全新的字符串。必须使用变量接收该返回值，否则替换结果将丢失。

二、两项入参的含义与类型说明

str.replace(searchValue, replaceValue) 接收两个参数，分别定义“搜索什么”以及“替换成什么”。

三、参数一：查找目标的执行步骤与单次替换限制

当 searchValue 是一个普通字符串时，replace() 会从原字符串起始位置从左往右检索。只要找到第一个符合完全相同字符序列的片段，就会立即执行替换并终止检索。后续即使存在相同的字符串，也不会被处理。

let text = "red, green, red, blue";
// 检索普通字符串 "red"，仅首个 "red" 会被替换
let result = text.replace("red", "yellow");

console.log(result); // 示例输出："yellow, green, red, blue"
console.log(text);   // 示例输出："red, green, red, blue"（原串不变）

四、参数二：替换值的表达形式与高级用法

第二个参数 replaceValue 可以是纯字符串，也可以传入一个接收匹配信息的函数。

1. 普通字符串与特殊替换模式字符

当传入字符串时，除了常规文字外，JavaScript 还支持在字符串中书写带有 $ 前缀的特殊模式：

• $$：插入一个纯字符 $。
• $&：插入本次匹配到的完整子串。
• $`：插入匹配子串左侧（前面）的所有内容。
• $'：插入匹配子串右侧（后面）的所有内容。

let item = "商品价格为 100 元";
// $& 代表匹配到的 "100"
let result = item.replace("100", "[$&]");
console.log(result); // 示例输出："商品价格为 [100] 元"

2. 回调函数作为替换值（动态计算）

如果替换规则无法用静态字符串表达，可以给第二个参数传入一个自定义函数。该函数在每次匹配命中时被引擎调用，其返回值作为本次替换的新文本。

let scoreText = "当前得分是 85 分";
// 函数接收匹配到的字符串，返回处理后的新文本
let evaluated = scoreText.replace("85", function(match) {
  let num = parseInt(match, 10);
  return num >= 60 ? `${num}(合格)` : `${num}(需补考)`;
});

console.log(evaluated); // 示例输出："当前得分是 85(合格) 分"

五、基础实战示例

示例 1：日常词汇替换

将句子中的某一个特定单词替换为目标词汇：

let greeting = "Hello Alice!";
let newGreeting = greeting.replace("Alice", "Bob");

console.log(newGreeting); // 示例输出："Hello Bob!"

示例 2：使用正则忽略大小写

用户输入的内容可能大小写不固定，通过传入正则表达式字面量配以 i 标志位实现不区分大小写匹配：

let draft = "JavaScript is great, javascript is flexible.";
// 仅匹配第一个出现的 javascript（忽略首字母大小写）
let updated = draft.replace(/javascript/i, "TypeScript");

console.log(updated); // 示例输出："TypeScript is great, javascript is flexible."

示例 3：通过函数完成大小写翻转

提取目标词汇并将其转换为全大写：

let slogan = "learn code daily";
let emphasized = slogan.replace("code", function(matchedWord) {
  return matchedWord.toUpperCase();
});

console.log(emphasized); // 示例输出："learn CODE daily"

六、用法选择与避坑指南

在实际编写代码时，为了避免意外产生 Bug，可参照以下决策流程选择合适的参数搭配：

总结而言，replace() 是处理字符串内容替换最常用的原生工具。掌握它牢记两点即可：一是字符串本身不可变，必须接收返回值；二是传入普通字符串作为查找目标时，仅替换首个匹配项。只要明确了这两大特性，就能在日常开发中准确且稳妥地运用此方法。