结论： 在 JavaScript 中，可以通过字符串模板、正则表达式或手动替换等方式，将字符模板中的变量替换成实际值。
详细展开
1. 使用模板字符串（推荐）
ES6 引入了模板字符串功能，可以直接在字符串中嵌入变量，这是最简洁和现代的方式。
语法：
let name = "Alice"; let age = 25;let template = `你好, ${name}! 你今年 ${age} 岁了。`; console.log(template); // 输出: 你好, Alice! 你今年 25 岁了。
特点：
- 使用反引号（
`）定义模板字符串。 - 使用
${}插入变量或表达式。
2. 使用正则表达式替换占位符
如果需要处理旧版浏览器不支持的模板字符串，或者需要更灵活的占位符替换逻辑，可以使用正则表达式。
示例：
let template = "你好, {{name}}! 你今年 {{age}} 岁了。";let data = {name: "Alice",age: 25
};let result = template.replace(/{{\s*([^}]+)\s*}}/g, (match, key) => {return data[key] !== undefined ? data[key] : match; // 如果键不存在，保留原占位符
});console.log(result);
// 输出: 你好, Alice! 你今年 25 岁了。
解释：
- 正则表达式
/{{\s*([^}]+)\s*}}/g匹配类似{{key}}的占位符。 replace方法的回调函数根据占位符的键名从data对象中获取对应的值。
3. 手动替换占位符
对于简单的场景，可以直接通过多次调用 replace 方法来替换占位符。
示例：
let template = "你好, {name}! 你今年 {age} 岁了。";let data = {name: "Alice",age: 25
};for (let key in data) {template = template.replace(new RegExp(`{${key}}`, 'g'), data[key]);
}console.log(template);
// 输出: 你好, Alice! 你今年 25 岁了。
解释：
- 使用
new RegExp动态生成正则表达式。 - 遍历
data对象，逐一替换模板中的占位符。
4. 使用第三方库（如 Lodash）
如果你的项目中已经引入了第三方库（如 Lodash），可以利用其提供的工具函数简化操作。
示例：
const _ = require("lodash");let template = "你好, <%= name %>! 你今年 <%= age %> 岁了。";let data = {name: "Alice",age: 25
};let result = _.template(template)(data);console.log(result);
// 输出: 你好, Alice! 你今年 25 岁了。
解释：
- Lodash 的
_.template方法支持模板引擎风格的占位符（如<%= key %>）。 - 它会自动解析并替换占位符为实际值。
总结
- 模板字符串 是现代 JavaScript 的最佳实践，简单易用。
- 正则表达式 提供了更大的灵活性，适合复杂场景。
- 手动替换 适用于简单的占位符替换需求。
- 第三方库 如 Lodash 提供了更强大的模板解析能力，适合需要扩展功能的场景。
根据具体需求选择合适的方法即可
