Javascript ES6 TemplateString 一个 TemplateString答案

【问题标题】：Javascript ES6 TemplateString a TemplateStringJavascript ES6 TemplateString 一个 TemplateString
【发布时间】：2017-01-28 20:01:15
【问题描述】：

我正在使用 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"

但是，我无法想象一种直接、干净、不偷偷摸摸的方式来实现这一目标。可以吗？

【问题讨论】：

标签： javascript render mustache template-strings

【解决方案1】：

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

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

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

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

【讨论】：

但是模板字符串本身的格式在代码中是未知的，它是由外部环境提供的。它是一个配置驱动的模板，不能存在于quotes内的代码中。
模板字符串是什么格式的？如果它是一个 mustache 模板，那么您基本上是在尝试重新编写 Mustache.render 函数，此时您最好不要使用 Mustache

【解决方案2】：

将模板字符串放入函数中，并传递myData

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


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

【讨论】：

但是模板字符串本身的格式在代码中是未知的，它是由外部环境提供的。它是一个配置驱动的模板，不能存在于quotes内的代码中。
@InquisitorShm，那么您的后端必须返回 Javascript 而不是纯文本/数据；模板字符串是代码而不是数据！你可以看看 JSONP，并使用类似 jsonpCallbackName({ myTemplate: function(data){ return `foo${data.who}`}, myTemplate2: ... }) 或只是 jsonpCallbackName(data => `foo${data.who}`) 的单个模板

【解决方案3】：

感谢您的回复和创造性的解决方案。但是，我认为没有解决方案，因为 TemplateStrings 是代码内功能，而其他模板解决方案（如 mustache）是数据驱动的功能。

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

因此，对于我最初的想法，关于 Mustache 是否对于您的源中未硬编码的简单字符串是否过大 - 的答案是否定的。小胡子是该场景可接受的解决方案。

【讨论】：