在Vue3中推荐使用的函数定义方法

const funcName = (argName) => {}; 和 function funcName(argName) {} 这两种方式,哪种定义函数比较好一点呢?

两种方式各有适用场景,简单总结:

箭头函数 const fn = () => {}

没有自己的 this,继承外层作用域的 this

不会被提升(hoisting),必须先定义后使用

语法简洁,适合回调和短函数

不能用作构造函数(new)

函数声明 function fn() {}

有自己的 this 绑定

会被提升,可以在定义之前调用

可以用作构造函数

在你当前项目(Vue 3 <script setup>)中,用箭头函数 const fn = () => {} 更好,原因:

<script setup> 本身就是一个模块作用域,不需要 this

Vue 3 Composition API 风格统一用 const + 箭头函数是社区惯例

const 防止函数被意外重新赋值

你现有代码已经全部是这种风格,保持一致即可

唯一需要注意的:箭头函数不会提升,所以如果两个函数互相调用,需要注意定义顺序。如果遇到这种情况,可以用 function 声明来解决。

相关推荐
MemoriKu6 小时前
Flutter 相册 APP 视频模态稳定化实战:从视频抽帧、Embedding 元数据到 Android 真机启动修复
android·开发语言·前端·flutter·架构·音视频·embedding
触底反弹6 小时前
深入理解 JavaScript 同步与异步:从 Event Loop 到 async/await
javascript
lichenyang4536 小时前
ArkUI 票根卡片:PathShape 真挖洞,shadow 沿凹陷外发光
前端
Cache技术分享6 小时前
432. Java 日期时间 API - 时间工具 TemporalQuery 详解
前端·后端
浮生望6 小时前
JavaScript 异步编程核心:从同步阻塞到 Promise 事件循环
javascript·promise
如果超人不会飞6 小时前
TinyVue Radio单选框组件使用指南
vue.js
假如让我当三天老蒯6 小时前
暂时性死区是否和闭包是相背的呢(自学用)
前端·javascript
渣波6 小时前
前端开发主页面小技巧
前端·javascript
小林ixn6 小时前
前端必知:JS同步异步与Promise,终于有人讲明白了!
javascript·面试
柯克七七6 小时前
我用3个周末重构了公司的前端项目,老板没发现,但同事都来找我要代码了
前端