ECMAScript 6 入门

本文简要介绍 ECMAScript 6 新引入的部分语法特性，作为入门教程的精髓。

let和const

1
2
let a = 1;
const b = 1;

变量的解构赋值

1
2
3
4
5
6
// 数组解构
let [a, b, c] = [1,2,3];
// 对象解构
let {a, b} = {a: 'hello', b: 'world'}
// 解构默认值
let {a = 1 } = {};

字符串扩展

1
2
3
4
5
6
7
// 模板字符串
$('#list').html(`
<ul>
  <li>first</li>
  <li>second</li>
</ul>
`);

函数的扩展

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
// 函数默认值
function log(x = 10, x = 20) {
  console.log(x, y);
}
log()

// rest 参数
function add(...values) {
  let sum = 0;
  for (var val of values) {
    sum += val;
  }
  return sum;
}
add(2, 5, 3) // 10

// 箭头函数
const f = v => v;

数组扩展

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// 扩展运算符
console.log(...[1, 2, 3])

// Array.from, 把arguments转换成真正的数组
let arrayLike = {
    '0': 'a',
    '1': 'b',
    '2': 'c',
    length: 3
};
let arr2 = Array.from(arrayLike); // ['a', 'b', 'c']

// Array.of()方法用于将一组值，转换为数组。
Array.of(3, 11, 8) // [3,11,8]