专栏首页前端达人前端开发者们,为什么我们还需要学习 TypeScript?

前端开发者们,为什么我们还需要学习 TypeScript?

开篇

TypeScript 是由 C#语言的创始人 Anders Hejlsberg 设计的一种编程语言,设计的初衷就是为了帮助 JavaScript 的开发人员能像类似高级语言c#,Java那样编写代码,比如使用高级语言的强类型、面向对象、语法检查,代码编译等特点。TypeScript包含一个编译器,可以将用TypeScript 编写的代码转换为原生的 JavaScript。

TypeScript 目前最新的版本是 3.x 了,是目前微软最好的产品之一,现在完全免费并且使用 Apache 协议开源了 TypeScript,并成为社区很活跃的框架之一。连谷歌这样的死对头,也拥抱 TypeScript ,在 Angular 2.0 版本就开始集成 TypeScript,如果你不学 TypeScript,Angular 这个框架就无法使用。目前 React 、Vue 在未来的版本都在考虑集成 TypeScript 。在可以预计的未来,如果还不开始学习 TypeScript,我们就不能使用这些框架的新特性了。

以下几个观点就是笔者强烈大家学习TypeScript的原因,纯属个人观点,如有不恰当地方,欢迎各位指正。

01

JavaScript 发展迅速

从目前 JavaScript 的发展和应用趋势来看,它的发展实在是太快了,你可以用它进行 web开发、移动应用开发、桌面软件开发、后端开发,以及未来成为趋势的 VR、WebGL及物联网的应用开发等,它的标准从2015年开始每年都会更新,更新实在是太快了,及时这样,但是与 java 和 c# 这些成熟的高级语言还有很大的距离。

使用 TypeScript 可以帮你降低 JavaScript 弱语言的脆弱性,帮你减少由于不正确类型导致错误产生的风险,以及各种 JavaScript 版本混杂造成错误的风险。

02

我们需要强类型的 JavaScript

从表面上看,TypeScript 像普通的 JavaScript 代码,这一特点就降低我们初学者的难度,因此不得不佩服微软的良苦用心。TypeScript 只是把高级语言的强类型这个最主要的特征引入 JavaScript ,就解决了防止我们在编写 JavaScript 代码时因为数据类型的转换造成的意想不到的错误,增加了我们排查问题的困难性。它为 JavaScript 上了一把高级语言强类型的锁,避免这类问题的产生,使用 TypeScript,你的代码可能是这样的:

也许你觉得这段代码很平常,如果你这样调用 increaseAge(cat),TypeScript会抛出一个错误,提示你 increaseAge 函数的参数必须是数字类型。如果使用原生的 JavaScript ,原生编译器则不会产生错误,还能正常的返回 Merlin1 的内容,这可不是我们期望的,这就大大增加了我们开发过程中潜在的风险,排查错误的困难性。

这就是 TypeScript 的魅力所在,提前帮我们发现代码出现错的风险。

03

按需输出 JavaScript 版本

前面提及到 JavaScript 发展迅速,估计 JavaScript 的创始人也没有想到能发展到今天的地步,JavaScript 的版本现在几乎每年都会有更新,如果你要写出兼容性的脚本,对于每位开发者就是一个相当大的挑战。TypeScript 却很好的解决了此问题,你可以按需输出你需要的脚本,比如 ECMAScript 3、ECMAScript 5 、ECMAScript 6 。

04

代码标准化利于团队开发

由于 JavaScript 本身语言的特点,还有其版本迭代太快的原因,团队成员使用 JavaScript 时很容易随意发挥,不受规范约束。你的团队当然可以针对这些版本的 JavaScript 做出使用规范,引入一些代码质量检测插件,比如eslint。整理这些内容,估计就需要花不少的时间,在团队推广和使用制定的规范又要花一段时间。与其花这些时间进行整理,还不如在TypeScript 的基础上,结合 TypeScript 的特点做一套标准即可来应对 JavaScript 版本不断的更新迭代。

05

主流框架及最新特性的支持

文章一开始笔者都提及到 Angular 2.0 版本就开始集成 TypeScript,用于解决版本兼容性和弱语言的特点,从而互相推动了各自的发展。时至今日,React 、Vue也要加入 TypeScript 的阵营,因此我们不得不去学好 TypeScript。

除了主流前端框架集成的问题,还有一个重要的原因,TypeScript 紧跟 JavaScript 的发展,比如 ES7 、ES8、ES9 相关语言的新特性都支持,比浏览器支持的速度更快。这就意味着你能用最新的语言特性,编写质量更高的 JavaScript。

如果你是 JavaScript 的新手,笔者不太建议你一上来就学习 TypeScript,建议你还是从基础的 JavaScript 学起。之所以有 TypeScript 这个工具,并不是为了吸引开发者学前端,而是为每个 JavaScript 开发者能像其它高级语言一样编写更健壮的代码。

当初之所以有 JavaScript 就是为了便携和简单性,但是随着时间的发展,已经大大超出了当初设计者的初衷。如果是几百行代码还好,但是随着多设备支持(pc、手机、各种移动终端及大屏设备),产品线的增长,项目越来越大,如果还用原始的方式编写 JavaScript ,维护的难度可想而知。

学习TypeScript本身并不难。它像JavaScript一样编写和运行,只是增加一些新的理念和语法糖,我们学起来也会更加顺手。

本文分享自微信公众号 - 前端达人(frontend84),作者:前端达人

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2019-09-03

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 通过事例重温一下常见的 JS 中 15 种数组操作(备忘清单)

    数组是 JS 中广泛使用的数据结构。数组对象提供了大量有用的方法,如array. forEach()、array.map()等来操作数组。

    前端达人
  • 127个常用的JS代码片段,每段代码花30秒就能看懂(四)

    用于判断参数的值是否是对象,这里运用了Object 构造函数创建一个对象包装器,如果是对象类型,将会原值返回。

    前端达人
  • 127个常用的JS代码片段,每段代码花30秒就能看懂(三)

    大家好,在前两篇文章里 127个常用的JS代码片段,每段代码花30秒就能看懂(一)和 127个常用的JS代码片段,每段代码花30秒就能看懂(二),我分享了前42...

    前端达人
  • Angular export class AppComponent里定义变量的实现原理

    我在Angular项目的app.component.ts使用export class定义了一个Component,在大括号里声明了一个title属性(prope...

    Jerry Wang
  • python 输出正方形

    #!/usr/bin/env python num = int(raw_input("please num:")) x = 1 while x <= num: ...

    py3study
  • TypeScript 3.9正式发布!平均编译时长从26秒缩短至10秒

    今天,微软在其官方博客宣布:TypeScript 3.9 版本已经正式发布,详情见下文。

    Nealyang
  • Android Studio代码混淆插件

    ? 最近有人在公众号的后台留言说让我讲讲Android代码混淆,我最近也正在想这个问题,怎样才能把混淆讲清楚和明白,不过这回不愁了,正好有人来投稿。而且还是插...

    非著名程序员
  • 基于51单片机设计的简易电子琴

    版权声明:本文为博主原创文章,转载请注明博客地址: https://blog.csdn.ne...

    zy010101
  • 新太空新角逐:SpaceX之后看中国民营新势力

    相比于SpaceX等,从关键技术的掌握到基础设施的搭建,再到商业化场景的完善……我国刚起步的民营火箭新势力还有很多事情要做。

    镁客网
  • flutter web之WebSocketChannelException错误

    版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。 ...

    望天

扫码关注云+社区

领取腾讯云代金券