如何将JavaScript中的单引号字符串转为模板字符串以解析变量？

如果是编写代码时手动修改，直接把普通字符串的单引号换成反引号，就能转成模板字符串获取字段值：

const item = {'field': 2};
// 将单引号替换为反引号，成为模板字符串
const templateStr = `${item['field']}`;
console.log(templateStr); // 输出 2

但如果这个'${item['field']}'是动态生成的字符串（比如来自接口、用户输入等运行时场景），直接改语法没用，可以用以下两种方法处理：

• 方法一：用eval解析
  把动态字符串包裹在反引号里，通过eval执行实现模板解析：

  const item = {'field': 2};
  const str = '${item["field"]}'; // 转义内部引号避免语法冲突
  const result = eval('`' + str + '`');
  console.log(result); // 输出 2
  

  注意：eval会执行任意代码，若字符串来源不可信（比如用户输入），存在安全风险，谨慎使用。

• 方法二：自定义解析逻辑（更安全）
  针对固定格式的字符串，用正则匹配变量部分，直接从对象中取值，规避eval的风险：

  const item = {'field': 2};
  const str = '${item["field"]}';
  // 匹配${item['xxx']}或${item["xxx"]}格式的内容
  const result = str.replace(/\$\{item\[["'](.+?)["']\]\}/g, (_, key) => {
    return item[key];
  });
  console.log(result); // 输出 2
  

内容的提问来源于stack exchange，提问作者Joao Francisco Zani de Arruda