试试kiwi吧，它是一个轻量级的JavaScript模块，用于字符串插值。

你可以这样做

Kiwi.compose("I'm % years old!", [age]);

or

Kiwi.compose("I'm %{age} years old!", {"age" : age});

你可以很容易地使用ES6模板字符串，并使用任何可用的transpilar(如babel)编译到ES5。

const age = 3;

console.log(`I'm ${age} years old!`);

http://www.es6fiddle.net/im3c3euc/

下面是一个解决方案，它要求您提供一个具有值的对象。如果你不提供一个对象作为参数，它将默认使用全局变量。但是最好还是使用参数，这样更简洁。

String.prototype.interpolate = function(props) { return this.replace(/\{(\w+)\}/g, function(match, expr) { return (props || window)[expr]; }); }; // Test: // Using the parameter (advised approach) document.getElementById("resultA").innerText = "Eruption 1: {eruption1}".interpolate({ eruption1: 112 }); // Using the global scope var eruption2 = 116; document.getElementById("resultB").innerText = "Eruption 2: {eruption2}".interpolate(); <div id="resultA"></div><div id="resultB"></div>

我可以给你们举个例子:

函数fullName(first, last) { let fullName = first + " " + last; 返回fullName; } 函数fullNameStringInterpolation(first, last) { let fullName = ' ${first} ${last} '; 返回fullName; } console.log('Old School: ' + fullName('Carlos'， 'Gutierrez')); console.log('New School: ' + fullNameStringInterpolation('Carlos'， 'Gutierrez'));

警告:避免任何不允许您转义其自己的分隔符的模板系统。例如，使用此处提到的supplant()方法将无法输出以下内容。

“多亏了我的年龄变量，我才3岁。”

简单的插值可能适用于小型的自包含脚本，但通常会出现这种设计缺陷，限制任何重要的使用。老实说，我更喜欢DOM模板，比如:

<div> I am <span id="age"></span> years old!</div>

$('#age').text(3)

另外，如果你只是厌倦了字符串连接，总有替代语法:

var age = 3;
var str = ["I'm only", age, "years old"].join(" ");

替换更多的ES6版本的@Chris Nielsen的帖子。

String.prototype.supplant = function (o) {
  return this.replace(/\${([^\${}]*)}/g,
    (a, b) => {
      var r = o[b];
      return typeof r === 'string' || typeof r === 'number' ? r : a;
    }
  );
};

string = "How now ${color} cow? {${greeting}}, ${greeting}, moo says the ${color} cow.";

string.supplant({color: "brown", greeting: "moo"});
=> "How now brown cow? {moo}, moo, moo says the brown cow."