什么是解构赋值

解构赋值给我们一种新的变量赋值方式，主要可以利用数组解构赋值和对象解构赋值。它的用途包括：交换变量值，提取函数返回值，函数参数定义，默认值设定等等，给我们编程带来便利。

解构赋值的用途

1. 交换变量的值
var x = 1;
var y = 2;
[x,y] = [y,x];// 成功交换 x，y 的值。2. 提取函数返回的多个值 (实现快速的提取对应的值)
function demo(){return {"name":"张三","age":21}
}
var {name,age} = demo();
console.log(name);// 结果：张三
console.log(age);// 结果：21
 
3. 定义函数参数 (方便提取 JSON 对象中想要的参数)
function demo({a,b,c}){console.log("姓名："+ a);
    console.log("身高："+ b);
    console.log("体重："+ c);
}
demo({a:"张三",b:"1.72m",c:"50kg",d:"8000"});
 
4. 函数参数的默认值
function demo({name="张三"}){console.log("姓名："+name);// 结果：姓名：张三
}
demo({});

1. 数组的解构赋值
var [a,b,c] = [1,2,3]; // 把数组的值分别赋给下面的变量；console.log(a);// a 的值为 1
console.log(b);// b 的值为 2
console.log(c);// c 的值为 3
 
1). 结构赋值可以嵌套的
var [a,b,[ c1,c2] ] = [1,2,[ 3.1,3.2] ];
console.log(c1);// 结果：c1 的值为 3.1
console.log(c2);// 结果：c2 的值为 3.2
 
2). 不完全解构
var [a,b,c] = [1,2];
console.log(a);// 结果：a 的值为 1
console.log(b);// 结果：b 的值为 2
 
3). 赋值不成功，变量的值为 undefined
var [a,b,c] = [1,2];
console.log(a);// 结果：a 的值为 1
console.log(b);// 结果：b 的值为 2
console.log(c);// 结果：c 的值为 undefined
 
4). 允许设定默认值
var [a,b,c=3] = [1,2];
console.log(a);// 结果:a 的值为 1
console.log(b);// 结果:b 的值为 2
console.log(c);// 结果:c 的值为 3
 
5). 覆盖默认值 3
var [a,b,c=3] =[1,2,4];
console.log(a);// 结果:a 的值为 1
console.log(b);// 结果:b 的值为 2
console.log(c);// 结果:c 的值为 4
 
注意：当新的值为 undefined 的时候，是不会覆盖默认值的。2. 对象的解构赋值 
 var {a,b,c} = {"a":1,"c":3,"b":2};
console.log(a);// 结果：a 的值为 1
console.log(b);// 结果：b 的值为 2
console.log(c);// 结果：c 的值为 3
 
var {a} = {"b":2};
console.log(a);// 结果：a 的值为 undefined
 
var {b:a,} = {"b":2};
console.log(a);// 结果：a 的值为 2
 
 
1) 对象解构赋值也可以嵌套
var {a:{b}} = {"a":{"b":1}};
console.log(b);// 结果：b 的值为 1
 
2) 可以指定默认值
var {a,b=2} = {"a":1};
console.log(b);// 结果：b 的值为默认值 2
 
3. 字符串的解构赋值
var [a,b,c,d,e,f] = "123456";
console.log(a);//1
console.log(b);//2
console.log(c);//3
console.log(d);//4
console.log(e);//5
console.log(f);//6