UPDATED:下面的答案仅限于单个变量名，因此，'Result ${a+b}'这样的模板在这种情况下无效。然而，你总是可以使用模板值:

format("This is a test: ${a_b}", {a_b: a+b});

最初的回答:

基于之前的答案，但创建了一个更“友好”的实用函数:

var format = (template, params) => {
    let tpl = template.replace(/\${(?!this\.)/g, "${this.");
    let tpl_func = new Function(`return \`${tpl}\``);

    return tpl_func.call(params);
}

你可以像这样开具发票:

format("This is a test: ${hola}, second param: ${hello}", {hola: 'Hola', hello: 'Hi'});

结果字符串应该是:

'This is a test: Hola, second param: Hi'

我遗漏了什么吗?是否有一个[好]方法来使一个可重用的模板文字?

也许我遗漏了一些东西，因为我对这个问题的解决方案对我来说太明显了，以至于我很惊讶没有人在这样一个古老的问题中写下这个答案。

对于这个问题，我几乎只有一句话:

function defer([first, ...rest]) {
  return (...vals) => rest.reduce((acc, str, i) => acc + vals[i] + str, first);
}

这是所有。当我想重用一个模板并推迟替换的解析时，我只做:

function defer([first, ...rest]) { return (...vals) => rest.reduce((acc, str, i) => acc + vals[i] + str, first); } t = defer`My template is: ${null} and ${null}`; a = t('simple', 'reusable'); // 'My template is: simple and reusable' b = t('obvious', 'late to the party'); // 'My template is: obvious and late to the party' c = t(null); // 'My template is: null and undefined' d = defer`Choose: ${'ignore'} / ${undefined}`(true, false); // 'Choose: true / false' console.log(a + "\n" + b + "\n" + c + "\n" + d + "\n");

应用此标记将返回一个'函数'(而不是'字符串')，该函数将忽略传递给字面量的任何参数。然后可以稍后用新参数调用它。如果一个参数没有相应的替换，它就变成了“undefined”。

扩展的回答

这段简单的代码是功能性的，但是如果您需要更详细的行为，可以应用相同的逻辑，并且有无限的可能性。你可以:

利用原始参数:

您可以在结构中存储传递给文字的原始值，并在应用模板时以创造性的方式使用它们。它们可以成为标志、类型验证器、函数等。下面是一个使用它们作为默认值的例子:

function deferWithDefaults([first，…，…默认值){ 返回(…values) => rest。Reduce ((acc, curr, i) => { 返回acc + (i < values。长度呢?值[i]: defaults[i]) + curr; },第一); ｝ 我的模板是:${'extendable'}和${'versatile'}; A = t('awesome'); // '我的模板是:awesome and versatile' console.log(一个);

写一个模板工厂:

通过将此逻辑包装在一个函数中，该函数期望作为参数的自定义函数可以应用于约简(当连接模板字面量的片段时)，并返回具有自定义行为的新模板。

然后，你可以，例如，编写模板，自动转义或清除参数时，编写嵌入式html, css, sql, bash…

使用这个naïve(我重复一遍，naïve!) sql模板，我们可以构建这样的查询:

const createTemplate = fn => function (strings, ...defaults) { const [first, ...rest] = strings; return (...values) => rest.reduce((acc, curr, i) => { return acc + fn(values[i], defaults[i]) + curr; }, first); }; function sqlSanitize(token, tag) { // this is a gross simplification, don't use in production. const quoteName = name => (!/^[a-z_][a-z0-9_$]*$/ .test(name) ? `"${name.replace(/"/g, '""')}"` : name); const quoteValue = value => (typeof value == 'string' ? `'${value.replace(/'/g, "''")}'` : value); switch (tag) { case 'table': return quoteName(token); case 'columns': return token.map(quoteName); case 'row': return token.map(quoteValue); default: return token; } } const sql = createTemplate(sqlSanitize); q = sql`INSERT INTO ${'table'} (${'columns'}) ... VALUES (${'row'});` a = q('user', ['id', 'user name', 'is"Staff"?'], [1, "O'neil", true]) // `INSERT INTO user (id,"user name","is""Staff""?") // VALUES (1,'O''neil',true);` console.log(a);

接受命名参数进行替换:基于已经给出的内容，这是一个不那么困难的练习。在另一个答案中有一个实现。 使返回对象的行为像一个“字符串”:嗯，这是有争议的，但可能会导致有趣的结果。在另一个答案中。 解析调用站点全局命名空间中的参数:

我给你，可重用的模板文字

这是OP展示的附录，使用了邪恶的命令，我的意思是eval。这可以在没有eval的情况下完成，只需将传递的变量名搜索到全局(或窗口)对象中即可。我不演示怎么做，因为我不喜欢它。闭包是正确的选择。

可能最干净的方法是使用箭头函数(因为在这一点上，我们已经在使用ES6)

var reusable = () => `This ${object} was created by ${creator}`;

var object = "template string", creator = "a function";
console.log (reusable()); // "This template string was created by a function"

object = "example", creator = "me";
console.log (reusable()); // "This example was created by me"

.．.对于带标签的模板字面量:

reusable = () => myTag`The ${noun} go ${verb} and `;

var noun = "wheels on the bus", verb = "round";
var myTag = function (strings, noun, verb) {
    return strings[0] + noun + strings[1] + verb + strings[2] + verb;
};
console.log (reusable()); // "The wheels on the bus go round and round"

noun = "racecars", verb = "fast";
myTag = function (strings, noun, verb) {
    return strings[0] + noun + strings[1] + verb;
};
console.log (reusable()); // "The racecars go fast"

这也避免了eval()或Function()的使用，这可能会导致编译器出现问题，并导致大量的放缓。

如果你使用的是Angular，你可以像下面这样使用@ngx-translate/core包:

import { TranslateDefaultParser } from '@ngx-translate/core';

export class SomeClass {
    public parser = new TranslateDefaultParser();
    test() {
        // outputs "This is my great reusable template!"
        this.parser.interpolate('This is my {{expletive}} reusable template!', { expletive: 'great' });
    }
    ...
}

简化@metamorphasi提供的答案;

const fillTemplate = function(templateString, templateVars){ var func = new函数(…Object.keys(templateVars)， "return ' "+templateString +" ';") 返回func(…Object.values (templateVars)); ｝ / /样本 var hosting = "overview/id/d:${id}"; var domain = {Id:1234，用户:22}; var result = fillTemplate(主机，域); console.log(结果);

运行时模板字符串

var templateString = (template, values) => {
    let output = template;
    Object.keys(values)
        .forEach(key => {
        output = output.replace(new RegExp('\\$' + `{${key}}`, 'g'), values[key]);
    });
    return output;
};

Test

console.debug(templateString('hello ${word} world', {word: 'wonderful'}));