当前位置：首页 > article >正文

【JavaScript】数组函数汇总

article 2024/10/3 13:54:27

JavaScript数组函数是处理和操作数据的基础，对于JavaScript开发至关重要。
函数式编程方法，如map()、filter()和reduce()，能够提高代码的简洁性和功能性。
数据不可变性是现代JavaScript开发中的一个重要概念，函数如concat()和slice()能够在不改变原始数组的情况下进行数据操作。
通过find()、some()和every()等函数，可以更高效地查找和验证数组中的元素。
函数如includes()和indexOf()提供了简便的方式来检查和定位数组元素。
对于需要反转数组或将数组转换为字符串的场景，reverse()和join()提供了便捷的解决方案。

map()：创建一个新数组，其中包含对原始数组中每个元素调用所提供函数的结果。

const numbers = [1, 2, 3, 4];
const doubled = numbers.map(num => num * 2);
console.log(doubled); // [2, 4, 6, 8]

filter()：创建一个新数组，其中包含所有通过所提供函数执行的测试的元素。

const words = ['spray', 'limit', 'elite', 'exuberant'];
const longWords = words.filter(word => word.length > 6);
console.log(longWords); // ['exuberant']

reduce()：通过对每个元素应用一个函数，将数组还原为单个值，并将结果累加。

const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((total, num) => total + num, 0);
console.log(sum); // 10

find()：返回数组中满足所提供测试函数的第一个元素。

const users = [
{ id: 1, name: 'John' },
{ id: 2, name: 'Jane' },
{ id: 3, name: 'Doe' }
];
const user = users.find(user => user.id === 2);
console.log(user); // { id: 2, name: 'Jane' }

some()：测试数组中的是否至少有一个元素通过了所提供函数的测试。

const numbers = [1, 2, 3, 4, 5];
const hasEven = numbers.some(num => num % 2 === 0);
console.log(hasEven); // true

every()：测试数组中的所有元素是否都通过了所提供函数的测试。

const numbers = [2, 4, 6, 8];
const allEven = numbers.every(num => num % 2 === 0);
console.log(allEven); // true

forEach()：为每个数组元素执行一次提供的函数。

const numbers = [1, 2, 3, 4];
numbers.forEach(num => console.log(num * 2)); // 2, 4, 6, 8

concat()：将两个或多个数组合并为一个新数组。

const array1 = [1, 2];
const array2 = [3, 4];
const combined = array1.concat(array2);
console.log(combined); // [1, 2, 3, 4]

slice()：将数组的一部分浅层拷贝到一个新数组中。

const fruits = ['apple', 'banana', 'orange', 'grape'];
const citrus = fruits.slice(2, 4);
console.log(citrus); // ['orange', 'grape']

splice()：通过删除或替换现有元素和/或添加新元素来更改数组的内容。

const numbers = [1, 2, 3, 4, 5];
numbers.splice(2, 1, 99);
console.log(numbers); // [1, 2, 99, 4, 5]

includes()：检查数组是否包含某个元素，返回 true 或 false。

const fruits = ['apple', 'banana', 'orange'];
console.log(fruits.includes('banana')); // true

indexOf()：返回给定元素在数组中的第一个索引，如果没有，则返回-1。

const numbers = [1, 2, 3, 4];
const index = numbers.indexOf(3);
console.log(index); // 2

lastIndexOf()：返回数组中给定元素的最后一个索引，如果不存在，则返回-1。