Pressidian
花园入口
笔记
项目
关于
实验室
GitHub
花园入口
笔记
项目
关于
实验室
GitHub

KNOWLEDGE PATHS

笔记库
当前位置
笔记库/前端/项目笔记/代达罗斯/模式

void

1 分钟阅读 · Note

目录树 578 篇

            • 表单最佳实践指南
            • 双层级导航结构
            • 以schema为中心的
            • 异步三态切换
            • 用neverthrow进行错误处理
            • Anatomy
            • cn
            • LoadingState&useList的组合
            • procedure中的service位置
            • scrollbar-gutter
            • TailwindCSS
            • TanStack Router 路由模式
            • useDebounce
            • useForm
            • void
          • 项目待做
          • 性能优化
          • UI设计
      • 前端技术栈
    • 笔记目录
    • CLAUDE.md
    • Vue 组件与 Render 函数

关联笔记 6

↗表单最佳实践指南同一路径↗双层级导航结构同一路径↗以schema为中心的同一路径↗异步三态切换同一路径↗用neverthrow进行错误处理同一路径↗Anatomy同一路径
  • void

void


这里的 void 是 JavaScript 的一元运算符,作用是:

> 执行后面的表达式,但主动忽略它的返回值,整个表达式的结果固定为 undefined。

你这段代码大概率完整形式是:

const handlePublish = useCallback(() => {
  void form.handleSubmit((values) => {
    if (form.formState.isDirty) {
      persistDraft(values, publishRevision);
      return;
    }
  })();
}, [form, persistDraft, publishRevision]);

重点在最后的 ():

void form.handleSubmit(callback)();

可以拆成:

const submitHandler = form.handleSubmit(callback);
const promise = submitHandler();

void promise;

为什么加 void

React Hook Form 的 handleSubmit 返回一个提交处理函数,而执行这个函数通常会返回 Promise<void>:

const submitHandler = form.handleSubmit(callback);

submitHandler(); // 返回 Promise<void>

如果项目开启了 ESLint 的 @typescript-eslint/no-floating-promises,直接调用可能会警告:

submitHandler();
// Promise 没有被 await、return 或 catch

加上 void 是在明确告诉代码检查工具:

void submitHandler();

意思是:

> 我知道这里返回了 Promise,但我就是不等待它,也不使用它的结果。

它类似于:

submitHandler().catch((error) => {
  // 处理错误
});

但二者并不完全等价:void 不会处理 Promise 的异常,只是忽略返回值。

特别注意最后的 ()

下面两段含义完全不同:

void form.handleSubmit(callback);

这段只调用了 handleSubmit 来创建提交函数,没有真正执行表单提交。

而:

void form.handleSubmit(callback)();

最后多了一个 (),才是真正执行提交函数。

因此可以这样理解:

form.handleSubmit(callback)
// 生成提交函数

form.handleSubmit(callback)()
// 立即执行生成的提交函数

void form.handleSubmit(callback)()
// 立即执行,同时忽略其 Promise 返回值

在你的代码中,void 主要是为了处理“异步函数返回的 Promise 没有被使用”的类型检查或 ESLint 警告。