es6箭头函数最常用于简化高阶函数回调,支持单参数省括号、单表达式省return、多参数清晰、解构语义化,并自动绑定this。

ES6 箭头函数最自然、最常用的简化场景,就是写高阶函数(如 map、filter、reduce、sort、forEach)的回调函数。它让逻辑更紧凑,避免冗余语法,同时自动解决 this 绑定问题。
参数和返回值一键压缩
高阶函数的回调往往只做简单映射或判断,比如“把每个数翻倍”“找出偶数”——这类单行逻辑,箭头函数可直接省略括号、大括号和 return:
-
[1, 2, 3].map(x => x * 2)—— 单参数 + 单表达式,连括号和return都不用写 -
[1, 2, 3, 4].filter(n => n % 2 === 0)—— 条件判断,简洁直观 -
['a', 'bb', 'ccc'].map(str => ({ length: str.length, value: str }))—— 返回对象时记得用小括号包裹:({ ... }),否则会被当成代码块解析报错
多参数也清晰不啰嗦
像 reduce 或 sort 这类需要两个参数的回调,箭头函数依然保持干净:
用于 inference.sh 的 JavaScript/TypeScript SDK,可运行 AI 应用、构建代理、集成 150+ 模型。包名:@inferencesh/sdk(npm install),完整 TypeScript 支持。
-
[1, 2, 3].reduce((sum, cur) => sum + cur, 0)—— 参数用括号包住,逻辑一目了然 -
arr.sort((a, b) => a.age - b.age)—— 替代传统function(a, b) { return a.age - b.age; },少写 12 个字符以上
嵌套与解构让结构更语义化
处理对象数组时,结合参数解构,回调可直接聚焦业务字段:
-
users.map(({ id, name }) => `${id}: ${name}`)—— 不用再写user.id、user.name -
list.filter(({ status }) => status === 'active')—— 条件提取更干净 - 甚至支持嵌套解构:
data.map(({ user: { id, profile: { avatar } } }) => ({ id, avatar }))
规避 this 失控问题
在类方法或事件处理器中调用高阶函数时,普通函数回调容易丢失 this;箭头函数天然继承外层作用域的 this,无需 .bind(this) 或中间变量:
-
错误示范(this 可能为 undefined):
this.items.map(function(item) { return this.format(item); }) -
正确写法(this 指向当前实例):
this.items.map(item => this.format(item))










