微信公众号:lmlweb
一个分享前端技术、面试问题的小小公众号,你的关注都可以让号主开心一整天,嘻嘻;
如果你觉得写的文章对你有帮助,欢迎关注我的简书号和微信公众号[1]
文章概述
这篇文章介绍jsdoc的概念以及它的应用场景,就是学习它到底香不香,当然香不香还是得看个人,看自己的需求。
内容目录
JSDoc是什么?
Jsdoc的应用场景
Jsdoc应用场景的简单实例
相关学习资料
关注我
JSDoc是什么?
JSDoc
是一个根据javascript
文件中注释信息,生成JavaScript
应用程序或库、模块的API
文档 的工具。你可以使用他记录如:命名空间
,类
,方法
,方法参数
等。类似JavaDoc
和PHPDoc
。现在很多编辑器或IDE中还可以通过JSDoc
直接或使用插件生成智能提示。从而使开发者很容易了解整个类和其中的属性和方法,并且快速知道如何使用,从而提高开发效率,降低维护成本。
Jsdoc的应用场景
通过上面对Jsdoc的介绍就可以大概看出它的应用场景了,如下,是我自己简单的归纳
- 生成开发
js
或ts
(尤其是)项目的接口文档 - 通过Jsdoc优化你的前端编辑器的代码提示功能
Jsdoc应用场景的简单实例
-
使用Jsdoc生成接口文档
写一个demo,如下:
/***Book类,代表一个书本. *@constructor *@param {string} title - 书本的标题. *@param {string} author - 书本的作者.**/ function Book(title, author) { this.title=title; this.author=author; } Book.prototype={ /** * 获取书本的标题 * @returns {string|*} */ getTitle:function(){ return this.title; }, /** * 设置书本的页数 * @param pageNum {number} 页数 */ setPageNum:function(pageNum){ this.pageNum=pageNum; } };
使用Jsdoc工具生成的接口文档如下:
text<figcaption style="line-height: inherit; margin: 0px; padding: 0px; margin-top: 10px; text-align: center; color: rgb(153, 153, 153); font-size: 0.7em;">text</figcaption>
2.vscode配合Jsoc优化代码提示
Jsdoc注释代码
export class CommonUtilsWX {
/**
* 发送网络请求,通信协议必须是http或https,数据协议必须是json
* @param {object} o 请求参数对象
* @param {string} o.host 请求url的域名,如http://xxx.xxx.com
* @param {string} o.path 请求url的路径,如xxx/xxx
* @param {object} o.query 请求url的查询段,根据对象中key,value拼成key1=value1&key2=value2的形式
* @param {string} o.method 请求方法,如GET,POST等
* @param {object} o.body 请求数据体,仅在method为POST时有效
* @param {function(Error):void} callback 请求回调,请求成功时error为空 */
request(o, callback){ //TODO:xxxxx }}
实现效果
text相关学习资料
关于文档中文手册可以自己去找,这里分享两篇Jsdoc入门使用文章
下一篇文章会介绍vscdoe如何配置智能提示,感兴趣的小伙伴可以点个关注。
关注我
如果你觉得这篇文章对你有帮助的话,不妨小小关注或者是点赞一下,你的关注是我继续写文章的巨大动力,阿里嘎多!
网友评论