模板字符串

ES6为我们提供了模板字符串，语法使用反引号“。模板字符串具有以下三个优点：

1. 多行文本
2. 字符串中插入变量
3. 字符串中插入表达式

基本语法

---

// ES5var name1 = 'javascript';console.log(name1);//输出：javascript// ES6let name2 = `ES6`;//是反引号``console.log(name2);//输出：ES6

多行文本

---

ES5

//ES5var str1 = '<div>'+ '<div>javascrip多行输出</div>'+ '</div>';console.log(str1);//输出：<div><div>javascrip多行输出</div></div>var str2 = '<div><div>javascrip多行输出</div></div>';console.log(str2);//输出：<div><div>javascrip多行输出</div></div>

ES6

//ES6let str3 = `<div>    <div>javascrip多行输出</div></div>`;console.log(str3);/*输出：<div>    <div>javascrip多行输出</div></div>*/

可以插入变量或表达式

---

// ES5var name3 = 'ES5';var age1 = 24;var info1 = 'my name is ' + name3 + ' , age is ' + age1 + '.';console.log(info1);//my name is ES5 , age is 24.

ES6的模板字符串实现起来就容易好多。关键语法${}，其中可以插入任何的 js 表达式。

//ES6let name4 = 'ES6';let age2 = 24;let info2 = `my name is ${name4}, my age is ${age2}. ten years later ${age2 + 10}!`;console.log(info2);//my name is ES6, my age is 24. ten years later 34!!

---

有没有觉得方便了很多呢