善用数组方法能极大地简化代码，提高代码运行速度和可读性，分享下用得比较多的7个数组方法。

1. map() - 数组变形的利器

map()方法创建一个新数组，其结果是对原数组中的每个元素调用提供的函数。

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

// 实际应用：处理API返回数据
const users = [
    { id: 1, name: 'John', age: 30 },
    { id: 2, name: 'Jane', age: 25 }
];
const userNames = users.map(user => user.name);
console.log(userNames); // ['John', 'Jane']

// 链式调用
const prices = [99.99, 199.99, 299.99];
const formattedPrices = prices
    .map(price => price * 0.8) // 打八折
    .map(price => price.toFixed(2)); // 格式化
console.log(formattedPrices); // ['79.99', '159.99', '239.99']

2. filter() - 数据筛选神器

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

// 基础用法
const scores = [65, 90, 75, 85, 55];
const passingScores = scores.filter(score => score >= 60);
console.log(passingScores); // [65, 90, 75, 85]

// 实际应用：复杂条件过滤
const products = [
    { name: 'Phone', price: 999, inStock: true },
    { name: 'Laptop', price: 1999, inStock: false },
    { name: 'Tablet', price: 499, inStock: true }
];
const availableProducts = products.filter(
    product => product.inStock && product.price < 1000
);
console.log(availableProducts); // [{ name: 'Phone'... }, { name: 'Tablet'... }]

3. reduce() - 数据归并专家

reduce()方法将数组缩减为单个值，是最强大但也最容易被误解的方法。

// 基础用法：求和
const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((acc, cur) => acc + cur, 0);
console.log(sum); // 15

// 高级应用：数据分组
const orders = [
    { product: 'A', category: 'Electronics', price: 100 },
    { product: 'B', category: 'Books', price: 50 },
    { product: 'C', category: 'Electronics', price: 200 }
];

const groupedByCategory = orders.reduce((acc, cur) => {
    acc[cur.category] = acc[cur.category] || [];
    acc[cur.category].push(cur);
    return acc;
}, {});

console.log(groupedByCategory);
// {
//     Electronics: [{ product: 'A'... }, { product: 'C'... }],
//     Books: [{ product: 'B'... }]
// }

4. forEach() - 最常用的遍历方法

forEach()方法对数组的每个元素执行一次给定的函数，是最直观的遍历方法。

// 基础用法
const items = ['apple', 'banana', 'orange'];
items.forEach((item, index) => {
    console.log(`${index + 1}: ${item}`);
});
// 1: apple
// 2: banana
// 3: orange

// 实际应用：DOM操作
const buttons = document.querySelectorAll('button');
buttons.forEach(button => {
    button.addEventListener('click', () => {
        console.log('Button clicked');
    });
});

// 累加计算
let total = 0;
const prices = [29.99, 39.99, 49.99];
prices.forEach(price => {
    total += price;
});
console.log(total.toFixed(2)); // '119.97'

5. find() - 精确查找好帮手

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

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

// 实际应用：状态查找
const tasks = [
    { id: 1, status: 'pending' },
    { id: 2, status: 'completed' },
    { id: 3, status: 'pending' }
];
const completedTask = tasks.find(task => task.status === 'completed');
console.log(completedTask); // { id: 2, status: 'completed' }

6. some() - 条件判断利器

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

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

// 实际应用：权限检查
const userRoles = ['user', 'editor', 'viewer'];
const canEdit = userRoles.some(role => role === 'editor');
console.log(canEdit); // true

// 复杂条件检查
const products = [
    { name: 'Phone', price: 999 },
    { name: 'Laptop', price: 1999 },
    { name: 'Tablet', price: 499 }
];
const hasAffordableProduct = products.some(
    product => product.price < 500
);
console.log(hasAffordableProduct); // true

7. every() - 全员检查神器

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

// 基础用法
const scores = [90, 85, 95, 100];
const allPassed = scores.every(score => score >= 60);
console.log(allPassed); // true

// 实际应用：表单验证
const formFields = [
    { value: 'John', required: true },
    { value: 'john@example.com', required: true },
    { value: '123456', required: true }
];
const isFormValid = formFields.every(
    field => field.required ? field.value.length > 0 : true
);
console.log(isFormValid); // true

方法组合使用

这些方法可以链式调用，解决复杂问题：

const data = [
    { id: 1, name: 'John', score: 85, active: true },
    { id: 2, name: 'Jane', score: 92, active: false },
    { id: 3, name: 'Bob', score: 78, active: true },
];

// 获取活跃用户的平均分
const averageScore = data
    .filter(user => user.active) // 筛选活跃用户
    .map(user => user.score) // 提取分数
    .reduce((acc, curr, _, arr) => acc + curr / arr.length, 0); // 计算平均值

console.log(averageScore); // 81.5

性能优化方面

1. 避免在forEach中使用async/await

// 不推荐
array.forEach(async item => {
    await process(item);
});

// 推荐
for (const item of array) {
    await process(item);
}

2. 大数据量处理时考虑使用for…of

// 处理大数组时更高效
for (const item of largeArray) {
    // 处理逻辑
}

3. 合理使用break和continue

// 使用some代替forEach提前退出
const found = array.some(item => {
    if (condition) {
        // 找到后立即退出
        return true;
    }
    return false;
});