【ES6】spread运算符

MDN

语法

• 函数调用

fn(...iterableObj)

        const arrNumber = [3,2,4]
        function getSum(a,b,c,y){
            console.log(a+b+c+y)
            return a+b+c+y
        }
        getSum(...arrNumber,4)


        // 剩余参数
        function fn1 (x,...args){
            console.log('fn1',args)
            // Array(3) [ "a", "b", "c" ]
        }
        fn1('x','a','b','c')

        

• 字面量数组构造或字符串

 // 字面量数组构造或字符串
        const arr2 = ["a", "b", "c", "d"];
        const newArr = [...arr2,'ss','bb']
        console.log(newArr)
        //Array(6) [ "a", "b", "c", "d", "ss", "bb" ]
        const arr3 = [
            {id:1,name:'yomuki'},
            {id:2,name:'mmmm'},
            {id:3,name:'uuuu'},
        ]
        const newArr3 = [...arr3,'ss','bb']
        console.log(newArr3)
        // Array(5) [ {…}, {…}, {…}, "ss", "bb" ]
        const str1 = 'asdfg'
        const newStrArr = [...str1]
        console.log(newStrArr)
        //Array(5) [ "a", "s", "d", "f", "g" ]

        // 数组拷贝 （浅拷贝 只拷贝一层）
        var arr4 = [1,2]
        // var arr5 = arr4 //会导致arr4也插入3
        // arr5.push(3) 
        // console.log(arr4)
        var arr5 = [...arr4]
        arr5.push(3) 
        console.log(arr4)

• 构造字面量对象时,进行克隆或者属性拷贝

// 构造字面量对象时,进行克隆或者属性拷贝
        // 将已有对象的所有可枚举(enumerable)属性拷贝到新构造的对象中.
        // 展开语法则不会触发 setters
        const obj1 = {
            age : 12,
            name:'yomuki'
        }
        const newObj1 = {
            ...obj1,
            x:'x',
            y:'y'
        }
        console.log(newObj1)
        // Object { age: 12, name: "yomuki", x: "x", y: "y" }
        const obj2 = {
            like : 'eat'
        }
        const newObj2 = {
            ...obj1,
            ...obj2
        }
        console.log(newObj2)
        // Object { age: 12, name: "yomuki", like: "eat" }