拓展运算符-CSDN博客

本文链接：https://blog.csdn.net/C20001206/article/details/131668092

拓展运算符

1.概念: ... 拓展运算符可以将数组转换为逗号分割的参数序列
2.使用拓展运算符展开一个数组

        // 声明一个数组
        let arr = [1, 2, 3]
        function demo() {
            // 当不使用拓展运算符时
            // console.log(arguments) // Arguments [Array(3), callee: ƒ, Symbol(Symbol.iterator): ƒ]
            // 当使用拓展运算符时
            console.log(arguments) // Arguments(3) [1, 2, 3, callee: ƒ, Symbol(Symbol.iterator): ƒ]
        }

        demo(...arr)  // 使用拓展运算符可以将参数由[1,2,3] 变为三个参数 1,2,3

3.拓展运算符的应用
1.数组的合并

        // 1.数组的合并
        let arr1 = [1, 2, 3]
        let arr2 = [4, 5, 6]
        let newArr = [...arr1, ...arr2]
        console.log(newArr)  // [1, 2, 3, 4, 5, 6]

2.数组的克隆,可以实现半深拷贝

        // 可以实现半深拷贝
        let arr3 = [1, 2, 3]
        let arr4 = [...arr3]
        console.log(arr4) // [1, 2, 3]

3.将伪书组转换为真数组

<body>
    <div></div>
    <div></div>
    <div></div>
    <script>
      
        // 将伪数组转换为真数组
        let divs = document.querySelectorAll('div')
        // 转换前
        console.log(divs)  // NodeList(3) [div, div, div]
        // 转换后
        console.log([...divs]) // [div, div, div]
    </script>
</body>

</html>