js展开运算符

js展开运算符

1 …对于数组的用法

      let arr=[1,2,3]
      // 展开一个数组
      console.log(...arr)

      console.log("-----------");
      // 复制一个数组，也称为拷贝数组
      let arr2=[...arr]
      arr2.push(4);
      // 并且不会对arr造成影响
      console.log("arr",arr);
      console.log("arr2",arr2);
      
      console.log("-----------");
      
      // 连接数组
      let arr3=[...arr,...arr2] 
      console.log(arr3);
      

2. …在函数中的使用

 //对于不确定传多少个值也可以使用扩展运算符
      function add(...numbers) { 
        return numbers
       }
      // 这样在你传值的时候可以一直增加，从此再也不用关心形参的多少！
       console.log(add(1,2,3,4,5));

3. …对于对象的使用

首先强调一点，扩展运算符不能直接用于对象，也就是不用去想展开对象

let obj = {
	name: 'jack',
	age:10
}
console.log(...obj) //代码上并没有报错，但是控制台并不能输出

我们可以构造字面量对象时使用展开语法

      var obj1 = { foo: 'yuan', x: 42 };
      var obj2 = { foo: 'li', y: 13 };
    
      // 克隆对象一定要加上{}
      var clonedObj = { ...obj1 };
      console.log("克隆后的对象",clonedObj);
      console.log("-----------");
      // 同样的修改复制后的并不会影响原来的对象
      clonedObj.foo="ss"
      console.log("clonedObj",clonedObj);
      console.log("obj1",clonedObj);
      console.log("-----------");
      
      // 合并后的对象:
      var mergedObj = { ...obj1, ...obj2}
      console.log("合并后的对象",mergedObj);
      
      console.log("-----------");
      // 当然也可以在合并时添加新的属性
      var mergedObj = { ...obj1, ...obj2,address:"上海"}
      console.log("合并后的对象",mergedObj)