Javascript ES6 TemplateString 一个 TemplateString

Question

我正在使用 mustache 构建单个字符串，替换其中的几个变量。我很想改用 TemplateString，但我需要在运行时解析我的字符串，而不是在代码编译时，因为我正在从外部源读取模板字符串。

要明确：

// mustachy example
// template is "foo{{who}}" and myData.whmustao = "manchu"
let myResult = mustache.render(getMyTemplate(),myData);
console.log(myResult);   // "foomanchu"

这是非常轻量级的，我很想使用 TemplateString，但正如下面的示例所提到的那样 - 我无法想象首先从外部提供字符串的方法...

// ES6xy example
let myResult = `foo${myData.who}`;   // can't get this at runtime
console.log(myResult);    // "foomanchu"

但是，我想不出一种直接、干净、不偷偷摸摸的方法来实现这一点。可以吗？

Answer 1

我假设您正在客户端加载数据并希望根据返回的数据生成一个字符串。您可以使用一个函数 returns 为您生成的字符串

function generateString(val1, val2) {
  return `foo${val1} bar${val2};
}

您能否在客户端调用该函数作为获取 val1 和 val2 的 api 调用的结果？

如果您延迟响应直到获得所需的所有数据，此策略也适用于服务器

Answer 2

将template-string放入函数中，然后传递myData

let renderMyTemplate = data => `foo${data.who}`;
//or
let renderMyTemplate = ({who}) => `foo${who}`;


let myResult = renderMyTemplate(myData);
console.log(myResult);

Answer 3

感谢您的回复和创造性的解决方案。但是，我认为没有解决方案，因为 TemplateStrings 是一个 in-code 功能，而其他模板解决方案（如 mustache）是一个 data-driven 功能。

换句话说，ES6 的模板字符串是一种语言特性，它将其功能限制为静态 in-code 字符串。任何其他想象的灵活性都必须依赖于动态执行您注入到应用程序中的代码，这是每个黑客的梦想。

所以我最初的想法的答案是，关于 Mustache 是否对源代码中不是 hard-coded 的简单字符串过度杀伤力 - 是否定的。 Mustache 是该场景可接受的解决方案。

Javascript ES6 TemplateString 一个 TemplateString

Javascript ES6 TemplateString a TemplateString

javascript

render

mustache

template-strings