JavaScript基础 - 26 （数组的展开写法、参数的展开语法、对象的展开、数组解构、对象解构、复杂解构）

1、数组的展开写法

        ...数组，可以去掉数组的[ ]包围，把数组展开，依次存放到新数组中，不会影响原数组

      var nums = [11, 22, 33, 44];

      //希望获取一个新的数组
      var nums2 = nums;
      nums2.push(55);
      var nums3 = [...nums, 66];
      console.log(nums3);
      console.log(nums);

      var names = ["lily", "john", "tom"];
      var names1 = ["安安", "毛毛", "丫丫"];
      //合并两个数组，得到新数组
      var names2 = [...names, ...names1];

2、参数的展开语法

     //参数的展开语法
      var nums = [12, 3, 45, 10, 123, 33, 6];

      //得到最大值
      //...可以把数组展开为参数
      console.log(Math.max(...nums));
      console.log(Math.max.apply(null, nums));

3、对象的展开

      var obj = { name: "丫丫", age: 19 };

      //浅克隆：制作一个新的对象，把旧对象的值加入到新对象中
      var obj1 = { ...obj, phone: "18712345678" };

      //合并对象
      var a1 = { x: 11, y: 22, z: 33 };
      var a2 = { h: 66, y: 999 };
      //存在相同属性名时，后面的覆盖前面的
      var aa = { ...a1, ...a2 };

4、数组解构

      var nums = [11, 22, 33, 44];
      var [a, b, , c] = nums;
      console.log(a, b, c); //11 22 44

      //灵活的使用场景：变量互换值
      let x = 99;
      let y = 11;
      [x, y] = [y, x];
      console.log(x,y);

5、对象解构

      var obj = { name: "丫丫", age: 22, phone: "18512345678" };

      let { name, age, phone } = obj;
      console.log(name, age, phone);

      //起别名
      let { name: name1 } = obj;
      console.log(name1);

      //灵活的使用场景：参数直接解构
      var data = { name: "安安", age: 22 };
      function show({ name, age }) {
        // var {name,age}=data;
        console.log(name, age);
      }
      show(data);

6、复杂解构

        解构对象，对象里面有对象

     var obj = {
        skills: ["html", "css", "js"],
        game: {
          name: "LOL",
          price: 9000,
        },
      };

      let {
        skills: [a, b, c],
        game: { name:gname, price },//别名：gname
      } = obj;