这是我参与11月更文挑战的第22天，活动详情查看：2021最后一次更文挑战
问题
面试官：你能讲一下es6的解构赋值吗？
面试者： 可以，主要是针对对象和数组。方便快捷的取到它们内部的值。
面试官： 那对象的解构能取到它原型上的值吗？
面试者：额。。。这个没注意
面试官：哦
以上场景纯属虚构。
今天来总结下es6的解构赋值，包括数组，对象等类型的解构赋值，看看有哪些知识点是自己没有掌握的，一起来学学吧。
解构赋值
就是从给的数据（比如数组，对象等）里提取出目标值，并赋值给变量。 如果数据不是对象类型，则会把它转成对象类型，如果不能转，则会报错。
var {a} = null // error
var {a} = undefined // error
var {length} = '123' // 转成字符串对象，它有length属性
console.log(length) // 3
数组
数组是通过顺序来提取的，提取到了就赋值给对应下标的变量。 变量可以随意命名。
如果变量多了则多出的没匹配上的变量是undefined
如果变量少了则只赋值对应的变量。
var [first,second] = [1,2,3]
console.log(first, second) // 1 2
var [first,second, third, fourth] = [1,2,3]
console.log(first, second, third) // 1 2 3
console.log(fourth) // undefined
数组的解构还支持嵌套。
var [one,[two]] = [1,[2],3]
console.log(two) // 2
可以给变量设置默认值，如果变量没有匹配上，则会使用默认值代替undefined。
变量没有匹配上的条件是没有对应的值或者对应的值全等于undefined。
var [first] = []
console.log(first) // undefined
var [first = 'a'] = []
console.log(first) // 'a'
var [first = 'a'] = [undefined]
console.log(first) // 'a'
var [first = 'a'] = [null]
console.log(first) // null
var [first = 'a'] = [0]
console.log(first) // 0
默认值也可以使用变量名，前提是需要先声明了再使用。
var [first, second = first] = [1]
console.log(first, second) // 1, 1
如果你只想取第二个值，可以这样写
var [,second] = [1,2]
console.log(second) // 2
对象
对象的解构不是按照顺序的，而是匹配key和变量名是否一致，如果一致，则把key对应的value赋值给变量。不一致的话就是undefined。
var {a, b} = {a:1, b:2}
console.log(a,b) // 1 2
var {c} = {a:1, b:2}
console.log(c) // undefined
如果你想自己自定义变量，可以这样写，但是后面就只能通过自定义变量访问了。
var {a: first} = {a:1, b:2}
console.log(first) // 1
console.log(a) // a is not defined
对象的解构还支持嵌套，也支持取到它原型上的值。
var {a: {b}} = {a: {b:2}}
console.log(b) // 2
// 设置原型对象
var obj = Object.create({a:1})
var {a} = obj
console.log(a) // 1
和数组一样，也支持给变量设置默认值。
// 空值会使用默认值
var {a = 123, b = 456} = {}
console.log(a, b) // 123 456
// undefined会使用默认值
var {a: first = 123} = {a: undefined}
console.log(first) // 123
var {a: first = 123} = {a: null}
console.log(first) // null
其它
也可以对函数的参数进行解构，也可以设置默认值
function fn ({a = 1, b = 2} = {}) {
return a + b
}
fn({a: 10, b: 20}) // 30
fn({a: 10}) // 12
fn() // 3
解构赋值用在交换值非常方便
var a = 1, b = 2;
[b,a] = [a,b]
console.log(a, b) // 2 1
针对Map解构的遍历和对象的Object.entries方法，使用解构赋值也很方便
var map = new Map([
['a', 1],
['b', 2]
])
for(let [key, val] of map) {
console.log(key, val)
// a 1
// b 2
}
var obj = {a: 1, b: 2}
for (let [key, val] of Object.entries(obj)) {
console.log(key, val)
// a 1
// b 2
}
