ES6 解构赋值

定义：ES6允许按照一定的模式从数组和对象中提取值，然后对变量进行赋值，这被称为解构赋值。

如：
//定义变量
let a = 1;
let b = 2;
let c = 3;
解构写法：
let [a, b, c] = [1, 2, 3];
console.log(a)；    //1
console.log(c);    //3

对象的解构赋值：

let {foo} = {
    foo: "222",
    bar: "adsafe"
};
//console.log(foo);    //222


let {foo:baz} = {
    foo: 12345
};
//console.log(foo); //foo is undefined
console.log(baz); //12345

let {a} = b;

意思是从b这个对象中提取属性名为a的值并赋给a属性，返回一个对象{a: a}。

即：对象的赋值是下面的简写形式：

let {foo:foo,bar:bar} = {foo:'aaa',bar:'vvvv'};

也就是说，对象的解构赋值的内部机制是先找到同名属性，讲值赋值给对应的变量。真正被赋值的是后者，而不是前者。

上面代码

let {foo:baz} = {
    foo: 12345
};
//console.log(foo); //foo is undefined
console.log(baz); //12345
这段代码foo是匹配模式，baz才是变量。

用途：
1.函数参数的定义

function foo([x, y]) {
    return x + y;
}
var baz = foo([1, 2]);
console.log("baz", baz); //baz 3

function foo({y, x}) {
    return x + y;
}
var baz = foo({
    x: 1,
    y: 2
});
console.log("baz", baz); //baz 3

2.交换变量的值

let x = 2;
let y = 3;
[x, y] = [y, x];
console.log(x, y);　　 //3,2

3.从函数中返回的多个值

function foo() {
    return {
        a: 1,
        b: 2,
        c: 3
    }
}
let {a, b, c} = foo();
console.log(b); //2

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

　　函数只能返回一个值，如果要返回多个值，只能将它们放在数组和对象中。通过解构取出这些值就非常方便。

4.提取JSON数据

let jsonData = {
    id: 12,
    status: 'OK',
    data: [987, 654]
}
let {id, status, data} = jsonData
console.log(id, status, data);    //12 "OK" [987, 654]