TypeScript 是 Web 开发的未来吗?
优势
缺点
那么未来会怎样?
结论
我在之前的文章中已经多次提到过我有多喜欢TypeScript 。它让我的工作效率更高,但最重要的是——它改善了我的开发体验。
根据近期的趋势、TypeScript NPM下载统计数据以及围绕它的普遍讨论,我认为很多人都同意我的观点。但这并不意味着所有人都同意,正如众多 TypeScript 批评者所表明的那样。因此,我认为考虑所有关于 TypeScript 的不同观点至关重要,以便判断这个目前颇为成功的 JavaScript 超集未来会走向何方。
优势
因此,为了确定任何产品的未来发展方向,我们首先需要了解它的优点和缺点,以了解它能为最终用户提供什么样的价值。
就 TypeScript 而言,我想如果你正在阅读这篇文章,那么你可能已经听说过它的大部分优点,所以我将简要介绍一下。
运行时错误较少
与动态 JavaScript相比, TypeScript 的静态类型特性被认为可以减少运行时错误。诸如拼写错误、数据不一致等常见问题都可以在编译阶段被 TypeScript 轻松捕获。
更好的开发经验
此外,得益于静态类型,TypeScript 可以被现代代码编辑器和 IDE(如VS Code)使用,从而为开发者提供近乎实时的反馈、自动完成和错误高亮显示。
更好的代码质量和文档
因为正确(即严格)配置的 TypeScript 会强制你为所有函数、类和其他结构添加正确的类型定义,所以它几乎会自动提升代码质量和文档质量。当然,它不可能让最糟糕的代码库起死回生,但如果配合合理的命名策略,TypeScript 在这方面仍然比纯粹的 JavaScript 表现更好。
我说过我会长话短说。 ;)
缺点
所以,虽然 TypeScript 的优点众所周知,但它的缺点以及你可能不想使用它的所有原因却鲜为人知。因此,我想花点时间讨论一些比较“流行”(或者应该说是“普遍认为”)的缺点以及与之相关的可能矛盾之处。
它不符合 JavaScript 的动态特性。
由于 TypeScript 的一些基本特性,例如静态类型和编译,有人认为它与 JavaScript 的动态特性不符。JavaScript 主要是一种 Web 语言,在 Web 环境中,没有什么是静态的,变化无处不在,数据也来自多个来源。TypeScript 不适合这样的环境……对吗?
这种说法有一定道理,但这有点像说任何静态类型或编译型语言都不适合处理“动态内容”。这显然是不对的。诚然,这需要多花一些功夫,但你可以很轻松地创建合适的接口和其他类型结构来处理代码库中的所有动态数据。如果你不愿意这样做,那么你可以利用any类型和“回退”机制,使用几乎完全是 JavaScript 的东西,同时在其他地方使用 TypeScript 的特性。
TypeScript 通常被误用
所以,TypeScript 及其any类型对于任何动态代码来说都完全够用,但这又引出了另一个问题。类型any本身虽然在很多情况下确实很有用,但如果使用不当,就会迅速且肆意地传播。结果就是,TypeScript 的几乎所有优势都被抵消了。既然没有充分利用 TypeScript 的潜力,那为什么还要使用它呢?
关于 TypeScript 经常被误用的说法确实很有道理。尤其是在从 JavaScript 转过来的 TypeScript 新手,或者在将 JavaScript 代码库迁移到 TypeScript 的过程中,any类型的使用常常会失控。然而,仅仅因为一些开发者没有正确使用 TypeScript,并不意味着我们就不应该使用或向他人推荐这门语言。TypeScript 的any类型是一个非常强大的特性——它可以节省时间,帮助代码库从 JavaScript 迁移等等,但前提是必须正确使用。
TypeScript 重写是浪费时间
说到代码库重写,你很可能听说过以下这些故事:
X 公司将其代码库迁移到 TypeScript,在部署前多发现 Y% 的错误,同时效率提高 Z%。
这些情况很常见,但众所周知,任何形式的重写都能提升开发体验并最大限度地减少错误。那么,为什么要费这个劲呢?
将 JS 代码库转换为 TypeScript 所需的时间和资源,以及让整个团队熟悉新工具的过程,确实可能超过其潜在收益。尤其是在处理大型代码库时,TypeScript 重写甚至会导致速度下降和不必要的混乱——特别是当已经拥有顶级、经过充分测试且文档齐全的 JS 代码时。
话虽如此,TypeScript 重写并非毫无好处。只是这些好处更多地体现在……长远层面。在最初花费一些精力重写所有内容并添加正确的类型定义之后,您可以期待在未来获得更好、更快捷的开发体验。
使用 JSDoc 也能达到同样的效果。
对我来说,使用 TypeScript 的最大动力无疑是它与合适的编码软件配合使用时所带来的卓越开发体验。但事实上,这并非 TypeScript 独有的特性。一种名为JSDoc 的知名文档格式也能提供同样的优势(有时甚至更多),而且无需更改文件扩展名,也无需用自定义的 TypeScript 结构“污染”你的 JavaScript 代码。只需使用传统的 JavaScript 注释即可。
如果你还没看过,这里有一个小例子:
/**
* Example function description.
* @param {number} param1 - Number parameter description.
* @param {string} param2 - String parameter description.
* @returns {boolean} - Description of the returned boolean value.
*/
const exampleFunction = (param1, param2) => {
// ...
}
所以,基本上就是用特殊标记的多行注释,还有一些@tags用于其他用途。就这么简单,有了它,我们就已经正确地为函数添加了类型信息!听起来好得难以置信,对吧?那问题出在哪里呢?
结果发现几乎没有。JSDoc 真的很棒。它可以轻松提供与 TypeScript 类似的开发体验,可以逐步采用而无需任何妥协,还可以用来进一步描述你的代码,甚至可以从中生成专门的文档!
但 TypeScript 还有一些隐藏的技巧。请看下面 TypeScript 接口和变量类型声明与 JSDoc 的对比。
/** Description */
interface Example {
/** Description */
prop1: number;
/** Description */
prop2: number;
}
/**
* @typedef {object} SecondExample - Description
* @property {number} prop1 - Description
* @property {number} prop2 - Description
*/
/**
* @typedef {{prop1: number, prop2: number}} ThirdExample - Description
*/
const exampleVariable: Example = { prop1: 1, prop2: 2 }
/** @type {SecondExample} */
const secondExampleVariable = { prop1: 1, prop2: 2 }
/** @type {ThirdExample} */
const thirdExampleVariable = {prop1: 1, prop2: 2}
我想你已经明白我的意思了。TypeScript 的“语法糖”虽然未必比 JSDoc 更强大,但它在定义复杂类型和接口方面无疑更加简洁明了。此外,JSDoc仍然可以与 TypeScript 结合使用,更好地描述你的代码,而类型则可以通过另一种方式处理,或者在从 JS 代码库过渡到 TS 代码库的过渡期间,无需依赖任何any类型。
最后,虽然您也可以借助tsconfig.jsonJSDoc 配置 JS 文件进行类型检查,但将其设置为严格模式(TypeScript 最为人熟知的模式)可能会产生官方文档中描述为“令人惊讶”的结果(即效果不佳)。
那么未来会怎样?
考虑到 TypeScript 的这些优缺点,我想我们现在可以预见它的发展方向了。说实话,你可能已经听过好几次了——TypeScript 不会很快取代 JavaScript。就我个人而言,我甚至认为它永远也取代不了JavaScript——它最初的设计目的就不是为了取代 JavaScript。
TypeScript 以 JavaScript 为坚实基础。它旨在提升开发体验和代码质量,仅此而已。它的设计初衷如此,也应该保持这种模式。因为实际上,你如何想象浏览器原生支持 TypeScript 呢?虽然额外的类型信息及其相关的潜在优化可能会加快执行速度,但也会显著增加包的大小,从而减慢代码的下载和执行过程,抵消任何潜在的性能优势。如果将其编译成某种自定义的、高度优化的格式,那么我们将丢失类型信息any——毕竟,类型是 TypeScript 的基本特性之一——最终可能只会得到另一个WebAssembly(或者应该说是AssemblyScript)。
总而言之,我认为TypeScript在可预见的未来会继续流行。它提供了出色的开发体验,竞争并不激烈,并且在(尤其是新兴的)开源项目中拥有很高的采用率。
结论
以上就是我的看法。不过话说回来,我这个人就算为了这些在某些情况下微不足道的优势,也愿意用 TypeScript 重写整个库。你对 TypeScript 有什么看法?你在用它吗?为什么用/不用?你还看到了我没有提到的其他优缺点吗?欢迎在下方评论区留言!
想了解更多最新的 TypeScript 和 Web 开发资讯,请在Twitter和Facebook上关注我,也欢迎访问我的个人博客。感谢阅读,祝您 TypeScript 编程愉快! ;)
文章来源:https://dev.to/areknawo/is-typescript-the-future-of-web-development-3jl