文章目录
- [1. 按用途分类记忆（四大类别）](#1. 按用途分类记忆（四大类别）)
-
- [📊 第一类：查询类（问问题 - 返回布尔值/元素）](#📊 第一类：查询类（问问题 - 返回布尔值/元素）)
- [🔄 第二类：转换类（加工厂 - 返回新数组）](#🔄 第二类：转换类（加工厂 - 返回新数组）)
- [📥 第三类：累积类（收纳箱 - 返回单个值）](#📥 第三类：累积类（收纳箱 - 返回单个值）)
- [🎯 第四类：操作类（动手做 - 可能修改原数组）](#🎯 第四类：操作类（动手做 - 可能修改原数组）)
- [2. 参数顺序的规律记忆](#2. 参数顺序的规律记忆)
-
- [🔢 统一参数模式：](#🔢 统一参数模式：)
- 形象记忆：就像问一个人问题：
- 参数位置口诀：
- [3. 对比记忆法（相似方法对比）](#3. 对比记忆法（相似方法对比）)
-
- [find vs filter：](#find vs filter：)
- [map vs forEach：](#map vs forEach：)
- [4. 实际场景联想记忆](#4. 实际场景联想记忆)
- [5. 制作自己的速查表](#5. 制作自己的速查表)
- [6. 刻意练习方法](#6. 刻意练习方法)
1. 按用途分类记忆（四大类别）
📊 第一类：查询类（问问题 - 返回布尔值/元素）
js
// 特征：都是"问问题"，返回 true/false 或具体元素
const arr = [1, 2, 3, 4, 5];
// ❓ 包含吗？ -> includes(值)
arr.includes(3) // true
// ❓ 有满足条件的吗？ -> some(条件)
arr.some(x => x > 3) // true
// ❓ 都满足条件吗？ -> every(条件)
arr.every(x => x > 0) // true
// ❓ 找第一个满足的 -> find(条件)
arr.find(x => x > 2) // 3
// ❓ 找第一个满足的索引 -> findIndex(条件)
arr.findIndex(x => x > 2) // 2🔄 第二类：转换类（加工厂 - 返回新数组）
js
// 特征：都是"加工数据"，返回新数组
const arr = [1, 2, 3];
// 🏭 映射加工 -> map(加工函数)
arr.map(x => x * 2) // [2, 4, 6]
// 🏭 过滤筛选 -> filter(条件)
arr.filter(x => x > 1) // [2, 3]
// 🏭 展开一层 -> flat(深度)
[1, [2, 3]].flat() // [1, 2, 3]
// 🏭 映射后展开 -> flatMap(加工函数)
arr.flatMap(x => [x, x*2]) // [1, 2, 2, 4, 3, 6]📥 第三类：累积类（收纳箱 - 返回单个值）
js
// 特征：把数组"收敛"成一个值
const arr = [1, 2, 3, 4];
// 📦 从左到右累积 -> reduce(累积函数, 初始值)
arr.reduce((sum, x) => sum + x, 0) // 10
// 📦 从右到左累积 -> reduceRight(累积函数, 初始值)
arr.reduceRight((sum, x) => sum + x, 0) // 10🎯 第四类：操作类（动手做 - 可能修改原数组）
js
// 特征：直接操作原数组
let arr = [1, 2, 3, 4];
// ✂️ 添加/删除 -> splice(开始位置, 删除数量, 添加元素)
arr.splice(1, 2, 99) // 返回删除的元素 [2, 3]
// 📌 结尾添加 -> push(元素)
arr.push(5) // 返回新长度
// 📌 开头添加 -> unshift(元素)
arr.unshift(0) // 返回新长度
// 🗑️ 结尾删除 -> pop()
arr.pop() // 返回删除的元素
// 🗑️ 开头删除 -> shift()
arr.shift() // 返回删除的元素2. 参数顺序的规律记忆
🔢 统一参数模式：
方法名(回调函数(当前元素, 索引, 原数组), thisArg)
形象记忆：就像问一个人问题：
- 当前元素：你现在在做什么？（最重要的）
- 索引：你是第几个做的？（位置信息）
- 原数组：你们团队都在做什么？（上下文）
参数位置口诀：
"先值后索引，最后整个数组"3. 对比记忆法（相似方法对比）
find vs filter：
js
// 🔍 find - 找第一个（返回单个元素）
[1, 2, 3, 4].find(x => x > 2) // 3
// 🎯 filter - 找所有（返回数组）
[1, 2, 3, 4].filter(x => x > 2) // [3, 4]
// 记忆：find像侦探找一个人，filter像渔网捞一堆鱼map vs forEach：
js
// 🏭 map - 加工返回新数组（有返回值）
[1, 2, 3].map(x => x * 2) // [2, 4, 6]
// 🔄 forEach - 只是遍历（无返回值）
[1, 2, 3].forEach(x => console.log(x)) // undefined
// 记忆：map像工厂生产新产品，forEach像质检员只是检查4. 实际场景联想记忆
购物车场景：
js
const cart = [
{name: '苹果', price: 5, quantity: 2},
{name: '香蕉', price: 3, quantity: 3}
];
// 🧮 总金额：reduce（累积计算）
const total = cart.reduce((sum, item) =>
sum + item.price * item.quantity, 0);
// 🏷️ 商品名称：map（提取属性）
const names = cart.map(item => item.name);
// 📦 贵商品：filter（筛选）
const expensive = cart.filter(item => item.price > 4);
// ✅ 有库存吗：some（是否存在）
const hasStock = cart.some(item => item.quantity > 0);用户管理场景：
js
const users = [
{id: 1, name: '张三', active: true},
{id: 2, name: '李四', active: false}
];
// 👥 活跃用户：filter
const activeUsers = users.filter(user => user.active);
// 🔢 用户ID：map
const userIds = users.map(user => user.id);
// 🔍 找用户：find
const user = users.find(u => u.id === 1);
// ✅ 都活跃吗：every
const allActive = users.every(user => user.active);5. 制作自己的速查表
| 用途 | 方法 | 返回值 | 修改原数组 | 记忆口诀 |
|---|---|---|---|---|
| 查询存在 | includes() | 布尔值 | ❌ | "包含吗？" |
| 查询满足 | some() | 布尔值 | ❌ | "有满足的吗？" |
| 查询全部 | every() | 布尔值 | ❌ | "都满足吗？" |
| 查找元素 | find() | 元素 | ❌ | "找第一个" |
| 转换所有 | map() | 新数组 | ❌ | "加工每个" |
| 筛选元素 | filter() | 新数组 | ❌ | "过滤留下" |
| 累积计算 | reduce() | 单个值 | ❌ | "收敛成值" |
6. 刻意练习方法
每日一练：
js
// 周一：map/filter 练习
const numbers = [1, 2, 3, 4, 5];
// 1. 所有数字平方
// 2. 只保留偶数
// 3. 数字转字符串
// 周二：find/some/every 练习
const users = [{age: 25}, {age: 30}, {age: 17}];
// 1. 找第一个成年人
// 2. 有未成年人吗？
// 3. 都成年了吗？项目实战：
在实际项目中有意识地在每个数组操作时思考：
- 我要做什么？（查询、转换、筛选、累积）
- 选择对应类别的方法
- 回忆参数顺序
这样坚持2-3周，就能形成肌肉记忆，不再需要临时查文档了！