ES6之数据解构合集

ES6之数据解构

ES6允许按照一定模式，从数组和对象中提取值，对变量进行复制，这被称为解构，解构的本制属于“模式匹配”，只要等号两边的模式相同，左边的变量就会被赋予对应的值。如果解构不成功，变量的值就等于undefined。

---

• 数组解构

等号左边的变量放到中括号内部，匹配右侧数组中的元素。

```
let [a, b, c] = [1, 2, 3];//a=1;b=2;c=3
```

不完全解构，等号左边的变量个数小于右侧数组中元素个数时，发生不完全解构。

let [a, b] = [1, 2, [3, 4, 5], 6];//a=1;b=2

当等号左边的变量个数大于右侧数组中元素个数的时候，多余变量的匹配值为undefined。

let [a, b, c, d, e, f] = [1, 2, 3, 4];//a=1;b=2;c=3;d=4;e=undefined;f=undefined

集合解构，使用…扩展运算符，可以接收多余数据，返回数组。

let [a, ...b] = [1, 2, 3, 4]; //a = 1; b= [2, 3, 4]

默认值，当匹配值严格等于undefined时，默认值就生效。默认值也可以为函数。

let [x, y = 'b'] = ['a']; // x='a', y='b’

---

• 对象解构

等号左边的变量放到大括号内部，皮皮额右侧数组中的元素。对象的属性没有次序，变量必须与属性同名，才能取到正确的值。

let { foo, bar } = { foo: “aaa”, bar: “bbb” }; // foo = "aaa”; bar = "bbb”

当变量名和属性名一致的时候，可以简写。
如果变量名与属性名不一致的时候，必须写成这样。

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

嵌套解构

let { p: [x, { y }] } = { p: [ ‘Hello’, { y: ‘World’ } ] }; //x = "Hello”; y = "World”

默认值生效条件是对象属性值严格等于undefined。

---

• 字符串解构

等号左边的变量如果放在中括号内进行的类似于数组解构，从字符串中获取指定字符，如果放在大括号内进行的类似于对象解构，从实例属性获方法中解构。

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

将String字符串转为数组

let [...arr] = 'hello';

---

• 数值解构

等号左边的变量放在大括号中进行解构，可以获取到数组包装器构造函数原型中指定的方法。

let {valueOf} = 12; // [Function:valueOf]

---

• 布尔类型解构

等号左边的变量放在大括号中进行解构，可以获取到布尔包装器构造函数原型中指定的方法。

let {valueOf} = true;// [Function:valueOf]

---