讲师中心 微信公众号
AI工具推荐 视频效率加速

如何利用VSCode快捷键一键生成函数JSDoc注释?规范代码说明实践

梦萱君_5477

梦萱君_5477

发布时间:2026-07-20 11:32:24

|

433人浏览过

|

来源于php中文网

原创

<p>VSCode 中 JSDoc 自动生成需满足条件:文件为 .js/.ts 且语言模式正确,光标置于函数声明行开头,支持 /** + Enter 触发;箭头函数、解构参数等场景解析受限;推荐用 jsdoc-snippets 插件统一模板,TS 项目应以类型系统为准,JSDoc 仅作说明性补充。</p>

如何利用vscode快捷键一键生成函数jsdoc注释?规范代码说明实践

VSCode 里按 Ctrl+Shift+P 打不开 JSDoc 注释生成?先检查插件和语言模式

默认 VSCode 不自带 JSDoc 自动生成功能,必须依赖插件或内置支持。最常用的是 Document This(已停更)或更现代的 ES7+ React/Redux/React-Native snippets —— 但后者只对函数声明片段生效,不自动补全 JSDoc。真正稳定可用的是 VSCode 自带的 JavaScript (ES6) Language Features,它在 JS/TS 文件中支持 /** + Enter 触发智能生成。

常见卡点:

  • 当前文件后缀不是 .js 或 .ts,或语言模式没设对(右下角显示 Plain Text 而非 JavaScript)
  • 光标没放在函数名正上方、或没紧贴函数声明行开头(如缩进后敲 /** 可能失效)
  • 用了箭头函数且无函数名(const fn = () => {}),VSCode 默认不生成;需改用 function 声明或手动触发

/** + Enter 为什么只生成空块,没参数和返回值?

VSCode 的自动 JSDoc 行为高度依赖 AST 解析能力。它能提取形参名、返回类型(TS 环境下更准),但对复杂场景有明显限制:

  • 函数体为空或只含 return 字面量时,可能漏推导 @returns
  • 参数含解构(如 ({ a, b }) => {})或默认值((x = 1) => {}),VSCode 通常只写 @param {any} x,不解析默认值含义
  • TS 中若参数类型未显式标注(如 function f(x)),会标成 @param {any} x,而非从上下文推断
  • 异步函数(async function)会自动加 @returns {Promise},但不会展开泛型(如 Promise<string></string> 需手动补)

想统一规范 JSDoc 格式?用 jsdoc-snippets 插件定制模板

VSCode 内置生成器格式固定,无法加作者、日期、版本等字段。要强制团队风格一致,推荐安装轻量插件 jsdoc-snippets(注意不是同名旧版)。启用后,在函数上方输入 jsdoc + Tab 即可插入预设模板。

关键配置项(在 settings.json 中):

Aria2 Json Rpc
Aria2 Json Rpc

通过 JSON‑RPC 2.0 与 aria2 下载管理器交互,使用自然语言命令管理下载、查询状态并控制任务。适用于 aria2、下载管理或种子操作。

下载
  • "jsdoc.snippets.author": "Your Name" —— 自动填作者
  • "jsdoc.snippets.includeDescription": true —— 强制留出描述空行
  • "jsdoc.snippets.perferredLanguage": "zh-CN" —— 中文注释字段名(如 @描述)
  • 自定义模板路径通过 "jsdoc.snippets.customTemplatePath" 指向本地 .jsdoc 文件

示例生成效果(光标在 function getData(id) 上方):

/**
 * @description 
 * @author Your Name
 * @date 2024-05-20
 * @param {string} id - 
 * @returns {Promise<any>}
 */

TS 项目里 JSDoc 和类型定义重复?优先信 @type 还是接口?

在 TS 中混用 JSDoc 和类型系统容易引发维护冲突。比如函数参数用 @param {User} user,但实际调用处传了结构不符的对象——TS 编译器不会校验 JSDoc 类型,只认 interface User 或类型注解。

真实协作中建议:

  • 纯 JS 项目:JSDoc 是唯一类型文档,务必保持 @param/@returns 与运行时一致
  • TS 项目:JSDoc 仅用于说明性内容(用途、副作用、业务约束),删掉所有 @param {xxx} 类型声明,让 TS 自己推导
  • 若需兼容 JS 用户,可用 @typedef + @type 定义复杂类型,但必须和 interface 同步更新,否则极易过期
  • VSCode 对 @type 的提示支持有限,比如 /** @type {import('./types').Config} */ 可能不触发跳转

