前端基础三十六、ES6 扩展运算符

三十六、ES6 扩展运算符

• 前言
• 扩展运算符的作用
• • 1. 合并数组
  • 2. 数组复制
  • 3. 把类数组转为数组

前言

在前面的文章中我们已经使用过扩展运算符：... ，接下来文章将详细介绍扩展运算符的使用。

扩展运算符的作用

1. 合并数组
2. 数组复制
3. 把类数组转为数组

1. 合并数组

        // 1.合并数组
        let arr1 = [1,2,3];
        let arr2 = [4,5,6];
        console.log(...arr1,...arr2);// 输出： 1 2 3 4 5 6
        console.log(arr1.concat(arr2));// 输出：[1 2 3 4 5 6]
        console.log([...arr1,...arr2]);// 输出：[1 2 3 4 5 6]

2. 数组复制

        // 2.数组复制
        let arr3 = [...arr1];
        arr3 = arr1;
        arr1[0] = 7;
        console.log(arr1,arr3);// 输出 [7, 2, 3][7, 2, 3]

3. 把类数组转为数组

类数组不是真正的数组，没有数组对象下的方法，但可以使用 lenth 方法，如获取的DOM元素：

    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
    </ul>

        // 3.把类数组转为数组
        var aLi = document.getElementsByTagName("li");
        console.log(aLi);// 输出 HTMLCollection(3) [li, li, li]
        let arr4 = [...aLi];
        console.log(arr4);// 输出 [li, li, li]

以上为本萌新个人总结，如有不当之处望指正，有问题可以联系
邮箱：[e-mail]或
QQ：2635591841

更于2021.4.17