ES6解构介绍

在es6以前，我们常用arr[i]的形式，来获取下标为i的数组值;在es6里面提供了解构，使我们的代码更加简洁；

比如:

var arr = [1, 2, 3];

//传统方式
var a = arr[0],
    b = arr[1],
    c = arr[2];

在es6语法中解构赋值，就简洁了很多。
var [a, b, c] = arr;

console.log(a);//1
console.log(b);//2
console.log(c);//3

---

对嵌套数组解构：

var arr = [[1, 2, [3, 4]], 5, 6];
var [[a, b, [c, d]], e, f] = arr;
console.log(d);//4
console.log(f);//6
console.log(a);//1

---

更好的是函数传参解构：

var arr = [1, 2, 3];

function fn1([a, b, c]) {
    console.log(a);
    console.log(b);
    console.log(c);
}

fn1(arr);
//1
//2
//3

---

对象传参解构

var obj = {
    name: 'jack',
    sex: 'male',
    age: 26,
    son: {
        sonname: 'bill',
        sonsex: 'male',
        sonage: 1
    }
};

function fn2({sex, age, name}) {
    console.log(name + ' ' + sex + ' ' + age);
}

箭头函数写法: const f3 =（{sex,age,name}）=>{

console.log(name + ' ' + sex + ' ' + age); 

}

fn2(obj);
//jack male 26

f3(obj);

//jack male 26

---

变量名与对象属性名不一致解构：

var obj = {

name: 'jack',

sex: 'male',

age: 26

};

var { name: nickname, age: howold } = obj;

console.log(nickname + ' ' + howold); //jack 26

---

嵌套对象解构：

var obj = {
    name: 'chris',
    sex: 'male',
    age: 26,
    son: {
        sonname: 'bill',
        sonsex: 'male',
        sonage: 1
    }
};
var {name, sex, age, son: {sonname, sonsex, sonage}} = obj;
console.log(sonname + ' ' + sonsex + ' ' + sonage);
//bill male 1

---

循环解构对象：

var arr = [{name: 'jack', age: 26}, {name: 'bill',    age: 27}, {name: 'rose',age: 28}];

for (let {age, name} of arr) {
    console.log(name + ' ' + age);
}
//jack 26
//bill 27
//rose 28