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

考虑下面的代码:

var age = 3;

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

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

当前回答

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

你可以这样做

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

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

其他回答

let age = 3;

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

你可以使用反撇号' '和ES6模板字符串

在旧的浏览器中使用模板语法会失败，这对于创建供公众使用的HTML很重要。使用连接是乏味且难以阅读的，特别是当您有很多或很长的表达式时，或者如果您必须使用括号来处理数字和字符串项的混合(两者都使用+运算符)。

PHP扩展带引号的字符串，其中包含变量，甚至一些表达式，使用非常紧凑的符号:$a="颜色是$color";

在JavaScript中，可以编写一个有效的函数来支持这一点:var a=S('the color is '，color);，使用可变数量的参数。虽然在本例中没有连接的优势，但当表达式变长时，语法可能会更清晰。或者可以像在PHP中那样，使用JavaScript函数使用美元符号表示表达式的开始。

另一方面，编写一个有效的变通函数来为旧浏览器提供类似模板的字符串展开并不困难。可能已经有人这么做了。

最后，我认为sprintf(就像在C、c++和PHP中一样)可以用JavaScript编写，尽管它的效率要比其他解决方案低一些。

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

你可以这样做

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

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

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

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

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

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

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

你应该做以下事情:

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

推荐文章