数组常用方法总结,它们的特点以及如何使用

文章目录

    • filter()
    • map()
    • sort()
    • forEach()
    • reduce()
    • concat()
    • find()
    • indexOf()
    • slice()
    • splice()
    • includes()
    • push()
    • pop()
    • shift()
    • unshift()
    • every()
    • some()

filter()

  • 特点: 创建一个新数组,其中包含通过提供函数实现的测试的所有元素。
  • 用法: arr.filter(callback(element, index, array))
  • 适用场景: 从数组中筛选满足特定条件的元素。
  • 是否改变原数组: 不改变
  • 举例:
let arr = [1, 2, 3, 4, 5];
let evenNumbers = arr.filter(function(element) {
  return element % 2 === 0;
});
// evenNumbers 为 [2, 4]
// arr 不变

map()

  • 特点: 创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。
  • 用法: arr.map(callback(element, index, array))
  • 适用场景: 对数组中的每个元素进行操作,生成一个新数组。
  • 是否改变原数组: 不改变
  • 举例:
let arr = [1, 2, 3];
let squaredNumbers = arr.map(function(element) {
  return element * element;
});
// squaredNumbers 为 [1, 4, 9]
// arr 不变

sort()

  • 特点: 对数组中的元素进行排序。
  • 用法: arr.sort([compareFunction])
  • 适用场景: 对数组进行排序。
  • 是否改变原数组: 改变
  • 举例:
let arr = [3, 1, 4, 1, 5, 9, 2, 6, 5];
arr.sort((a, b) => a - b);
// arr 为 [1, 1, 2, 3, 4, 5, 5, 6, 9]

forEach()

  • 特点: 对数组中的每个元素执行提供的函数。
  • 用法: arr.forEach(callback(element, index, array))
  • 适用场景: 遍历数组执行操作,没有返回值。
  • 是否改变原数组: 不改变
  • 举例:
let arr = [1, 2, 3];
arr.forEach(function(element) {
  console.log(element);
});
// 输出:
// 1
// 2
// 3
// arr 不变

reduce()

  • 特点: 对数组中的所有元素执行一个累加器函数,将结果累积到单个返回值。
  • 用法: arr.reduce(callback(accumulator, currentValue, index, array), initialValue)
  • 适用场景: 需要对数组中的元素进行累积操作。
  • 是否改变原数组: 不改变
  • 举例:
let arr = [1, 2, 3, 4, 5];
let sum = arr.reduce(function(accumulator, currentValue) {
  return accumulator + currentValue;
}, 0);
// sum 为 15,arr 不变

concat()

  • 特点: 将两个或多个数组合并成一个新数组。
  • 用法: arr.concat(array1, array2, …, arrayN)
  • 适用场景: 合并多个数组。
  • 是否改变原数组: 不改变
  • 举例:
let arr1 = [1, 2, 3];
let arr2 = [4, 5, 6];
let newArr = arr1.concat(arr2);
// newArr 为 [1, 2, 3, 4, 5, 6]
// arr1 和 arr2 不变

find()

  • 特点: 返回数组中满足提供的测试函数的第一个元素的值,否则返回 undefined。
  • 用法: arr.find(callback(element, index, array))
  • 适用场景: 查找满足条件的第一个元素。
  • 是否改变原数组: 不改变
  • 举例:
let arr = [1, 2, 3, 4, 5];
let found = arr.find(function(element) {
  return element > 2;
});
// found 为 3,arr 不变

indexOf()

  • 特点: 返回数组中第一个找到的元素索引,如果不存在则返回 -1。
  • 用法: arr.indexOf(searchElement[, fromIndex])
  • 适用场景: 查找元素在数组中的位置。
  • 是否改变原数组: 不改变
  • 举例:
let arr = [1, 2, 3, 4, 5];
let index = arr.indexOf(3);
// index 为 2,arr 不变

slice()

  • 特点: 返回数组的一部分,不修改原数组。
  • 用法: arr.slice(start, end)
  • 适用场景: 获取数组的子集而不改变原数组。
  • 是否改变原数组: 不改变
  • 举例:
let arr = [1, 2, 3, 4, 5];
let subset = arr.slice(1, 3);
// subset 为 [2, 3],arr 不变

splice()

  • 特点: 从数组中添加/删除元素。
  • 用法: arr.splice(start[, deleteCount[, item1[, item2[, …]]]])
  • 适用场景: 修改数组内容,可用于删除、插入或替换元素。
  • 是否改变原数组: 改变
  • 举例:
let arr = [1, 2, 3, 4, 5];
arr.splice(2, 1); // 从索引 2 开始删除 1 个元素
// arr 变为 [1, 2, 4, 5]

includes()

  • 特点: 判断数组是否包含某个特定的元素,返回 true 或 false。
  • 用法: arr.includes(searchElement[, fromIndex])
  • 适用场景: 判断数组是否包含某个元素。
  • 是否改变原数组: 不改变
  • 举例:
let arr = [1, 2, 3, 4, 5];
let includesThree = arr.includes(3);
// includesThree 为 true,arr 不变

push()

  • 特点: 在数组的末尾添加一个或多个元素,并返回新数组的长度。
  • 用法: arr.push(element1, element2, …, elementN)
  • 适用场景: 添加新元素到数组末尾。
  • 是否改变原数组: 改变
  • 举例:
let arr = [1, 2, 3];
let length = arr.push(4, 5);
// 现在 arr 为 [1, 2, 3, 4, 5],length 为 5

pop()

  • 特点: 移除并返回数组的最后一个元素。
  • 用法: arr.pop()
  • 适用场景: 删除数组末尾的元素。
  • 是否改变原数组: 改变
  • 举例:
let arr = [1, 2, 3];
let lastElement = arr.pop();
// 现在 arr 为 [1, 2],lastElement 为 3

shift()

  • 特点: 移除并返回数组的第一个元素。
  • 用法: arr.shift()
  • 适用场景: 删除数组开头的元素。
  • 是否改变原数组: 改变
  • 举例:
let arr = [1, 2, 3];
let firstElement = arr.shift();
// 现在 arr 为 [2, 3],firstElement 为 1

unshift()

  • 特点: 在数组的开头添加一个或多个元素,并返回新数组的长度。
  • 用法: arr.unshift(element1, element2, …, elementN)
  • 适用场景: 在数组开头添加元素。
  • 是否改变原数组: 改变
  • 举例:
let arr = [2, 3];
let length = arr.unshift(0, 1);
// 现在 arr 为 [0, 1, 2, 3],length 为 4

every()

  • 特点: 测试数组中的所有元素是否都通过了提供的函数的测试。
  • 用法: arr.every(callback(element, index, array))
  • 适用场景: 判断数组中的所有元素是否满足条件。
  • 是否改变原数组: 不改变
  • 举例:
let arr = [2, 4, 6, 8, 10];
let allEven = arr.every(function(element) {
  return element % 2 === 0;
});
// allEven 为 true,arr 不变

some()

  • 特点: 测试数组中的元素是否至少一个满足提供的函数的测试。
  • 用法: arr.some(callback(element, index, array))
  • 适用场景: 判断数组中是否至少有一个元素满足条件。
  • 是否改变原数组: 不改变
  • 举例:
let arr = [1, 2, 3, 4, 5];
let hasEven = arr.some(function(element) {
  return element % 2 === 0;
});
// hasEven 为 true,arr 不变

你可能感兴趣的:(javascript,前端,开发语言)