javascript - 基于模板变量的 ES6 模板文字

Question

我尝试渲染一个 ES6 模板文字变量：

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

是否存在将具有上下文的字符串模板转换为具有 ES6 模板文字功能的格式化字符串的方法？

Answer 1

You can not do this with simple template literals.

However, you can achieve such behaviour by wrapping your literals into functions. Thanks to ES6 features (desctructuring and arrow functions), the result code is simple

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

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

Answer 2

ES6 模板文字不能在运行时编译。为此，应使用第三方库，例如es6-template.

在这一点上，使用模板文字语法并没有真正的好处，可以使用任何其他选择的模板引擎来代替。