数组的方法总结

1、调用方法后会修改原数组的

    // 用一个固定值填充一个数组中从起始索引到终止索引内的全部元素
    Array.prototype.fill() // 修改原数组 返回修改后的数组。 
    console.log([1, 2, 3].fill(4, 1));            // [1, 4, 4]

    // 从数组中删除最后一个元素
    // 如果你在一个空数组上调用 pop(),它返回  undefined
    Array.prototype.pop()  // 修改原数组 返回值为删除的元素
    // ['broccoli', 'cauliflower', 'cabbage', 'kale', 'tomato'].pop()

    // 将一个或多个元素添加到数组的末尾
    Array.prototype.push() // 修改原数组 返回值为新数组长度
    const count = ['pigs', 'goats', 'sheep'].push('cows');

    // 将数组中元素的位置颠倒,并返回该数组
    Array.prototype.reverse() // 修改原数组 返回值为修改后的数组
    console.log(['one', 'two', 'three'].reverse())
    
    // 从数组中删除第一个元素
    Array.prototype.shift() // 修改原数组 返回值为删除的元素的值
    console.log([1, 2, 3].shift())

    // 数组排序
    Array.prototype.sort() // 修改原数组 返回值为修改后的数组
    console.log([1, 30, 4, 21, 100000].sort((a, b) => a - b)) // [1, 4, 21, 30, 100000]

    // 删除或替换现有元素或者原地添加新的元素来修改数组
    Array.prototype.splice() // 修改原数组 返回值为被修改的内容 如果没有删除直接新添加的话返回空数组
    console.log(['Jan', 'March', 'April', 'June'].splice(1, 0, 'Feb')) // 新增Feb 索引为1

    // 将一个或多个元素添加到数组的开头
    Array.prototype.unshift() // 修改原数组 返回值为新数组长度 将一个或多个元素添加到数组的开头
    console.log([1, 2, 3].unshift(4, 5)); 

2、调用后不修改原数组的

    //  用于合并两个或多个数组
    Array.prototype.concat() // 不修改原数组,浅拷贝 返回值为新数组
    const array3 = [11, 22].concat([33, 44]);

    // 测试一个数组内的所有元素是否都能通过某个指定函数的测试
    Array.prototype.every() // 不改变原数组 返回布尔值 若为空数组则始终返回true
    console.log(array1.every((currentValue) => currentValue < 40));

    // 是否通过所提供函数
    Array.prototype.filter() // 不改变原数组 返回新数组
    const result = words.filter(word => word.length > 6);
    
    // 是否满足提供的测试函数
    Array.prototype.find() // 不改变原数组 返回数组中满足提供的测试函数的第一个元素的值 否则返回 undefined
    const found = array1.find(element => element > 10);
    
    // 查找数组中满足提供的测试函数的第一个元素的索引
    Array.prototype.findIndex() // 不修改原数组 返回对应索引 没找到对应的话返回-1
    console.log(array1.findIndex((element) => element > 13));

    // 对数组的每个元素执行一次给定的函数
    Array.prototype.forEach() // 不改变原数组 返回值为undefined
    arraySparse.forEach((element) => console.log(element));

    // 使用指定的分隔符将数组变为字符转
    Array.prototype.join() // 不修改原数组 返回值为所有数组元素连接的字符串
    console.log(['Fire', 'Air', 'Water', null].join('')); // "FireAirWater"
    
    // 数组中的每个元素是调用一次提供的函数、
    // 因为map生成一个新数组,当你不打算使用返回的新数组却使用map是违背设计初衷的,
    // 请用forEach或者for-of替代  
    Array.prototype.map() // 不修改原数组 返回值为一个由原数组每个元素执行回调函数的结果组成的新数组
    const map1 = [1, 4, 9, 16].map(x => x * 2);
    
    // 分割数组 由 begin 和 end 决定的原数组的浅拷贝
    Array.prototype.slice() // 不修改原数组 返回值为分割的新数组 浅拷贝
    ['ant', 'bison', 'camel', 'duck', 'elephant'].slice(2, 4)

    // 检查数组中是不是至少有1个元素通过了被提供的函数测试
    Array.prototype.some() // 不修改原数组 返回布尔值
    [1, 2, 3, 4, 5].some((element) => element % 2 === 0)

    // 转换成字符串
    Array.prototype.toString() // 不修改原数组 返回一个字符串
    [1, 2, 'a', '1a'].toString()

3、查找元素的(均区分大小写)

   Array.prototype.lastIndexOf() // 查找在数组中最后出现的位置索引 如果不存在则返回 -1
   Array.prototype.includes() // 判断一个数组是否包含一个指定的值
   Array.prototype.indexOf() // 数组中可以找到一个给定元素的第一个索引

4、其他方法

    Array.prototype.values() // 返回一个新的 Array迭代对象,该对象包含数组每个索引的值
    const array1 = ['a', 'b', 'c'];
    const iterator = array1.values();
    for (const value of iterator) {
      console.log(value); // a, b, c
    }

    Array.prototype.keys() // 返回一个包含数组中每个索引键的迭代对象
    const array2 = ['a', 'b', 'c'];
    const iterator2 = array2.keys();
    for (const key of iterator) {
      console.log(key); // 0, 1, 2
    }

    // 对一个类似数组或可迭代对象创建一个新的,浅拷贝的数组实例
    Array.from() 
    console.log(Array.from('foo')); // Array ["f", "o", "o"]

    // 判断是否是数组
    Array.isArray()
    Array.isArray([1, 2, 3]); // true

参考Array - JavaScript | MDN总结


版权声明:本文为liu18130617928原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。