写在前面

ES6是JavaScript语言一个跨越性的新标准，在2015年发布，也叫ES2015，从ES6之后，JavaScript的标准每一年都更新，并以当时的年份命名，如去年的ES2019，从ES6推来也叫ES10。ES6新增的语法很多，只有在用到时才将其整理总结下来，参考文章来源于阮一峰的 ECMAScript 6入门

1 模板字符串—${}

传统的JavaScript语言对于字符串通常是如下方式写的，遇到变量需要用 + 运算符进行字符串的拼接，而且不会保留任何格式，多个空格也会被缩成一个空格。

  1. $('#result').append(
  2.   'There are <b>' + basket.count + '</b> ' +
  3.   'items in your basket, ' +
  4.   '<em>' + basket.onSale +
  5.   '</em> are on sale!'
  6. );

ES6引入了模板字符串（template string）用于增强字符串，用反引号（）标识(该符号在Tab键的上方，在英文输入模式下打出)。它可以当作普通字符串使用，也可以用来定义多行字符串(如果使用模板字符串表示多行字符串，所有的空格和缩进都会被保留在输出之中，如果你不想要这个换行，可以使用trim`方法消除它)，或者在字符串中嵌入变量(${变量名})，如下所示：

  1. $('#result').append(`
  2.   There are <b>${basket.count}</b> items
  3.    in your basket, <em>${basket.onSale}</em>
  4.   are on sale!
  5. `);
  1. // 普通字符串
  2. `In JavaScript '\n' is a line-feed.`
  4. // 多行字符串
  5. `In JavaScript this is
  6.  not legal.`
  8. console.log(`string text line 1
  9. string text line 2`);
  11. // 字符串中嵌入变量
  12. let name = "Bob", time = "today";
  13. `Hello ${name}, how are you ${time}?`

2 …扩展运算符

扩展运算符（spread）是三个点（...）。它好比 rest 参数的逆运算，将一个数组转为用逗号(.)分隔的参数序列。

  1. console.log(...[1, 2, 3])
  2. // 1 2 3
  4. console.log(1, ...[2, 3, 4], 5)
  5. // 1 2 3 4 5
  7. [...document.querySelectorAll('div')]
  8. // [<div>, <div>, <div>]

扩展运算符与正常的函数参数可以结合使用，非常灵活。

  1. function add(x, y) {
  2.   return x + y;
  3. }
  5. const numbers = [4, 38];
  6. add(...numbers) // 42