(arg) => R 箭头函数的类型
最后更新：2026-10-22
(arg) => R 箭头函数的类型
箭头函数自带类型标注语法：参数后冒号、表达式即返回值。给箭头函数变量显式声明函数类型后，函数体参数与返回值全部自动联动——排序比较器、映射器这类一次性回调的推荐写法。
| 分组 | 函数与类 |
|---|---|
| 类型 | 语法 |
| 严格模式 | 不需要 |
ℹ️ 说明 编辑器将 TypeScript 转译为 JavaScript 后运行（不做类型检查）；类型检查结果见示例 Output。
📝 语法
const byPriceAsc: (a: Product, b: Product) => number = (a, b) => a.price - b.price;
// 泛型箭头函数（.tsx 文件里写 <T,> 避免与 JSX 标签冲突）
const identity = <T,>(v: T): T => v;⚙️ 参数
| (a: Product, b: Product) => number | 变量的函数类型注解：右侧实现体里的 a/b 自动获得类型 |
|---|---|
| <T,>(v: T): T | 泛型箭头函数：类型参数写在参数前；尾随逗号用于 .tsx 消歧 |
返回值：表达式体的返回值即表达式类型；块体用 return，返回类型可显式标注。
▶ 示例
修改下面的代码，点击试一试查看转译运行结果：
输出：
Mouse:89 | Keyboard:199 | Monitor:899
（转译后运行输出；比较器返回布尔值（a.price < b.price）是类型错误——sort 期望 number）💡 要点
ℹ️ 说明 箭头函数没有自己的 this：方法回调和事件处理器里直接用外层 this，这是它与普通函数最关键的运行时差异。
⚠️ 注意 表达式体返回对象字面量要加括号：() => ({ key: v })；写成 () => { key: v } 会被当作块体而返回 undefined。
💡 提示 比较器返回 a.price - b.price（负/零/正）即可升序；不要用布尔值——Boolean 相减虽能跑但语义混乱，类型上也是错的。
🏷️ 相关函数与类
💡 相关案例
更多案例即将上线。
📚 相关教程
❓ 常见问题
Q 箭头函数和普通函数的类型写法有区别吗？
A 类型层面完全一致：都是 (params) => returnType。区别在运行时语义（this、arguments、能否 new）。
Q .tsx 文件里 <T>(v: T) 为什么报错？
A 泛型尖括号与 JSX 标签语法冲突。写成 <T,>（尾随逗号）或 <T extends unknown> 即可消歧。
Q 什么时候需要给箭头函数变量标注类型？
A 当它被赋给变量、存进对象或作为导出 API 时——标注能让实现体享受上下文推断。内联传给已标注参数的函数（如 sort(byPriceAsc)）则可省略。
