考虑下面的代码:
var age = 3;
console.log("I'm " + age + " years old!");
除了字符串连接之外,还有其他方法可以将变量的值插入到字符串中吗?
考虑下面的代码:
var age = 3;
console.log("I'm " + age + " years old!");
除了字符串连接之外,还有其他方法可以将变量的值插入到字符串中吗?
当前回答
从ES6开始,如果你想在对象键中做字符串插值,你会得到一个SyntaxError: expected属性名,得到'${'如果你做这样的事情:
let age = 3
let obj = { `${age}`: 3 }
你应该做以下事情:
let obj = { [`${age}`]: 3 }
其他回答
最简单的就是
`my string ${VARIABLE}`
一种效率较低的方法是
function format(str, ...params) {
for(const param of params)
str = str.replace("%", param);
return str;
}
可以和哪个一起使用
format("My % string", "interpolation")
当我不知道如何正确地表达,只想快速地得到一个想法时,我就会在很多语言中使用这种模式:
// JavaScript
let stringValue = 'Hello, my name is {name}. You {action} my {relation}.'
.replace(/{name}/g ,'Inigo Montoya')
.replace(/{action}/g ,'killed')
.replace(/{relation}/g,'father')
;
虽然不是特别高效,但我觉得它可读。它总是有效的,而且总是可用的:
' VBScript
dim template = "Hello, my name is {name}. You {action} my {relation}."
dim stringvalue = template
stringValue = replace(stringvalue, "{name}" ,"Luke Skywalker")
stringValue = replace(stringvalue, "{relation}","Father")
stringValue = replace(stringvalue, "{action}" ,"are")
总是
* COBOL
INSPECT stringvalue REPLACING FIRST '{name}' BY 'Grendel Mother'
INSPECT stringvalue REPLACING FIRST '{relation}' BY 'Son shoulder'
INSPECT stringvalue REPLACING FIRST '{action}' BY 'made a gaping mortal-making wound upon.'
从ES6开始,如果你想在对象键中做字符串插值,你会得到一个SyntaxError: expected属性名,得到'${'如果你做这样的事情:
let age = 3
let obj = { `${age}`: 3 }
你应该做以下事情:
let obj = { [`${age}`]: 3 }
警告:避免任何不允许您转义其自己的分隔符的模板系统。例如,使用此处提到的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(" ");
虽然模板可能最适合你描述的情况,但如果你有或想要你的数据和/或参数是可迭代/数组形式,你可以使用String.raw。
String.raw({
raw: ["I'm ", " years old!"]
}, 3);
将数据作为数组,可以使用展开操作符:
const args = [3, 'yesterday'];
String.raw({
raw: ["I'm ", " years old as of ", ""]
}, ...args);