我知道在 PHP 中我们可以做这样的事情：
$hello = "foo";
$my_string = "I pity the $hello";
输出： "I pity the foo"
我想知道在 JavaScript 中是否也可以实现同样的功能。在字符串中使用变量而不使用连接——它看起来更简洁优雅。
如何在 JavaScript 中的字符串中插入变量，而无需连接？
IT技术
javascript
string
variables
string-interpolation
2021-01-12 12:12:31
6个回答
您可以利用模板文字并使用以下语法：
`String text ${expression}`
模板文字由反引号(` `)（重音符号）而不是双引号或单引号括起来。
这个特性已经在 ES2015 (ES6) 中引入。
例子
var a = 5;
var b = 10;
console.log(`Fifteen is ${a + b}.`);
// "Fifteen is 15.
那有多整洁？
奖金：
它还允许在 javascript 中使用多行字符串而无需转义，这对模板非常有用：
return `
<div class="${foo}">
...
</div>
`;
由于旧浏览器（主要是 Internet Explorer）不支持此语法，您可能需要使用Babel /Webpack 将您的代码转换为 ES5，以确保它可以在任何地方运行。
边注：
从 IE8+ 开始，您可以在内部使用基本的字符串格式console.log：
console.log('%s is %d.', 'Fifteen', 15);
// Fifteen is 15.
在Firefox 34 / Chrome 41 / Safari 9 / Microsoft Edge 之前，不，这在 javascript 中是不可能的。您将不得不求助于：
var hello = "foo";
var my_string = "I pity the " + hello;
在Firefox 34 / Chrome 41 / Safari 9 / Microsoft Edge 之前，没有。尽管您可以尝试使用sprintf for JavaScript来达到一半：
var hello = "foo";
var my_string = sprintf("I pity the %s", hello);
好吧，你可以这样做，但这不是一般的
'I pity the $fool'.replace('$fool', 'fool')
如果您真的需要，您可以轻松编写一个智能地执行此操作的函数
完整答案，准备使用：
var Strings = {
create : (function() {
var regexp = /{([^{]+)}/g;
return function(str, o) {
return str.replace(regexp, function(ignore, key){
return (key = o[key]) == null ? '' : key;
});
}
})()
};
调用为
Strings.create("My firstname is {first}, my last name is {last}", {first:'Neo', last:'Andersson'});
将它附加到 String.prototype：
String.prototype.create = function(o) {
return Strings.create(this, o);
}
然后用作：
"My firstname is ${first}".create({first:'Neo'});