还没用熟 TypeScript 社区已经开始抛弃了

news2024/12/25 9:47:02

根据 rich-harris-talks-sveltekit-and-whats-next-for-svelte 这篇文章的报道, Svelte 计划要把代码从 TS 换到 JS 了。

The team is switching the underlying code from TypeScript to JavaScript. That and the update will then allow the team to incorporate “big ideas” for Svelte 5 later this year, he added.

这种震惊劲爆的信息,当然的核实下是不是准确的,于是去 svelte 框架的作者 Rich Harris 的推特去求证下,好奇的不止我一个,已经有人提问了,并且作者给出了答案,非常确定

最新消息,非常确定了,就在昨天,北京时间 2022 年 5 月 9 日,Svelte 团队发布了一个名为 TS to JSDoc Conversion 的 PR,开始这项浩瀚的工程,同时宣布目前 Svelte 不再支持重大更新了,根据点不支持的人数,看到这件事情比较有争议,不支持的人不在少数。

TS to JSDoc Conversion

事实上,这不是社区第一次放弃 TypeScript 了,比如 Deno 远在 2020 年就弃用了 TS,并给出三大理由:

  1. 减少了构建时间
  2. 发布代码变小了
  3. 写的代码大大减少了

那个时候 TyepScript 的发展正在如日中天的时候,广大库的作者普遍拥抱 TS,比如于2020年9月18日正式发布的Vue3 ,代号为 One Piece(海贼王)。

三年过去了,再好看的媳妇也看腻了,大家就开始挑毛病了,你(TyepScript)可能并不完美。

回归了理性,大家就开始思考使用 TyepScript 的初心是什么了,意识吼出了灵魂一问?我们为什么使用 TypeScript?

没错,这个问题很简单,因为 TypeScript 提供了类型检查,弥补了 JavaScript 只有逻辑没有类型的问题,也就是讲我们不需要 TypeScript 的逻辑,只需要它的的类型提示功能。但是不知不觉之间,我们在逻辑的道路上越走越远。

比如下面是 Vue3 watch API 的类型声明,我估计给一天时间,大多数人可能都不太能整的明白里面的逻辑:

 
export declare function watch<T extends MultiWatchSources, Immediate extends Readonly<boolean> = false>(sources: [...T], cb: WatchCallback<MapSources<T, false>, MapSources<T, Immediate>>, options?: WatchOptions<Immediate>): WatchStopHandle;

export declare function watch<T extends Readonly<MultiWatchSources>, Immediate extends Readonly<boolean> = false>(source: T, cb: WatchCallback<MapSources<T, false>, MapSources<T, Immediate>>, options?: WatchOptions<Immediate>): WatchStopHandle;

export declare function watch<T, Immediate extends Readonly<boolean> = false>(source: WatchSource<T>, cb: WatchCallback<T, Immediate extends true ? T | undefined : T>, options?: WatchOptions<Immediate>): WatchStopHandle;

export declare function watch<T extends object, Immediate extends Readonly<boolean> = false>(source: T, cb: WatchCallback<T, Immediate extends true ? T | undefined : T>, options?: WatchOptions<Immediate>): WatchStopHandle;

而且如果项目引用了用 TypeScript 编写的库,需要频繁借助 VSCode 等编辑器查看源代码,才能进行类型声明继续编写逻辑代码。

以前我也是 TypeScript 的拥趸,但是使用了一两年之后,我改变了看法,平时应付业务逻辑已经够费脑子了,现在需要花不少时间去调整代码来适应需求。

除此之外,dev 开发代码进行类型检查也比较费时间,项目大了可能需要顿个几秒才能检查完成,再进行代码编译输出到浏览器。

现在明白了最初的需求,完全可以用 JavaScript + JSDoc 来解决类型声明,现代编辑器是认的 JSDoc,友好支持程度一点不比 TS 差,如果是编写库,需要导出给安装者使用,那就在 .d.ts 文件中定义导出给使用者。

使用 JSDoc 表达类型,不仅省去了构建步骤,不打包都可以直接用,还可以避免编写复杂的类型逻辑,太方便了有没有,代码可以复制到任何 JS 的运行环境心动没有。

我们来实践看看行不行的通,光说不练,假把式。

这里以 Svgo 的一个函数 removeLeadingZero 为例,这个函数可以删除小数的前导零并作为字符串返回,比如 0.5 → .5-0.5 → -.5

 

const removeLeadingZero = (num) => { let strNum = num.toString(); if (0 < num && num < 1) { strNum = strNum.slice(1); } else if (-1 < num && num < 0) { strNum = "-" + strNum.slice(2); } return strNum; };

