JS注释也是有规范的、好的注释可以达到事半功倍的效果、注释写得好同事找的少、为什么要写注释、在一个团队开发中良好的注释会在使用方法的时候有良好的提示、包括入参和方法的描述和示例都会被编辑器提醒出来、这样很多时候是不需要去进行方法的沟通的、直接看注释就清楚！

Vscode

开打Vscode、选择User Snippets(用户代码块）、输入：javaScript.json 选择回车

  1. {
  2.   "HEADER": {
  3.     "prefix": "fdoc", //输入的关键字
  4.     "body": [
  5.       "/**",
  6.       "* @overview:", //方法描述
  7.       "* @author gf", // 作者
  8.       "* @param {} ", // 参数 { type } paramName
  9.       "* @return {}", // 返回的类型 { type }
  10.       "* @example",   // 示例
  11.       "*/"
  12.     ]
  13.   }
  14. }

WebStorm

打开Webstorm、选择file -> settings -> Editor -> Live Templates 然后选择JavaScript、点击右侧的加号 选择 Live Template ! 底部就会出现添加模板信息、Avreviation部分填写 fdoc 、Description填写快捷的描述、然后Template text: 粘贴你的模板信息、最后选择No applicable contenxts 下方的define 勾选 JavaScript and Typescript 然后应用上去、在js文件里面输入fdoc 回车就会插入你定义的模板信息！

  1. /**
  2. * @overview 
  3. * @author gf
  4. * @param {  }  
  5. * @return { object }
  6. * @example 
  7. */

image.png

上方是我的常用注释模板、当然也有其他的标记符、我贴到下方

其他注释标记

@api: 提供给第三方使用的接口
@author: 标明作者
@param: 参数
@return: 返回值
@todo: 待办
@version: 版本号
@inheritdoc: 文档继承
@property: 类属性
@property-read: 只读属性
@property-write: 只写属性
@const: 常量
@deprecated: 过期方法
@example: 示例
@final: 标识类是终态, 禁止派生
@global: 指明引用的全局变量
@static: 标识类、方法、属性是静态的
@ignore: 忽略
@internal: 限内部使用
@license: 协议
@link: 链接,引用文档等
@see: 与 link 类似, 可以访问内部方法或类
@method: 方法
@package: 命名空间
@since: 从指定版本开始的变动
@throws: 抛出异常
@uses: 使用
@var: 变量
@copyright: 版权声明

总结

这样通过函数注释块、我们就能很好的描述这个函数是做什么的、当团队其他人拿到这个方法只需要鼠标放到方法名上方就能显示出你给函数添加的描述、大大减少沟通成本！