ES6---解构赋值number、bool、string、array、function、object

ES5中，各种变量、对象的赋值，只能一对一的赋值，es6已经改革，新标准允许我们分组赋值，变量与值位置对应，一一赋值，这便是解构赋值。

---

●string字符串解构赋值:

let [w,b,i]='wbi';
console.log(w,b,i);//w b i

let [w,b]='wbiokr';
console.log(w,b);//w,b

let [w,b,i,o]='wb';
console.log(w,b,i,o);//w,b,undefined,undefined

let [(w)]='wbiokr';//括号，此时报错！

[(w)]='wbiokr';
console.log(w);//w 当前情况下括号不会报错

string解构赋值的时候,键值对永远是一一对应，多出的value不会赋值给最后一个键，多出的键，则为undefined

---

●array数组解构赋值

let [a,b,c]=[1,2,3];
console.log(a,b,c);//1,2,3

let [a,b]=[1,2,3,4];
console.log(a,b);//1,2

let [,a,b]=[1,2,3,4];
console.log(a,b);//2,3

let [a,b,c]=[1];
console.log(a,b,c);//1,undefined,undefined

let [a,b,c]=[1,2,[3]];
console.log(a,b,c);//1,2,[3]

let [a,[b]]=[1,2];//报错！！！！！！！！！

let [a,[b]]=[1,[2]];
console.log(a,b);//1,2

let [a,b]={a:1,b:2}//报错！！！！！！！！！！

let [(a)]=[1];//报错，括号问题！！！

[(a)]=[1];
console.log(a);//1，当前情况下，括号不会报错

位置对应，类型对应！

---

●对象object解构赋值:

let {a}={a:1};
console.log(a);//1

let {b}={a:1};
console.log(b);//undefined

let {a:c}={a:1};
console.log(c);//1

let a;
let {a}={a:1};//报错，此时联想到let的特性，不能重复定义

let a;
{a}={a:1};
console.log(a);//没有报错，结果：1

let c;
let {a:c}={a:1};//报错，同理

let c;
{a:c}={a:1};
console.log(c);//1

let {a,b:{c}}={a:1,b:{c:3}};
console.log(a,b,c);//1,undefined,3

let {(aaaaq)}={aaaaq:1};//报错，括号问题

let {a:(a)}={a:1};//报错，括号问题

{a:(a)}={a:1};
console.log(a);//1当前情况下，括号不会报错

如同数组解构赋值，只要位置对应，不管嵌套与否，嵌套几层，都能成功赋值，但是解构赋值的时候，一定要注意格式。开发过程中的不细心，一个括号问题有可能搞死人。

---

●函数function解构赋值:

(function([a,b,c]){console.log(a,b,c)})([1,2,3]);//1,2,3

[[1,2],[3,4]].reduce(function([a,b]){console.log(a*b)});//2 , 12

解构赋值同样可以作用域函数的参数，同样函数参数也可以赋值默认值

---

●解构赋值中的默认值:

let [a=1]=[];
console.log(a);//1

let {a,b=true}={a:2};
console.log(a,b);//2,true

let {a=true}={a:NaN};
console.log(a);//NaN

let {a=true}={a:null};
console.log(a);//null;

let {a=true}={a:undefined};
console.log(a);//true

function fun(x=1,y=2){
    console.log(x,y)
};
fun('s');//'s 2
fun(2,5);//2,5
fun();//1,2默认值为1,2

function fun2({x,y}={x:1,y:2}){
    console.log(x,y);
}//fun2函数的参数默认值是挣个参数对象
fun2();//1,2同样输出默认值
fun2({x:2});//2 undefined

默认值有绝对会是很好的东西，比如，在我们调用封装ajax函数的时候，页面初始化，会自动调用一次，此时可以不用传递值。

———-

●解构赋值交换x、y值:

曾经我被问到过一个题目，不定义第三个变量，如何交换变量x、y的值。最后也做出来了，但是真的杀死了我N多个脑细胞。

//定义X=2，Y=5不借助第三个值，交换X，Y，结果应该为x=5,y=2

var x=2,y=5;
x=y-x;//此时x=3,y=5
y=y-x;//此时x=3,y=2
x=y+x;//此时x=5,y=2

///////如果硬es6的结构赋值呢.......
let x=2,y=5;
[x,y]=[y,x];
console.log(x,y)//5,2 完美！！！！！！！