本文详解如何将箭头函数作为回调函数传入自定义 find 函数，通过遍历数组并执行该函数判断匹配项，最终返回首个满足条件的对象。重点解析箭头函数的参数绑定、调用时机与作用域逻辑。
本文详解如何将箭头函数作为回调函数传入自定义 find 函数，通过遍历数组并执行该函数判断匹配项，最终返回首个满足条件的对象。重点解析箭头函数的参数绑定、调用时机与作用域逻辑。
在 JavaScript 中，函数是一等公民（first-class citizen），这意味着函数可以像字符串、数字一样被赋值、存储、作为参数传递，甚至作为返回值。你遇到的 (toy) => (toy.type === 'car') 正是一个箭头函数表达式——它本身不是数据，而是一段可执行的逻辑；toy 并非预先定义的变量，而是该函数的形参（parameter），仅在函数被调用时由调用方动态传入实际值（即“实参”）。
因此，你的原始实现中直接调用 toy() 是错误的：因为 toy 期望接收一个对象（如 {type: "car", color: "red"}）作为参数，而不是无参调用。正确做法是：遍历 array，对每个元素（例如 array[i]）调用该箭头函数，并检查其返回值是否为 true。
以下是完整、健壮的 find 实现：
function find(array, predicate) {
for (let i = 0; i < array.length; i++) {
if (predicate(array[i])) {
return array[i];
}
}
return undefined; // 标准行为：未找到返回 undefined（而非 null）
}✅ 关键点说明：
立即学习“Java免费学习笔记（深入）”；
-
predicate（谓词函数）是通用命名惯例，表示“用于判断真假的函数”，比toy更准确体现其角色； -
predicate(array[i])才是正确调用方式：将当前数组元素作为实参传入，此时toy形参自动绑定为该对象； - 箭头函数
(toy) => toy.type === 'car'在运行时等价于function(toy) { return toy.type === 'car'; }，简洁且隐式返回布尔值； - 若遍历结束未匹配，返回
undefined符合原生Array.prototype.find行为，更利于后续逻辑处理。
验证示例：
const toys = [
{ type: "car", color: "red" },
{ type: "ball", color: "blue" },
{ type: "teddy-bear", color: "brown" }
];
const carToy = find(toys, (toy) => toy.type === 'car');
console.log(carToy); // { type: "car", color: "red" }
const noMatch = find(toys, (toy) => toy.type === 'robot');
console.log(noMatch); // undefined⚠️ 注意事项：
- 不要混淆「函数定义」与「函数调用」：
(toy) => ...是定义，predicate(item)是调用； - 箭头函数没有自己的
this、arguments或new.target，但在本例中因仅作简单判断，无需关注此特性； - 生产环境建议使用原生
array.find(predicate)，但手写实现有助于深入理解高阶函数与回调机制。
掌握这种“函数作为参数”的模式，是理解 map、filter、reduce 等数组方法，以及 React 回调、事件处理器、Promise 链式调用的基础。推荐延伸学习：MDN 文档中关于 Higher-order functions 和 Arrow functions 的官方指南。
