ES6 解构赋值更详细功能

知识点

解构赋值可解构数组和对象

数组元素按次序排列，取值取决于位置；对象的属性没有顺序，取值需与属性同名，才可取到值。

给数组和对象解构赋值时可以给予默认值。

//数组
let [x, y = 'b'] = ['a']; // x='a', y='b'
let [x, y = 'b'] = ['a', undefined]; // x='a', y='b'
注意，ES6内部使用严格相等运算符，判断一个位置是否有值，所以这里右边的undefined不能覆盖左边的y='b'
//对象
var {x, y = 5} = {x: 1};
x // 1
y // 5

给对象解构赋值时可定义新的变量名。

let { foo: baz } = { foo: 'aaa', bar: 'bbb' };
baz // "aaa"

若解构失败，变量值为undefined.

let { baz } = { foo: 'aaa', bar: 'bbb' };
baz // undefined

真正被赋值的是后者，而非前者，如下：

let { foo: baz } = { foo: 'aaa', bar: 'bbb' };
baz // "aaa"
foo // error: foo is not defined

字符串也可以解构赋值

const [a, b, c, d, e] = 'hello';
a // "h"
b // "e"
c // "l"
d // "l"
e // "o"

类似数组的对象都有一个length属性，因此还可以对这个属性解构赋值。

//左边的length属性可以对应上右边字符串的length属性，故len是5
let {length : len} = 'hello';
len // 5

函数的参数也可以解构赋值

[[1, 2], [3, 4]].map(([a, b]) => a + b);
// [ 3, 7 ]

function add([x, y]){
  return x + y;
}
//函数将数组参数自动解构为变量x和变量y
add([1, 2]); // 3

以上全部参考自-阮一峰ES6入门
over!