#独家
react18和vue3源码中存在大量function函数和箭头函数的混用,除了this指向等众所周知的原因,箭头和function的深层区别到底是什么?

2023-08-12 0 3,145

它俩的简单区别大家都很清楚,this指向、能否使用arguments参数,是否有原型、是否支持yield等。但看了vue3和react18源码,还是存在很多地方使用function,另一些地方却使用箭头函数定义函数的情况,而且这些箭头函数的实现里显然不是为了this指向,function的实现里也显示不是为了当作构造函数或做函数提升,很多function都可以直接用箭头函数定义,但源码里没有那么做,那么到底在架构中,如何决定使用哪种方式定义函数呢?除了那些简单的区别,到底存在什么深层的考量,才使得这些框架源码中除了使用箭头函数,还大量使用了function定义函数

可以看看这篇文章:ES6 – 箭头函数、箭头函数与普通函数的区别
this指向:箭头函数的this指向是固定的,不会随着函数的上下文环境的变化而变化。而函数的this指向会随着函数的上下文环境的变化而变化。
arguments参数:箭头函数没有arguments参数。而函数有arguments参数。
原型:箭头函数没有原型。而函数有原型。
yield:箭头函数不支持yield语句。而函数支持yield语句。

除了这些本质的区别更多的是 function性能的考量,function可读性,好维护,还有就是团队协作,每个人的代码习惯有关

没有完整看过React和Vue的源码,猜测是因为多人协作的原因,尽管会有各种Lint和规则限制,但是还是在贡献的代码中不可避免的携带自己编码习惯。就比如说你提到的箭头函数和普通匿名函数。

然后就是 React19 正在重构,删除了大量代码。可能重构之后的版本有很多功能的风格应该会比较统一。但是后面继续迭代肯定依旧会出现这种情况的。

收藏 (0) 打赏

感谢您的支持,我会继续努力的!

打开微信/支付宝扫一扫,即可进行扫码打赏哦,分享从这里开始,精彩与您同在
点赞 (0)

1. 有软官网所有资源来源于开发团队,加入会员即可下载使用!如有问题请联系右下角在线客服!
2. 有软官方保障所有软件都通过人工亲测,为每位会员用户提供安全可靠的应用软件、游戏资源下载及程序开发服务。
3. 有软团队针对会员诉求,历经多年拥有现今开发成果, 每款应用程序上线前都经过人工测试无误后提供安装使用,只为会员提供安全原创的应用。
4. PC/移动端应用下载后如遇安装使用问题请联系右下角在线客服或提交工单,一对一指导解决疑难。

有软官网_用软件,找有软 技术分享 react18和vue3源码中存在大量function函数和箭头函数的混用,除了this指向等众所周知的原因,箭头和function的深层区别到底是什么? https://www.jiaruvip.com/2511.html

有软应用商店是经过官方安全认证,保障正版软件平台

相关资源

官方客服团队

为您解决烦忧 - 24小时在线 专业服务