关于项目中是否使用Typescript的疑惑与解答

简介: 关于项目中是否使用Typescript的疑惑与解答

先说优点:

  1. bug 显著减少,之前会遇到的 xxx 为空的问题几乎不会出现了,类型相关 bug 直线减少。
  2. 应用更可控,当你需要约束某些代码的时候,用类型就能很简单地做到,比如 React 里强制写 displayName 方便调试。
  3. 查文档更方便,以前要打开浏览器看文档,现在直接查看定义就基本明白了。

再说缺点:

没有。哈哈。


现在只会 JS 的前端要怎么办?


不用慌,TS 的代码跟 JS 差不多,你学完 JS 后,只需要学习一下类型声明就可以掌握 TS 了。

如果你公司的项目目前只支持 JS,也没有关系,只需要加一个 ts-loader 或者 awesome-typescript-loader 就能提供 TypeScript 支持,TS 可以和 JS 共存哦。

然后你就可以逐步用 TS 代替 JS,实现完美过渡。


为什么 TypeScript 是好的?


如果你现在还没有开始学习 TS,肯定是因为对 TS 有所顾虑。去问问用了 TS 的前端感觉怎么样吧,基本没有一个说后悔的。所以这种顾虑是完全没有必要的。

那么 TS 为什么这么好呢?接下来我们从理论上解释一下。

  1. 写代码最怕什么?代码出错,也就是 bug。
  2. 如何避免 bug?运行代码看结果,或者添加各种测试。
  3. 现在前端并不流行单元测试,所以只能运行代码看结果(比如刷新页面,然后用鼠标点点点,看是否能运行成功)
  4. 但当你的前端应用非常大的时候,你不可能每次改代码之后去所有页面上点一遍,因为页面太多了。
  5. 所以前端选择模块化,让一次代码改动影响的页面尽量少。但是即使这样,你依然无法通过鼠标点击测试来运行所有代码,因为你可能还需要测试多种不同的账户。
  6. 这样做太麻烦了。有没有什么办法能让我快速知道「代码有bug没」

这是一个重要的问题:有没有什么办法能让我快速知道「代码有bug没」。


为了说明类型是如何解决这个问题的,我们先来介绍一种最简单的类型:正负数。

我们把实数分为三种类型:正数、负数和0。

然后看下面这个等式:

28937829 * -1239282 = 35862130598778

聪明的你一眼就看出这个等式不对。为什么?因为「正数」乘以「负数」必然得到「负数」。所以我们根本不用运行这个乘法,就知道这个结果不对。

这就是类型的好处。


类型能让你「大概」知道代码对不对


TS 就是在 JS 上加上类型声明,这样我们就能知道代码是否「大概」正确。

另外,这种方式速度非常快,快到你只要修改代码,TS 就能告诉你代码是否「大概」正确。

从而避免很多 bug。

你只需要稍微花一点点时间,就能让代码质量提升,何乐不为呢?


听说 TS 只适合大型项目?


错,只要是有 bug 的 JS 项目,都可以用 TS 替代 JS 从而减少 bug。

所以无论是小项目还是大项目,都有必要使用 TS。


万一过几年 TS 不火了呢?


这个问题问得好,前端发展这么快,很多东西都是火几年就不火了,导致后期想招人维护都难(比如 AngularJS 1)。

但是 TS 不存在这个问题。为什么?

因为目前前端三大框架全都支持 TS 了:

  1. Angular 很早就支持 TypeScript 了,而且还把 JS 从自己的名字里去掉了:AngluarJS -> Angular。甚至连 Angular 入门文档里的例子都默认是 TS 版本的。用 JS 写 Angular 不是不可以,只是会显得很「奇怪」,明明有更好的 TS,为什么会有人用 JS。
  2. Vue 3.0 用 TS 重写了,为了更好的支持 TS,甚至放弃了原本计划推出的 class API。
  3. React 一开始对 TS 的支持也是非常丝滑。不过 React 并没有强绑定到 TS。

如果有一年 TS 不火了,上面框架的维护者会提前为你想好升级方案的,你就不必过多担心了。

