描述

es6中的模板字符串可以代替es5的字符串拼接
模板字符串使用反引号 (`) 来代替普通字符串中的用双引号和单引号。

用法

let message = `Hello World`;
console.log(message);//Hello World

特点

在模板字符串中，空格、缩进、换行都会被保留：

let a = `
    <ul>
        <li>1</li>
        <li>2</li>
    </ul>
`;
console.log(a);

如果需要打印出引号，可以使用反斜杠转义：

let message = `Hello \` World`;
console.log(message);//Hello \` World

嵌套变量

模板字符串可以嵌入变量，只需要把变量名写在${} 之中。除了变量名意外，其他的Javascript表达式都可以嵌入

let x = 1, y = 2;
let message = `<ul><li>${x}</li><li>${x + y}</li></ul>`;
console.log(message); // <ul><li>1</li><li>3</li></ul>

模板字符串支持嵌套：

let arr = [{value: 1}, {value: 2}];
let message = `
    <ul>
        ${arr.map((item) => {
            return `
                <li>${item.value}</li>
            `
        })}
    </ul>
`;
console.log(message);
//  <ul>
        
                <li>1</li>
            ,
                <li>2</li>
            
    </ul>