如何在JavaScript运行时设置模板字面量的模板与参数

从数据库获取的模板内容示例：

Hello ${customerName}: Welcome! to our site. This is dummy.Please reach us at ${websiteLink}

请求载荷中包含变量对应的值，直接使用模板字面量包裹模板字符串无法完成替换，以下是两种可行的实现方案：

方案一：正则表达式替换（推荐） #

通过正则匹配模板中的${变量名}格式，从参数对象中提取对应值完成替换，安全无风险，不会触发ESLint报错。

代码实现：

const args = { customerName: "Ram", websiteLink: "https://www.google.com" };
const template = getMessageTemplateFromDb('customer');

const getMessageContent = (args, template) => {
  // 全局匹配所有${xxx}格式的变量，捕获变量名部分
  return template.replace(/\${(\w+)}/g, (match, key) => {
    // 从args中取对应值，变量不存在时保留原模板片段
    return args[key] ?? match;
  });
};

const messageContent = getMessageContent(args, template);

方案二：Function构造函数（需谨慎使用） #

若模板和参数均为可信内容（无用户输入注入风险），可通过Function构造函数动态生成解析逻辑，但可能触发ESLint的no-new-func规则，需按需配置。

代码实现：

const args = { customerName: "Ram", websiteLink: "https://www.google.com" };
const template = getMessageTemplateFromDb('customer');

const getMessageContent = (args, template) => {
  const keys = Object.keys(args);
  const values = Object.values(args);
  // 动态创建函数，传入变量名并返回解析后的模板字符串
  return new Function(...keys, `return \`${template}\`;`)(...values);
};

const messageContent = getMessageContent(args, template);

内容的提问来源于stack exchange，提问作者Kgn-web