ES6语法---解构赋值

解构赋值概念

按照一定的模式，从数组和对象中提取值，对变量进行赋值，就被称为解构。
目的是为了提高效率，使用起来更加方便。
以下的各个说明，我会类比着ES5去解释，希望能帮到小伙伴们。

数组解构

正常解构：

ES5：
var arr = [1,2,3];
var a = arr[2];
console.log(a);//3

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

嵌套数组解构：

ES5:
var arr = [1,2,[3,4],5];
var a = arr[2][0];
console.log(a);//3

ES6:
let[a,b,[c,d],e] = [1,2,[3,4],5];
console.log(c,d);//3，4

空缺变量

ES5:
var arr = [1,2,,5];
console.log(arr[2]);//undefined

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

多余变量

ES5:
var arr = [1,2,3];
console.log(arr[3]);//undefined

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

默认值

有默认值，且没有值的，取默认值；有值的取自身的值，不取默认值
let[a,b,c,d='44'] = [1,2,3];
console.log(d);//44

let[a,b,c,d='44'] = [1,2,3，5];
console.log(d);//5

对象解构

ES5:
let obj = new Object();
obj.name = "张三";
obj.age = "22";
console.log(obj.name);//张三

ES6:
let obj = new Object();
obj.name = "张三";
obj.age = "22";
let {age:age,name:name} = obj;
console.log(name,age);//张三 22

字符串解构

ES5:
var res = "晚上好";
console.log(res[2]);//好

let[a,b,c] = "晚上好";
console.log(b);//上

函数参数解构

function show({name,age}){
    //以前
    // var name = obj.name;
    console.log(name)；//李四
    //现在
    console.log(name,age);//李四，23
}
let obj = {
   name:"李四",
   age:"23"
}
show(obj);