请考虑以下代码:
var age = 3;
console.log("I'm " + age + " years old!");
除了字符串连接之外,还有其他方法可以将变量的值插入到字符串中吗?
自ES6以来,您可以使用模板文字:
null
const age = 3
console.log(`I'm ${age} years old!`)
如果适用,请使用ECMAScript2015的模板字符串文本。
按照ECMAScript5规范,没有直接的方法来实现它,但是ECMAScript6有模板字符串,在起草规范期间也称为准文本。 像这样使用它们:
> var n = 42;
undefined
> `foo${n}bar`
'foo42bar'
您可以在{}
中使用任何有效的JavaScript表达式。 例如:
> `foo${{name: 'Google'}.name}bar`
'fooGooglebar'
> `foo${1 + 3}bar`
'foo4bar'
另一件重要的事情是,您再也不用担心多行字符串了。 您可以简单地将它们写成
> `foo
... bar`
'foo\n bar'
注意:我使用IO.jsV2.4.0来计算上面显示的所有模板字符串。 你也可以使用最新的Chrome来测试上面展示的例子。
注意:ES6规范现已定稿,但尚未被所有主要浏览器实现。
根据Mozilla开发人员网络页面,这将在以下版本中实现基本支持:Firefox 34,Chrome 41,Internet Explorer 12。 如果您是Opera,Safari或Internet Explorer用户,并且现在对此感到好奇,那么可以使用此测试床来进行测试,直到每个人都获得对此的支持为止。
Douglas Crockford的补救JavaScript包括一个string.prototype.supplant
函数。 它简短,熟悉,易于使用:
String.prototype.supplant = function (o) {
return this.replace(/{([^{}]*)}/g,
function (a, b) {
var r = o[b];
return typeof r === 'string' || typeof r === 'number' ? r : a;
}
);
};
// Usage:
alert("I'm {age} years old!".supplant({ age: 29 }));
alert("The {a} says {n}, {n}, {n}!".supplant({ a: 'cow', n: 'moo' }));
如果您不想改变String的原型,您可以随时将其调整为独立的,或者将其放入其他名称空间,或者其他任何东西。