13.增强的数组功能

120 阅读1分钟

新增的数组API

静态方法

  • Array.of(...args): 使用指定的数组项创建一个新数组,就是可以将伪数组转化为数组。
  • Array.from(arg): 通过给定的类数组 或 可迭代对象 创建一个新的数组。
<script>
        // 创建了一个数组,数组放了一个5这个元素
        const arr = Array.of(5);
        //创建了一个长度为1的数组
        const arr1 = new Array(1);
        // console.log(arr);

        const divs = document.querySelectorAll("div");
        // from 方法可以将伪数组转化为真正的数组
        const result = Array.from(divs)
        console.log(result);
    </script>

实例方法

  • find(callback): 用于查找满足条件的第一个元素
  • findIndex(callback):用于查找满足条件的第一个元素的下标
  • fill(data):用指定的数据填充满数组所有的内容
  • copyWithin(target, start?, end?): 在数组内部完成复制
  • includes(data):判断数组中是否包含某个值,使用Object.is匹配

1.find(callback) 和 findIndex(callback) 的使用

 <script>
        const arr = [{
                name: "a",
                id: 1
            },
            {
                name: "b",
                id: 2
            },
            {
                name: "c",
                id: 3
            },
            {
                name: "d",
                id: 4
            },
            {
                name: "e",
                id: 5
            },
            {
                name: "f",
                id: 6
            },
            {
                name: "g",
                id: 7
            }
        ]

        //找到id为5的对象
        const result = arr.find(item => item.id === 5)
        const resultIndex = arr.findIndex(item => item.id === 5)

        console.log(result, resultIndex);
    </script>

2.fill的使用

<script>
        // 创建了一个长度为100的数组,数组的每一项是"abc"
        const arr = new Array(100);
        arr.fill("abc"); 
    </script>

3.copyWithin的使用

 <script>
        const arr = [1, 2, 3, 4, 5, 6];
        //从下标2开始,改变数组的数据,数据来自于下标0位置开始
        // arr.copyWithin(2); // [1, 2, 1, 2, 3, 4]

        // arr.copyWithin(2, 1); // [1, 2, 2, 3, 4, 5]

        // arr.copyWithin(2, 1, 3); // [1, 2, 2, 3, 5, 6]
        console.log(arr)
    </script>

4.includes(data)的使用

<script>
        const arr = [45, 21, 356, 66 , 6, NaN, 723, 54];

        console.log(arr.indexOf(66) >= 0)
        console.log(arr.includes(NaN));
    </script>