展开运算符的基本使用

1. …最基本的使用方法就是展开数组

   let arr = [1,2,3,4,5]
   console.log(...arr)  //打印结果是1 2 3 4 5

2. 用来连接两个数组

 let arr = [1,2,3,4,5]
 let arr1 = [5,6,7,8,9]
 let arr2 = [...arr,...arr1]
 console.log(arr2) //打印结果为[1,2,3,4,5,6,7,8,9]

3. 计算数组数据的总和(在不知道数据多少的时候处理数据)

     function sun(...numbers){
       return numbers.reduce((preValue,currentValue)=>{//reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。
           return preValue + currentValue
       })
     }
     console.log(sun(1,2,3,4))//此处输出为10

4. 用来对对象实现拷贝(不可直接展开对象)

     let person = {name : 'tom',age:14}
     let person2 = {...person}
     let person3 = person
     person.name = "jerry"
     console.log(person2) //输出{name:'tom',age:14}
     console.log(person) //输出{name:'jerry',age:14}
     console.log(person3)//输出{name:'jerry',age:14}

5. 用于修改和合并对象

     let person = {name : 'tom',age:14}
     let person4 = {...person,name:"琉璃",address:"地球"}
     console.log(person4)//输出{name: "琉璃", age: 14, address: "地球"}

6. 注:在react中，如

const p = {name : "琉璃" , age : 20 , sex : "男"}
//此处的{...p}跟原生的不一样，babel跟react允许你用展开运算符展开对象，不是复制对象（仅适用标签展开对象）
ReactDOM.render(<Person {...p}/>,document.getElementById("text2"))