如何在JavaScript中做字符串插值?

考虑下面的代码:

var age = 3;

console.log("I'm " + age + " years old!");

除了字符串连接之外，还有其他方法可以将变量的值插入到字符串中吗?

当前回答

找不到我要找的东西，然后找到了

如果你使用的是Node.js，有一个内置的utipackage，它有一个format函数，工作方式是这样的:

util.format("Hello my name is %s", "Brent");
> Hello my name is Brent

巧合的是，在Node.js -中，这也被内置到console.log版本中

console.log("This really bad error happened: %s", "ReferenceError");
> This really bad error happened: ReferenceError

其他回答

从ES6开始，如果你想在对象键中做字符串插值，你会得到一个SyntaxError: expected属性名，得到'${'如果你做这样的事情:

let age = 3
let obj = { `${age}`: 3 }

你应该做以下事情:

let obj = { [`${age}`]: 3 }

试试sprintf库(一个完整的开源JavaScript sprintf实现)。例如:

vsprintf('The first 4 letters of the english alphabet are: %s, %s, %s and %s', ['a', 'b', 'c', 'd']);

Vsprintf接受一个参数数组并返回一个格式化的字符串。

如果您想在console.log输出中插入，那么只需

console.log("Eruption 1: %s", eruption1);
                         ^^

这里，%s是所谓的“格式说明符”。log内置了这种插值支持。

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

你可以这样做

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

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

警告:避免任何不允许您转义其自己的分隔符的模板系统。例如，使用此处提到的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(" ");

推荐文章