数组扩展

类数组 伪数组

Array.from()

{
    // Array.from() 方法从一个类似数组或可迭代对象中创建一个新的数组实例。
    let p = document.querySelectorAll("p");
    let pArr = Array.from(p);
    pArr.forEach(function (item) {
        console.log(item.textContent); //
    });
    console.log(
        Array.from([1, 3, 5], function (item) {
            return item * 2;
        })
    ); // [ 2, 6, 10 ]
}

Array.of()

{
    // Array.of() 方法创建一个具有可变数量参数的新数组实例，而不考虑参数的数量或类型。
    let arr = Array.of(3, 4, 7, 9, 11);
    console.log("arr=", arr); // arr= [ 3, 4, 7, 9, 11 ]
    let empty = Array.of();
    console.log("empty", empty); // empty []
}

copyWithin()

{
    // copyWithin函数，用于操作当前数组自身，用来把某些个位置的元素复制并覆盖到其他位置上去
    // Array.prototype.copyWithin(target, start = 0, end = this.length)
    // target：目的起始位置。
    // start：复制源的起始位置，可以省略，可以是负数。
    // end：复制源的结束位置，可以省略，可以是负数，实际结束位置是end-1。
    console.log([1, 2, 3, 4, 5].copyWithin(0, 3, 4)); // [ 4, 2, 3, 4, 5 ]
}

fill()

{
    // fill()函数，使用制定的元素填充数组，其实就是用默认内容初始化数组
    // arr.fill(value, start, end)
    // value：填充值
    // start：填充起始位置，可以省略
    // end：填充结束位置，可以省略，实际结束位置是end-1
    console.log("fill-7", [1, "a", undefined].fill(7)); // fill-7 [ 7, 7, 7 ]
    console.log("fill,pos", ["a", "b", "c"].fill(7, 1, 3)); // fill,pos [ 'a', 7, 7 ]
}

find() findIndex()

{
    // 数组实例的find方法，用于找出符合条件的数组的值
    // 数组实例的findIndex方法，用于找出符合条件的数组下标
    console.log(
        [1, 2, 3, 4, 5, 6].find(function (item) {
            return item > 3;
        })
    ); // 4
    console.log(
        [1, 2, 3, 4, 5, 6].findIndex(function (item) {
            return item > 3;
        })
    ); // 3
}

includes()

{
    // ES6提供了Array.includes()函数判断是否包含某一元素，除了不能定位外，解决了indexOf的上述的两个问题。它直接返回true或者false表示是否包含元素，对NaN一样能有有效。
    console.log("number", [1, 2, NaN].includes(1)); // number true
    console.log("number", [1, 2, NaN].includes(NaN)); // number true
}

entries\keys\values

{
    // ES6 提供三个新的方法 —— entries()，keys()和values() —— 用于遍历数组。它们都返回一个遍历器对象，可以用for...of循环进行遍历，唯一的区别是keys()是对键名的遍历、values()是对键值的遍历，entries()是对键值对的遍历
    // values() 方法在 Chrome 下面运行会报错未定义（not a function）
    for (let index of ["1", "c", "ks"].keys()) {
        console.log("keys", index);
        // keys 0
        // keys 1
        // keys 2
    }
    for (let values of ["1", "c", "ks"]) {
        console.log("values", values);
        // values 1
        // values c
        // values ks
    }
    for (let [index, values] of ["1", "c", "ks"].entries()) {
        console.log("index,values", index, values);
        // index,values 0 1
        // index,values 1 c
        // index,values 2 ks
    }
}