2021-03-08 ES6 spread operator and remaining parameter operator

Spread operator

Mainly to expand and expand, look at the following example

  		let Arr = [1, 2, 3, 4, 5,6, 7, 8, 9]
        console.log(...Arr)//扩展运算符 
        //1, 2, 3, 4, 5,6, 7, 8, 9 
         //相当于打印Arr [0] Arr[1] Arr[2] Arr[3].......
        console.log(Arr[0],Arr[1],Arr[2],Arr[3],Arr[4],Arr[5],Arr[6],Arr[7],Arr[8])
       //1, 2, 3, 4, 5,6, 7, 8, 9 
       两个结果相同

The spread operator is a shallow copy process

        let Arr = [1, 2, 3, 4, 5,6, 7, 8, 9,{
    
    name:"zjq"}]
        let Brr =[...Arr]
        Brr[9].name = 'ZJQ'
        console.log(Arr) //
        console.log(Brr) //
         //两个打印的结果相同 name都为ZJQ 所以扩展运算符是浅拷贝

The spread operator can convert a pseudo array into a true array

    <button>1</button>
    <button>2</button>
    <button>3</button>
    <button>4</button>
    <script>
        let btn = document.getElementsByTagName('button')
        console.log(btn)
        //是一个元素集合 伪数组 
        //HTMLCollection(4) [button, button, button, button]  
        let btn2 = [...btn]
        console.log(btn2)
        //转换成真数组
        // [button, button, button, button]
    </script>

The way to convert a pseudo-array into a true array:
1.Array.from() 2.Expanding
operator
3.for loop with push

Remaining parameter operator

Collect all parameters into an array

        function zjq(...list) {
    
     //剩余参数运算符
            console.log(list) //[1,2,3]
            //可以对参数进行处理
            for (let i=0; i < list.length; i++) {
    
    
                console.log(list[i])
                //1  2  3
            }
        }
        zjq(1, 2, 3)

Object.assign() merges shallow copy of enumerable objects