基于模板变量的ES6模板字面量

Question

我尝试呈现一个ES6模板文字变量：

function render(template, data){
 ...
}
const template = 'resources/${id}/';
console.log(render(template, {id: 1})); // -> resources/1/

是否存在一种将带有上下文的字符串模板转换为使用ES6模板文字特性的格式化字符串的方法？

- Guillaume Vincent

Answer 1

使用简单的模板字面量无法做到这一点。

但是，通过将您的字面量包装到函数中，您可以实现这样的行为。由于ES6的功能（解构和箭头函数），结果代码很简单

function render(template, data) {
  return template(data);
}
const tpl = ({ id }) => `resources/${id}/`;

console.log(render(tpl, { id: 1})); // resources/1/

- Konstantin

---

甚至更简单： (({ id }) => `resources/${id}/`)({ id: 1}) - alex_1948511

但是这并不能回答原问题。原问题的教训是你将'resources/${id}/'作为一个变量保存。 - user1663023

@QianChen 你为什么这么想？我相信我已经很清楚地回答了这个问题。 - Konstantin

如果\resources/${id}/``被保存在一个从网络或文件读取的变量中，你会怎么做？ - user1663023

@QianChen 我不明白。为什么我要对此做任何事情？ - Konstantin

Answer 2

ES6模板字面量不能在运行时编译。要实现这一点，应使用第三方库，例如es6-template。

目前使用模板字面量语法没有真正的好处，可以选择任何其他模板引擎来代替。

- Estus Flask

---

这还有用吗？我遇到了同样的问题，不知道是否要使用ES6字面模板。 - sd1sd1

是的，当你需要时可以使用模板引擎。 - Estus Flask