当前位置:首页 > 科技  > 软件

前端开发何必执着于Typescript?Jsdoc一样很好用

来源: 责编: 时间:2023-08-09 23:02:18 436观看
导读为什么很多公司执着于typescript?因为typescript支持很多JS不支持的特性,正确的使用typescript,可以使你的代码更易于维护。最主要的是可以给JS添加类型,使编辑器的提示更智能。但是,typescript是很复杂的一门语言,很多开发

fcB28资讯网——每日最新资讯28at.com

为什么很多公司执着于typescript?因为typescript支持很多JS不支持的特性,正确的使用typescript,可以使你的代码更易于维护。fcB28资讯网——每日最新资讯28at.com

最主要的是可以给JS添加类型,使编辑器的提示更智能。fcB28资讯网——每日最新资讯28at.com

但是,typescript是很复杂的一门语言,很多开发者并不能很好的运用typescript,甚至很多人是被迫的,他们内心是反感使用typescript的,导致代码写的乱七八糟。fcB28资讯网——每日最新资讯28at.com

事实上,JS也有很多优势是typescript所不具备的,比如:JS的灵活性很高。fcB28资讯网——每日最新资讯28at.com

如果我告诉你,有一种工具,完全可以像写typescript一样写JS,你会用吗?fcB28资讯网——每日最新资讯28at.com

我说的这个工具就是jsdoc,我们可以叫它JS文档注释。它的目的也是为JS添加类型的,只是以注释的形式添加的,它有固定的语法。fcB28资讯网——每日最新资讯28at.com

我就以项目中的代码来举例吧,大家看如下文档注释。其中,@template 用于声明泛型类型,@typedef 用于定义一个类型。fcB28资讯网——每日最新资讯28at.com

在这里,我们定义了一个泛型T和一个名叫TreeNode的类型。TreeNode包含2个确定的字段:id和children,剩下的字段由泛型T确定。fcB28资讯网——每日最新资讯28at.com

/** * @template T * @typedef {T & {id: number, children: TreeNode<T>[]}} TreeNode */

下面,我们来测试一下这个类型。fcB28资讯网——每日最新资讯28at.com

如下图,我们声明一个变量node,使用@type指定为TreeNode类型,尖括号中间的对象类型替代了我们定义中的泛型T。fcB28资讯网——每日最新资讯28at.com

当我们键入点号后,编辑器给出了非常智能的提示。大家说,是不是很酷?fcB28资讯网——每日最新资讯28at.com

fcB28资讯网——每日最新资讯28at.com

这是真实项目中的代码,一个生成ID的函数。fcB28资讯网——每日最新资讯28at.com

使用@param可以为函数参数指定类型,在这里,我们为tree指定了TreeNode数组类型。使用@returns可以指定函数返回值的类型。fcB28资讯网——每日最新资讯28at.com

/** * @param {TreeNode<{}>[]} tree * @returns {number} */export const genId = tree => {  return (function eachFn (data) {    return data.reduce((t, item) => {      return Math.max(        t,        item.id || 0,        item.children ? eachFn(item.children) : 0      )    }, 0)  })(tree) + 1}

如下图,由于我们给tree指定了类型,当键入点号后,编辑器知道data是数组类型,正确地给出了数组的成员提示。这使我们在键入时,不易出错。fcB28资讯网——每日最新资讯28at.com

fcB28资讯网——每日最新资讯28at.com

当我们鼠标指针移入函数名时,编辑器给出了该函数的提示。告诉我们,该函数接收一个TreeNode数组参数tree,返回数值类型结果。fcB28资讯网——每日最新资讯28at.com

fcB28资讯网——每日最新资讯28at.com

现在,大家觉得jsdoc怎么样?是不是很好用?酷不酷?fcB28资讯网——每日最新资讯28at.com

如果大家开发用的语言是JS,我建议大家学学jsdoc。jsdoc的用法远比本文介绍的要多,它很强大,但语法却很简单易学。fcB28资讯网——每日最新资讯28at.com

本文链接:http://www.28at.com/showinfo-26-5116-0.html前端开发何必执着于Typescript?Jsdoc一样很好用

声明:本网页内容旨在传播知识,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。邮件:2376512515@qq.com

上一篇: Rust采用率不断提高,2022年度Rust调查报告出炉!

下一篇: Go1.21 那些事:泛型库、for 语义变更、统一 log/slog、WASI 等新特性,你知道多少?

标签:
  • 热门焦点
  • K60至尊版刚预热 一加Ace2 Pro正面硬刚

    Redmi这边刚如火如荼的宣传了K60 Ultra的各种技术和硬件配置,作为竞品的一加也坐不住了。一加中国区总裁李杰发布了两条微博,表示在自家的一加Ace2上早就已经采用了和PixelWo
  • 跑分安卓第一!Redmi K60至尊版8月发布!卢伟冰:目标年度性能之王

    8月5日消息,Redmi K60至尊版将于8月发布,在此前举行的战略发布会上,官方该机将搭载搭载天玑9200+处理器,安兔兔V10跑分超177万分,是目前安卓阵营最高的分数
  • 企业采用CRM系统的11个好处

    客户关系管理(CRM)软件可以为企业提供很多的好处,从客户保留到提高生产力。  CRM软件用于企业收集客户互动,以改善客户体验和满意度。  CRM软件市场规模如今超过580
  • 一篇文章带你了解 CSS 属性选择器

    属性选择器对带有指定属性的 HTML 元素设置样式。可以为拥有指定属性的 HTML 元素设置样式,而不仅限于 class 和 id 属性。一、了解属性选择器CSS属性选择器提供了一种简单而
  • 为什么你不应该使用Div作为可点击元素

    按钮是为任何网络应用程序提供交互性的最常见方式。但我们经常倾向于使用其他HTML元素,如 div span 等作为 clickable 元素。但通过这样做,我们错过了许多内置浏览器的功能。
  • 花7万退货退款无门:谁在纵容淘宝珠宝商家造假?

    来源:极点商业作者:杨铭在淘宝购买珠宝玉石后,因为保证金不够赔付,店铺关闭,退货退款难、维权无门的比比皆是。&ldquo;提供相关产品鉴定证书,支持全国复检,可以30天无理由退换货。&
  • 华为开发者大会2023日程公开:开设鸿蒙HarmonyOS 4体验区

    IT之家 7 月 31 日消息,华为今日公布了 HDC.Together 开发者大会 2023 的详细日程。整场大会将于 8 月 4 日-6 日之间举行,届时将发布最新一代鸿蒙 H
  • 2纳米决战2025

    集微网报道 从三强争霸到四雄逐鹿,2nm的厮杀声已然隐约传来。无论是老牌劲旅台积电、三星,还是誓言重回先进制程领先地位的英特尔,甚至初成立不久的新
  • 苹果MacBook Pro 2021测试:仍不支持平滑滚动

    据10月30日9to5 Mac 消息报道,苹果新的 14 英寸和 16 英寸 MacBook Pro 2021 上市后获得了不错的评价,亮点包括行业领先的性能,令人印象深刻的电池续航,精美丰
Top