在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 声明来解决。

相关推荐
雪芽蓝域zzs3 分钟前
第二十七节:进阶:路由权限控制 + 404 / 401 全局异常页面开发
前端·javascript·html
风骏时光牛马3 分钟前
稳定性治理与疑难问题深度分析实践
前端
光影少年13 分钟前
react navite 简单原生方法双向调用示例
javascript·react native·react.js
zzzzzz31015 分钟前
react-bits:把“酷炫组件”放回 React 组件化的语境里看
javascript·react.js·动效
梦曦i9 小时前
@meng-xi/create-uni-app vs unibest:轻量脚手架与重型框架的定位之争
前端·uni-app
平头哥技术团队9 小时前
Day 10 | 工欲善其事:VS Code 配置与项目归档
android·开发语言·前端·javascript·html·交互
乌恩大侠10 小时前
GH200 新增 NVMe SSD 分区、格式化与挂载完整流程
运维·服务器·前端
yume_sibai10 小时前
Element Plus 数据展示组件完全指南(15个核心组件)
前端·javascript·vue.js
qiuhaipeng110 小时前
Claude code 升级后上下文长度变短问题
java·前端·数据库
zzz_236810 小时前
个人 AI 记忆如何跨工具复用:用 Markdown、索引和 Skill 搭一个可治理的记忆库
前端·人工智能·react.js·前端框架·agent·agent测评