基本语法
1.es6中,用反引号(`)标识。
// 普通字符串
`In JavaScript '\n' is a line-feed.`
// 多行字符串
`In JavaScript this is
not legal.`
字符串中嵌入变量
1.字符串中嵌入变量 使用${}
。
let name = "Bob", time = "today";
`Hello ${name}, how are you ${time} ?`
2.大括号里面可以放表达式 ,可以调用函数。
let x = 1;
let y = 2;
`${x} + ${y} = ${x + y}`
//----------
function fn() {
return "Hello World";
}
`foo ${fn()} bar`
3.如果大括号中的值不是字符串,将按照一般的规则转为字符串。比如,大括号中是一个对象,将默认调用对象的toString方法。
4.由于模板字符串的大括号内部,就是执行 JavaScript 代码,因此如果大括号内部是一个字符串,将会原样输出。
`Hello ${'World'}`
// "Hello World
其他
1.如果字符串中要使用反引号,则前面要用反斜杠转义。
let greeting = `\`Yo\` World!`;
2.如果使用模板字符串表示多行字符串,所有的空格和缩进都会被保留在输出之中。
$('#list').html(`
<ul>
<li>first</li>
<li>second</li>
</ul>
`);
如果你不想要这个换行,可以使用trim
方法消除它。
$('#list').html(`
<ul>
<li>first</li>
<li>second</li>
</ul>
`.trim());
3.模板字符串还能嵌套。
const tmpl = addrs => `
<table>
${addrs.map(addr => `
<tr><td>${addr.first}</td></tr>
<tr><td>${addr.last}</td></tr>
`).join('')}
</table>
`;
const data = [
{ first: '<Jane>', last: 'Bond' },
{ first: 'Lars', last: '<Croft>' },
];
console.log(tmpl(data));