2、ES6之 解构

一、数组解构
1.基本用法
let [a,b] = [1,2]
a //1
b //2

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

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

let [a,...arr] = [1,2,3,4,5,6]
a //1
arr //[2,3,4,5,6] arr如果无值，则一定为空数组 []

不完全解构的情况下（变量不足）
按照索引0开始给变量赋值
解构失败（变量过多）
赋值为undefined

2.默认值
let [a=1] = []
a //1

let [a=1] = [undefind]
a //1

let [a=1] = [null]
a //null

以上可以看出：
重点：
如果一个数组（后面那个arr）成员 === undefind 时，默认值才会生效；
a = arr[0]===undefind ? 默认值 : arr[0]

二、对象解构
变量名和属性名一致：
var { a,b } = {a:1,b:2}
a //1
b //2

变量名和属性名不一致
var {a:b} = {a:1,b:2}
a //报错 a is not defined
b //1
重点：
此时：a是匹配模式，b是变量声明 =》 var b = obj.a

使用对象的方式结构数组(数组可以看成键值为数字的对象)
var {0:a,1:b,3:c} = [0,1,2,3]
a //0
b //1
c //3

错误示范：
let a ;
{a} = {a:1} //语法错误

三、字符串解构
var {0:a,1:b,2:c,length:d} = "wtf"
var [a,b,c] = "wtf"
a //w
b //t
c //f
d //3

四、对Number 和Boolean 解构
var {toString : a} = 123 // a = Number.toString
a === Number.prototype.toString //true
var {toString : a} = true // a = Boolean.toString
a === Boolean.prototype.toString //true

五、函数参数结构赋值
function fun( {x=1,y=2} = {} )
{
cnsole.log(x,y)
}

fun({x:2}) //2,undefined
fun({x:2,y:3}) //2,3
fun({x:2,y:3,z:4}) //2,3

重点：
你最好不要在结构里面用圆括号，使用不当贼容易报错

六、在哪儿使用这个最方便呢？
1.面试题：不声明第三个变量，交换两个变量的值
var a = 1,b = 2;
[a,b]=[b,a]

2.函数返回值为对象时
var {a,b} = (function (){return {a:1,b:2}})()

3.函数参数

4.提取JSON数据

5.函数参数默认值

6.遍历Map结构
var map = new Map()
map.set("a","1")
map.set("b","2")

for(let [key,value] of map)
{
console.log(key +" is "+ value)
}
//a is 1
//b is 2

7.引入模块
const {SourceMapConsumer, SourceNode} = require("Source-map")