- 模板字符串
- es6中采用反引号(`)标识,他可以当做普通字符串来使用,也可以用来定义多行字符串,或在字符串嵌入变量
- 注:
- 当模板中出现反引号时则需要转译符。
- 在使用模板字符串表示多行字符,所有的空格和缩进都会保留在输出之中。若要消除换行,可以使用
trim
。
- 模板中嵌入的变量名必须写在${}之中。
- 模板字符串中还可以调用函数。
- 模板字符串可以嵌套。
// 传统写法
$('#result').append(
' There are <b> ' + basket.count + ' </b> ' +
' items in your basket, ' +
' <em> ' + basket.onSale +
' </em> are on sale! '
);
// es6写法
$('#result').append(`
There are <b> $ { basket.count }</b>
items in your basket,
<em> ${ basket.onSale }
</em> are on sale!
`);
- 标签模板:
- 说明:标签模板其实并不是模板,是函数的一种特殊形式。“标签”指的是函数,紧跟在后面的模板字符串就是他的参数。
alert`123`
// 等同于
alert(123)
function tag(stringArr, value1, value2){}
// =
function tag(stringArr, ...values){}
var a = 5 ;
var b = 10;
tag`Hello ${ a+b } world ${ a*b }`;
// =
tag(['Hello', 'world', ' '],15,50);