重新学习es6文章2.2

一、 接着介绍：变量的解构赋值

1.数组和对象的结构赋值
2. 数字、字符串和布尔值的结构赋值
3. 函数参数的解构赋值
4. 圆括号问题
5. 结构赋值的用途

1. 数组和对象的结构赋值

  //es5的写法
       //let a = 5;
       //let b = 6;
      // es6的写法 //数组的结构赋值本质为模式匹配，左边的变量就会被赋予对应的值。模式完全匹配，或者左边   的变量对象右边的值不完全，反之值对应的变量不完全。
      //如果等号的右边不是数组（或者严格地说，不是可遍历的结构，那么将会报错)。
      let [a, b,c] = [5, 6];

      console.log(a, b,c);
    //   let [d]=55555
    //   console.log(a);//Uncaught TypeError: 55555 is not iterable

      //结构赋值允许指定默认值,默认值使用严格相等判断一个位置是否有值
      let [foo=999]=[55555]
      console.log(foo); //999

      //结构赋值允许引用其它解构赋值的变量，但是变量必须已经声明
      let [x = 1, y = x] = [];     // x=1; y=1
      let [x = 1, y = x] = [2];    // x=2; y=2
      let [x = 1, y = x] = [1, 2]; // x=1; y=2
      let [x = y, y = 1] = [];     // ReferenceError: y is not defined

    //对象的结构赋值
      let { a, b } = { a: "yz", b: "18" };
      console.log(a, b);
      //变量名和属性名相同
      let { foo, bar } = { foo: "199", bar: "996" };
      console.log(foo, bar);
      //变量名和属性名不同 ,，对象的解构赋值的内部机制，是先找到同名属性，然后再赋给对应的变量。真正被  赋值的是后者，而不是前者
      let { xx: f, gg: n } = { xx: "66", gg: "55" };
      console.log(f, n);
      //对象的嵌套结构赋值
      let obj = {
        p: ["Hello", { y: "World" }],
      };

      let {
        p: [x, { y }],
      } = obj;
      x; // "Hello"
      y; // "World"

2.数字，字符串，布尔值的结构赋值：

const [a, b, c, d, e] = 'hello';
a // "h"
b // "e"
c // "l"
d // "l"
e // "o"

let {length : len} = 'hello';
len // 5

在对数字和布尔值解构赋值时，如果等号右边是数值和布尔值，则会先转为对象。

let {toString: s} = 123;
s === Number.prototype.toString // true
let {toString: s} = true;
s === Boolean.prototype.toString // true

3.函数参数的结构赋值

 function add([x, y]) {
        return x + y;
      }
      add([1, 2]); // 3

function move({x = 0, y = 0} = {}) {
  return [x, y];
}

move({x: 3, y: 8}); // [3, 8]
move({x: 3}); // [3, 0]
move({}); // [0, 0]
move(); // [0, 0]

4. 赋值结构的用途

  //交换变量的值
      let x = 1;
      let y = 2;
      [x, y] = [y, x];
      //    函数只能返回一个值，如果要返回多个值，只能将它们放在数组或对象里返回。有了解构赋值，取出这些值就非常方便。
      function example() {
        return [1, 2, 3];
      }
      let [a, b, c] = example();
      // 参数是一组有次序的值
      function f([x, y, z]) {}
      f([1, 2, 3]);

      // 参数是一组无次序的值
      function f({ x, y, z }) {}
      f({ z: 3, y: 2, x: 1 });
      let jsonData = {
        id: 42,
        status: "OK",
        data: [867, 5309],
      };
      let { id, status, data: number } = jsonData;
      console.log(id, status, number);