我们添加如何注释:

 

/** * Remove floating-point numbers leading zero. * * @example * 0.5 → .5 * * @example * -0.5 → -.5 * * @type {(num: number) => string} */

非常好用:

image.png

实际上 VSCode 有智能推断,简单的代码都能推断出来,比如,const num = 23; 会自动感应出来方法:

image.png

说回来 removeLeadingZero 函数,当我们调用的时候,传入错误的参数,没有像 TS 类型强制报错:

image.png

解决办法也很简单,比如:

  1. 利用的 TS @ts-check 注释
  2. 添加 tsconf.json / jsconfig.json 并让 checkJs 为 true。
 

{ "compilerOptions": { "checkJs": true }, "exclude": ["node_modules", "**/node_modules/*"] }

  1. 添加"js/ts.implicitProjectConfig.checkJs": true到您的工作区或用户设置里面即 settings.json 文件。
  2. 更多参考 type-checking-javascript

改正后的效果:

image.png

事实上 JSDoc 的类型注释非常丰富比如还有 @param@const 等等,但不复杂,学习成本很低

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1011823.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Enhancer-轻量化的字节码增强组件包

一、问题描述 当我们的业务发展到一定阶段的时候&#xff0c;系统的复杂度往往会非常高&#xff0c;不再是一个简单的单体应用所能够承载的&#xff0c;随之而来的是系统架构的不断升级与演变。一般对于大型的To C的互联网企业来说&#xff0c;整个系统都是构建于微服务的架构…

金和OA GetSqlData.aspx 远程命令执行漏洞

一、漏洞简介 金和OA协同办公管理系统C6软件共有20多个应用模块,160多个应用子模块,涉及的企业管理业务包括协同办公管理、人力资源管理、项目管理、客户关系管理、企业目标管理、费用管理等多个业务范围,从功能型的协同办公平台上升到管理型协同管理平台,并不断的更新完善…

一款自定义软件开发平台源码 支持企业应用的专业低代码开发

低代码PaaS平台源码 采用对象方式实现字段、API的字段类型&#xff0c;引入RPA实现表自动化建模&#xff1b;再使用选择方式对地段功能进行选择定义甚至可以插入代码进行自定义。 数字化转型的迫切需求 随着数字科技的发展&#xff0c;各行各业对于新技术解决方案的需求也在逐…

小节8:Python之文件操作

1、文件在哪里&#xff1f; 如果用代码对文件进行操作&#xff0c;需要先找到那个文件 MacOS/Linux&#xff1a;斜杠/ 表示根目录&#xff0c;一切的文件、目录都存放在根目录下面。 Windows系统&#xff1a;就不一样了&#xff0c;它每一个磁盘分区都有自己的根目录&#x…

算法:二分法---寻找H指数

1、题目&#xff1a; 给你一个整数数组 citations &#xff0c;其中 citations[i] 表示研究者的第 i 篇论文被引用的次数。计算并返回该研究者的 h 指数。 根据维基百科上 h 指数的定义&#xff1a;h 代表“高引用次数” &#xff0c;一名科研人员的 h 指数 是指他&#xff0…

港联证券:基本面分析的基本知识?

作为一种股票投资剖析办法&#xff0c;根本面剖析是用来研究一家公司在剖析期内的运营状况的一种办法&#xff0c;它重视公司的财政数据、盈余才能、市场占有率以及宏观经济要素等方面&#xff0c;为投资者供给了一个深化了解公司价值的方法。下面&#xff0c;本文将从多个视点…

C语言 —— 初步入门知识(第一个C语言程序、数据类型、变量常量、字符与注释)

本篇文章介绍C语言的基础知识&#xff0c;使读者对C语言能够有一个大概的认识. 不会细写每一个知识点, 但是能够入门C语言, 进行初步的C语言代码阅读. 首先, 什么是语言? 对于人和人之间进行交流的语言, 我们知道, 可以通过汉语, 英语, 日语等语言进行交流. 那么对于人和计算…

spring_注解笔记

spring使用注解开发 文章目录 1.前提1 Bean2 属性注入3 衍生的注解4.自动装配5 作用域 1.前提 步骤1&#xff1a; 要使用注解开发&#xff0c;就必须要保证AOP包的导入 步骤2&#xff1a; xml文件添加context约束 步骤3&#xff1a; 配置注解的支持 <context:annotation-…

【python零基础入门学习】python基础篇(基础结束篇)之数据结构类型-列表,元组,字典,集合(五)

本站以分享各种运维经验和运维所需要的技能为主 《python零基础入门》&#xff1a;python零基础入门学习 《python运维脚本》&#xff1a; python运维脚本实践 《shell》&#xff1a;shell学习 《terraform》持续更新中&#xff1a;terraform_Aws学习零基础入门到最佳实战 《k8…

电商运营管理——商品活动

商品活动很大程度上决定了电商平台的用户活跃度&#xff0c;本篇文章将详细介绍商品活动的几大类目&#xff0c;并举例每一类的不同活动内容。希望本篇文章能对运营岗位的你有所帮助。 电商平台最重要的功能是运营管理&#xff0c;而运营管理中最重要的功能就是各种商品活动&am…

阿里巴巴国际数字商业24届校招大量hc,等你来拿~

阿里巴巴国际数字商业招人啦!!! 今年阿里lazada买家前端团队有大量hc, 同学们快冲啊!!! 除了前端岗,还有算法, 客户端等 图中的二维码为我的个人内推码, 直接扫码进去填写简历提交即可, 后续可以帮忙查看内推进度, 有什么疑问我会在线回复 职位要求 【必备项】 1、熟练使用各种…

程序员自由创业周记#11:商标

商标重要吗 为什么我那么重视App名字里要有一个自己的商标&#xff0c;主要防止的是被竞争对手抄袭&#xff0c;甚至连名字也起同样的&#xff0c;如果没有商标&#xff0c;很难维权&#xff0c;只能放任自由。在上上家公司&#xff0c;我们的产品起了一个与别人重复的名字&am…

MATLAB中findpeaks函数用法

目录 语法 说明 示例 在MATLAB中&#xff0c;findpeaks函数用于查找信号中的峰值&#xff08;peaks&#xff09;。以下是findpeaks函数的基本语法、说明以及示例&#xff1a; 语法 [pks,locs] findpeaks(x) [pks,locs] findpeaks(x, Name, Value)说明 参数说明 x&…

Windows 性能突然打鸡血,靠 Bug 修复了多年顽疾

要说 的 Bug 集中地&#xff0c;当属资源管理器。 速度缓慢、卡顿、崩溃&#xff0c;不同设备、不同版本的用户都有不同的感受。 严格来说&#xff0c;这其实是 Windows 的传统艺能&#xff0c;要完美修复可不容易。 而作为小老弟的文件资源管理器&#xff0c;时不时来个无响…

web技术——HTML文档基础部分(1)

文章目录 前言壹、基本语法1.1 含义1.2 注释1.3 HTML文档的标准结构 贰、基本的文本标记2.1 段落2.2 保留空白字符2.3 标题2.4 水平线 前言 HTML是一种标记语言,这意味着它用来标记文档中的各个部分&#xff0c;已指定文档在打印件或者显示器上的显示方式。简单来说&#xff0…

pycharm终端激活环境时报错

pycharm终端激活环境时报错 nvoke-Expression : 无法将参数绑定到参数“Command”&#xff0c;因为该参数为空字符串。 所在位置 E:\anaconda\anaconda\anaconda3\envs\wsbpytorch\shell\condabin\Conda.psm1:76 字符: 36 Invoke-Expression -Command $activateCommand;~~~~~~~…

获取实时时间+日期+星期

1.展示 2.代码 data() {return {newYear: "0000 年 00 月 00 日 ",newTime: "00:00:00",today: "",timer: null, //时间定时器};}, created() {this.getCurrentDate();this.timer setInterval(() > {this.getCurrentDate();}, 1000); }, met…

pve 故障记录

pve 故障记录 通过网页pve console 执行 参考网页&#xff1a; cat /etc/os-release proxmox吧 https://foxi.buduanwang.vip/pve https://www.reddit.com/r/Proxmox/comments/vy33ho/stuck_at_grub_rescue_after_an_update_and_reboot/?rdt37867 https://pve.proxmox.co…

Versus-在线全球物品可视化比较平台 万物皆可对比

Versus介绍 Versus是一个成熟的在线全球物品可视化比较平台&#xff0c;从比较手机到比较城市&#xff0c;涵盖 90 多个类别&#xff0c;可以在线比较智能手机、相机、耳机、显卡等&#xff0c;Versus 提供详细的技术规格、数据可视化和价格比较&#xff0c;是从智能手机到 PC…

使用scp命令失败出错

使用scp命令失败出错&#xff0c;无反应。 解决&#xff1a; 1.使用ifconfig查看目标主机公网IP地址 ifconfig需使用公网ip 2.配置免密登录 可参考 远程登录ssh ssh-copy-id root目标主机ip再次尝试scp命令。 SCP&#xff08;Secure Copy&#xff09;是一个用于在本地主机和…