毕竟背靠大树好乘凉。


JS 岂不是白学了?


No No No,TS 里面包含了 JS 的所有语法,所以你在用 TS 的时候,实际上还是在用 JS。

也就是说 JS 的魂还在,我们只是不再单独使用 JS 了。


结论


快点学 TypeScript 吧,它很快就是一线互联网公司面试加分项甚至必备项了。


目录
相关文章
|
1月前
|
JavaScript 前端开发 开发工具
TypeScript的介绍,let age:number = xxx,可以直接看出数据类型,Type由微软开发,可以在任何浏览器和系统中运行,比较适合大型项目,TypeScript的安装
TypeScript的介绍,let age:number = xxx,可以直接看出数据类型,Type由微软开发,可以在任何浏览器和系统中运行,比较适合大型项目,TypeScript的安装
|
17天前
|
JavaScript 前端开发 安全
TypeScript在项目中应用
【8月更文挑战第4天】TypeScript在项目中应用
12 0
|
1月前
|
JavaScript 前端开发 IDE
React 项目中有效地使用 TypeScript
React 项目中有效地使用 TypeScript
|
2月前
|
监控 JavaScript 前端开发
如何在现有的 JavaScript 项目中渐进式地采用 TypeScript
【6月更文挑战第13天】TypeScript,JavaScript的超集,引入静态类型和更多特性,提升代码安全性和可读性。在JavaScript项目中渐进式采用TypeScript可从新模块开始,逐步转换代码,编写.d.ts文件支持第三方库,配置编译选项,并编写测试用例。通过监控和评估,改善项目质量和效率。大型项目尤其受益于TypeScript的类型安全、社区支持和工具兼容性。
44 3
|
1月前
|
JavaScript API
TypeScript 项目中接口的统一管理
TypeScript 项目中接口的统一管理
24 0
|
1月前
【Vue3+TypeScript】CRM系统项目搭建之 —项目目录结构的划分
【Vue3+TypeScript】CRM系统项目搭建之 —项目目录结构的划分
55 0
|
2月前
|
JavaScript 安全 IDE
对于大型项目,TypeScript的优势有哪些?
【6月更文挑战第1天】对于大型项目,TypeScript的优势有哪些?
29 6
|
3月前
|
JavaScript 前端开发 IDE
TypeScript在前端项目的渐进式采用策略
该文介绍了渐进式采用TypeScript在前端项目中的策略。首先,通过将JS文件扩展名改为TS并添加类型注解,如在`utils.js`中添加类型。接着,配置`tsconfig.json`,包括目标版本、模块系统、输出目录等。高级配置涉及路径别名、JSON导入、库文件等。然后,集成TypeScript到构建流程,如Webpack,安装`ts-loader`并调整配置。利用类型定义,包括安装第三方库的类型定义包,自定义类型定义或使用社区定义。最后,逐步迁移其他模块至TypeScript,强化类型检查,并确保IDE支持。
31 0
|
3月前
|
监控 JavaScript 前端开发
【JavaScript与TypeScript技术专栏】TypeScript在JavaScript项目中的渐进式采用
【4月更文挑战第30天】TypeScript是JavaScript的超集,引入静态类型、接口等特性,提升代码安全性和可读性。在JavaScript项目中采用TypeScript可享受类型安全、社区支持及优秀工具集成等优势。渐进式采用策略包括评估项目现状、逐步引入新旧模块、编写类型定义文件、配置编译选项和编写测试用例,以提高项目质量和效率。
45 0
|
3月前
|
传感器 JavaScript 前端开发
【TypeScript技术专栏】TypeScript在大型项目中的实践与挑战
【4月更文挑战第30天】TypeScript在大型前端项目中日益流行,以其类型系统和ES6+支持提升代码安全与维护性。然而,采用 TypeScript 面临学习曲线、构建时间增加及类型推断挑战。通过最佳实践和成熟工具链(如 tsc、tslint 和 Visual Studio Code)可克服这些问题。案例如Angular、Basecamp和Slack已成功应用TypeScript。掌握TypeScript对提升开发者技能和市场竞争力至关重要。
76 0