解构赋值.

    解构赋值语法是一种Javascript表达式。通过解构赋值，可以将属性/值从对象/数组中取出，赋值给其他变量。是Es6中的新语法，他的本质是模式匹配，就是只要等号两边的模式相同，左边的变量就会被赋予匹配的右边的值，要是匹配不成功变量的值就是undefined；他是针对数组或者对象进行模式匹配，然后对其中的变量进行赋值；他左边表示的是要解构的目标，右边表示解构源；解构赋值还是对赋值运算符的扩展；

    应用场景：

        1.交换变量的值；

        2.让函数中返回多个值，函数只能返回一个值，但用解构赋值的话可以返回是一个数组或者对象；

        3.函数参数的定义；
        4.提取json数据

示例

[one, two] = [50, 100];
console.log(one);
// expected output: 50
console.log(two);
// expected output: 100

[one, two, ...rest] = [10, 20, 30, 40, 50];
console.log(rest);
// expected output: [30, 40, 50]

数组解构

        数组解构是非常简单简洁的，在赋值表达式的左侧使用数组字面量，数组字面量中的每个变量名称映射为解构数组的相同索引项

let [one, two, three] = [1, 2, 3];
// one = 1
// two = 2
// three = 3

声明分别赋值

你可以通过变量声明分别解构赋值

示例：声明变量，分别赋值

// 声明变量
let one, two;
// 然后分别赋值
[one, two] = [1, 2];
console.log(one); // 1
console.log(two); // 2

解构默认值

如果解构取出的值是undefined，可以设置默认值：

let one, two;
// 设置默认值
[one = 5, two = 7] = [1];
console.log(one); // 1
console.log(two); // 7

在上面的例子中，我们给a和b均设置了默认值
这种情况下，如果one或two的值是undefined，它将把设置的默认值赋给相应变量（5赋给one，two赋给b）

交换变量值

以往我们进行两个变量的交换，都是使用

//交换one,two
three = one;
one = two;
two = three;

或者异或的方法

然而在解构赋值中，我们可以在一个解构表达式中交换两个变量值

let one = 1;
let two = 3;
//交换one和two的值
[one, two] = [two, one];
console.log(one); // 3
console.log(two); // 1

解构函数返回的数组

我们可以直接解构一个返回值为数组的函数

function c() {
  return [10, 20];
}

let one, two;
[one, two] = c();
console.log(one); // 10
console.log(two); // 20

在上面的例子中，**c()**的返回值[10，20]可以在单独的同一行代码中使用解构

忽略返回值（或跳过某一项）

你可以有选择性的跳过一些不想得到的返回值

function three() {
  return [1, 2, 3];
}

let [one, two] = three();
console.log(one); // 1
console.log(two); // 3

赋值数组剩余值给一个变量

当你使用数组解构时，你可以把赋值数组剩余的部分全部赋给一个变量

let [one, ...two] = [1, 2, 3];
console.log(one); // 1
console.log(two); // [2, 3]

这样的话b也会变成一个数组了，数组中的项是剩余的所有项

注意：
这里要小心结尾是不能再写逗号的，如果多了一个逗号将会报错

let [one, ...two] = [1, 2, 3];
// SyntaxError: rest element may not have a trailing comma

嵌套数组解构

像对象一样，数组也可以进行嵌套解构

示例：

const color = ['#FF00FF', [255, 0, 255], 'rgb(255, 0, 255)'];

// Use nested destructuring to assign red, green and blue
// 使用嵌套解构赋值 red, green, blue
const [hex, [red, green, blue]] = color;
console.log(hex, red, green, blue); // #FF00FF 255 0 255

字符串解构

在数组解构中，解构的目标若为可遍历对象，皆可进行解构赋值，可遍历对象即实现Iterator接口的数据

let [one, two, three, four, five] = 'hello';
/*
one = 'h'
two = 'e'
three = 'l'
four = 'l'
five = 'o'
*/

对象解构

基础对象解构

let x = { y: 22, z: true };
let { y, z } = x; // let {y:y,z:z} = x;的简写

console.log(y); // 22
console.log(z); // true

赋值给新变量名

当使用对象解构时可以改变变量的名称

let o = { p: 22, q: true };
let { p: foo, q: bar } = o;

console.log(foo); // 22
console.log(bar); // true