当前位置: 首页 > news >正文

ES6 箭头函数

引言
ES6 箭头函数(=>)彻底改变了 JavaScript 的编码风格,提供简洁语法和词法作用域绑定。但不当使用可能引发意外行为,本文将揭示其核心特性和避坑指南。


1. 词法绑定 this:告别 bind

箭头函数继承外层 this,解决回调函数 this 丢失问题:

class Timer {constructor() {this.seconds = 0;// 传统函数需额外绑定 this// setInterval(function() { this.seconds++ }.bind(this), 1000);// 箭头函数自动绑定setInterval(() => this.seconds++, 1000); }
}
 
 

2. 隐式返回值:单行代码优化

省略 return 简化函数书写:

// 传统写法
const squares = [1,2,3].map(function(n) {return n * n; 
});// 箭头函数简化
const squares = [1,2,3].map(n => n * n);
 
 

3. 慎用场景:避免误入歧途

不适用以下场景:

// ❌ 对象方法(this 指向错误)
const person = {name: "Alice",greet: () => console.log(`Hi, ${this.name}`) // this.name = undefined
};// ❌ 原型方法(同上)
Person.prototype.greet = () => {/* this 错误 */ };// ❌ 动态上下文(如 DOM 事件)
button.addEventListener('click', () => {console.log(this); // 指向 window 而非 button
});
 
 

4. 无 arguments 对象:替代方案

需用剩余参数(...args)替代:

const logArgs = (...args) => console.log(args);
logArgs(1, 2); // 输出 [1, 2]
 
 

结语
箭头函数虽简洁,但需牢记:

  • 优先用于匿名回调、map/filter 等短函数
  • 避免在对象方法/构造函数中使用
  • 动态 this 场景改用普通函数
http://www.hskmm.com/?act=detail&tid=34348

相关文章:

  • mysql嵌套查询如何利用索引?
  • 解码Linux文件IO之LCD屏原理及应用
  • centos 7.9快速部署ARL(Asset Reconnaissance Lighthouse)资产侦察灯塔系统用于信息收集
  • 3 分钟搞懂 Java 中 this 关键字的用法
  • 折腾笔记[32]-windows部署vscode-server及使用命令行编译c#.net工程
  • Java 中 ArrayList 和 LinkedList 的选择技巧
  • Java 静态方法为什么不能访问非静态成员?
  • 2025润滑油厂家推荐:三特石化全合成长效发动机油,品质卓越!
  • Java 类与对象实践:从代码验证到四则运算开发
  • CF1032F Vasya and Maximum Matching
  • ctf常见编码
  • WPS中Mathtype插件消失不见解决方法
  • 2025气泡膜机优质厂家推荐:瑞康机械,高效生产与定制服务兼备!
  • 音视频编解码全流程之用Extractor后Decodec - 实践
  • P8817 [CSP-S 2022] 假期计划 解题笔记
  • 2025年塑料托盘厂家推荐排行榜,网格川字/九脚/田字/双面塑料托盘,平板/吹塑/注塑/焊接/印刷/组装款/高矮脚/反川字/立体库托盘公司精选!
  • 物理感知 RTL 合成
  • 20243866牛蕴韬类和对象作业
  • 简单学习Typora
  • 2025年冷却塔厂家推荐排行榜,闭式/方形/工业/全钢/凉水/圆形/玻璃钢/防腐冷却塔公司推荐!
  • 在线p图(PhotoShop网页版)加滤镜,3步搞定唯美照片
  • 2025年变位机厂家推荐排行榜,焊接变位机,双轴变位机,高精度智能变位机公司推荐!
  • stable-virtio
  • 24_envoy_配置静态资源路由
  • Halcon基础——频域图像处理
  • GapBuffer高效标记管理算法
  • AT_toyota2023spring_final_g Git Gud
  • 实用指南:85-dify案例分享-不用等 OpenAI 邀请,Dify+Sora2工作流实测:写实动漫视频随手做,插件+教程全送
  • 2025年中医师承与确有专长培训机构推荐榜单:权威认证,传承经典,专业师资助力中医梦想!
  • 从数学概念到图像识别,再到 CNN 的联系