JSDoc 本质是人读的文档,不是机器契约。生成快捷键省时间,但字段是否准确、描述是否清晰,还得靠人盯住函数逻辑本身。

热门AI工具

更多
超级简历WonderCV

一款AI办公效率工具,主要用于免费求职简历模版下载制作,应届生职场人必备简历制作神器,适合需要提升相关任务效率的用户。

切问学术

切问学术是一款AI论文写作工具,复旦大学NLP团队推出的AI学术智能体。

WorkBuddy

一款AI办公效率工具,主要用于腾讯云推出的AI原生桌面智能体工作台,适合需要提升相关任务效率的用户。

Loomy
Loomy Hot

一款AI工具,主要用于科大讯飞发布的桌面级 AI 助理,比 OpenClaw 更易用、更安全!,适合需要提升相关任务效率的用户。

UP简历
UP简历 Hot

一款AI办公效率工具,主要用于基于AI技术的免费在线简历制作工具,适合需要提升相关任务效率的用户。

火山引擎

火山引擎是一款面向企业的云计算与AI服务平台。

二狗PPT
二狗PPT Hot

一款AI演示文稿工具,主要用于专为中式职场打造的AI PPT生成工具,适合需要提升相关任务效率的用户。

豆包大模型

豆包大模型是一款由字节跳动推出的企业级大语言模型服务平台。

DeepSeek

DeepSeek是一款面向对话、写作、编程和推理场景的AI大模型工具。

相关专题

更多
js正则表达式
js正则表达式

php中文网为大家提供各种js正则表达式语法大全以及各种js正则表达式使用的方法,还有更多js正则表达式的相关文章、相关下载、相关课程,供大家免费下载体验。

3896

2023.06.20

js获取当前时间
js获取当前时间

JS全称JavaScript,是一种具有函数优先的轻量级,解释型或即时编译型的编程语言;它是一种属于网络的高级脚本语言,主要用于Web,常用来为网页添加各式各样的动态功能。js怎么获取当前时间呢?php中文网给大家带来了相关的教程以及文章,欢迎大家前来学习阅读。

1235

2023.07.28

js 字符串转数组
js 字符串转数组

js字符串转数组的方法:1、使用“split()”方法;2、使用“Array.from()”方法;3、使用for循环遍历;4、使用“Array.split()”方法。本专题为大家提供js字符串转数组的相关的文章、下载、课程内容,供大家免费下载体验。

1578

2023.08.03

js是什么意思
js是什么意思

JS是JavaScript的缩写,它是一种广泛应用于网页开发的脚本语言。JavaScript是一种解释性的、基于对象和事件驱动的编程语言,通常用于为网页增加交互性和动态性。它可以在网页上实现复杂的功能和效果,如表单验证、页面元素操作、动画效果、数据交互等。

9363

2023.08.17

js删除节点的方法
js删除节点的方法

js删除节点的方法有:1、removeChild()方法,用于从父节点中移除指定的子节点,它需要两个参数,第一个参数是要删除的子节点,第二个参数是父节点;2、parentNode.removeChild()方法,可以直接通过父节点调用来删除子节点;3、remove()方法,可以直接删除节点,而无需指定父节点;4、innerHTML属性,用于删除节点的内容。

860

2023.09.01

js截取字符串的方法
js截取字符串的方法

js截取字符串的方法有substring()方法、substr()方法、slice()方法、split()方法和slice()方法。本专题为大家提供字符串相关的文章、下载、课程内容,供大家免费下载体验。

2324

2023.09.04

Js中concat和push的区别
Js中concat和push的区别

Js中concat和push的区别:1、concat用于将两个或多个数组合并成一个新数组,并返回这个新数组,而push用于向数组的末尾添加一个或多个元素,并返回修改后的数组的新长度;2、concat不会修改原始数组,是创建新的数组,而push会修改原数组,将新元素添加到原数组的末尾等等。本专题为大家提供concat和push相关的文章、下载、课程内容,供大家免费下载体验。

1449

2023.09.14

js截取字符串的方法介绍
js截取字符串的方法介绍

JavaScript字符串截取方法,包括substring、slice、substr、charAt和split方法。这些方法可以根据具体需求,灵活地截取字符串的不同部分。在实际开发中,根据具体情况选择合适的方法进行字符串截取,能够提高代码的效率和可读性 。

3909

2023.09.21

LLVM自定义Pass怎么写
LLVM自定义Pass怎么写

本专题聚焦LLVM自定义Pass开发,整理Pass类结构、run()方法、PreservedAnalyses、CMake构建、插件注册、-load-pass-plugin加载和测试用例编写流程。

0

2026.09.30

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn