一、“前浪” JavaScript

2007年 Jeff Atwood 在他的博客里提出了著名的 Atwood 定律，即“任何能够用 JavaScript 实现的应用系统，最终都必将用 JavaScript 实现。”

JavaScript 的强大毋庸置疑，十余年的时间早已验证了这一点：语法结构简单、万物皆可对象、前后端通吃、单线程……这些特点使它几乎无处不在。

正因为它的应用领域之广，对这门语言的安全性、可维护性等方面的要求日渐拔高，可偏偏“万物皆可对象”的特点，又使得它注定是一门动态弱类型的编程语言，于是乎使用 JavaScript的工程师们，他们经常会碰到这么一种情况：

<script>function getLength(str) {return str length;}console.log("1.正在的代码执行");console.log("2.开始函数");getLength("abc"); //正确的调用getLength(); //错误的调用(IDE并不会报错)//当上面的代码报错后，后续所有的代码都无法正常执行了console.log("3.调用结束");
<script>

在 JavaScript 里编译以上代码时，不会出现报错，可在浏览器运行时，就会出现以下画面↓↓

出现这一情况的原因就在于：JavaScript 对我们传入的参数，不会进行任何限制。

二、“后浪” TypeScript

今年的五四，B站的《后浪》刷了屏，一周了热度也没算完全消退。

尽管 JavaScript 这一“前浪”着实优秀，却也有着不可避免的限制和缺陷，在这种情况下，“后浪” TypeScript 出现了，它既能完美融合 JavaScript 已有的优点和特点，也在此基础上，又增加了类型约束。

为什么说 JS 工程师遇到了 TypeScript 会拥有超能力呢？接下来我们将通过课程《TypeScript 基础入门》的第一章，让你初步了解“后浪” TypeScript。

三、初见 TypeScript

TypeScript 是 JavaScript 的一个超集，他们两个之间有非常深入的联系，所以在学习 TypeScript 之前，你需要学习 JavaScript 相关教程。在本实验我们将会对 TypeScript 进行简单的介绍并初步使用它。

知识点

TypeScript 简介
为何选择 TypeScript
安装使用 TypeScript

TypeScript 简介

什么是TypeScript？

TypeScript 是一种由微软开发的自由和开源的编程语言。它是 JavaScript 的一个超集，而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。

它扩展了 JavaScript 的语法，所以任何现有的 JavaScript 程序可以不加改变的在 TypeScript 下工作。TypeScript 是为大型应用之开发而设计，而编译时它产生 JavaScript 以确保兼容性。

TypeScript 与 JavaScript 的区别

TypeScript 是 JavaScript 的超集，扩展了 JavaScript 的语法。
TypeScript 可处理已有的 JavaScript 代码，并只对其中的 TypeScript 代码进行编译。
TypeScript 文件的后缀名 .ts （.ts，.tsx，.dts），JavaScript 文件是 .js。
在编写 TypeScript 的文件的时候就会自动编译成 js 文件。

用一张表格来更清晰的观察两者的区别：

为何选择 TypeScript

TypeScript 增加了代码的可读性和可维护性
新增了其他语言的语法，比如 Class（类）、Interface（接口）、Generics(泛型)、Enums(枚举）等。
TypeScript 拥抱了 ES6 规范
兼容很多第三方库，即使第三方库不是用 TypeScript 写的，也可以编写单独的类型文件供 TypeScript 读取。
TypeScript 拥有活跃的社区

更值得一提的是，TypeScript 在开发时就能给出编译错误，而 JavaScript 错误则需要在运行时才能暴露。作为强类型语言，你可以明确知道数据的类型，代码可读性极强，几乎每个人都能理解。TypeScript 被很多业界大佬使用，像 Asana、Circle CL 和 Slack 这些公司都在用 TypeScript。

安装使用 TypeScript

打开终端 terminal 输入全局安装命令：

cnpm install -g typescript

新建一个文件index.ts，输入以下内容：

console.log("hello world");

var a: string = “2”; //这是ts写法，暂时不需要掌握，后续会讲到
在终端输入tsc index.ts编译文件，编译成功则会生成一个同名的 js 文件。

生成的 js 文件里则将 ts 语法转换成了 js 语法。

四、总结

本小节我们学习了以下知识点：

TypeScript 简介
为何选择 TypeScript
安装使用 TypeScript

我相信你已经对 TypeScript 有了一个初步了解，接下来我们将会对 TypeScript 进行进一步学习。后续还有以下章节等着你来掌握：

基本数据类型
接囗
类（Class）
函数
模块
命名空间

登陆实验楼官网，搜索《JavaScript 基础入门》、《TypeScript 基础入门》，一起拥抱 TypeScript，做一个拥有超能力的JS 工程师！

当 JS 工程师遇到了 TypeScript 会发生什么?相关推荐

将超过5000万行JS代码迁移到TypeScript，我们得到的10大见解
Python实战社群 Java实战社群长按识别下方二维码,按需求添加扫码关注添加客服进Python社群▲ 扫码关注添加客服进Java社群▲ 作者丨Rob Palmer 译者丨王强策划丨蔡芳芳 ...
将超过5000万行JS代码迁移到TypeScript后的总结
关注公众号前端开发博客,回复"加群" 加入我们一起学习,天天进步来自公众号:前端之巅作者 | Rob Palmer 译者 | 王强策划 | 蔡芳芳几年前,彭博工程公司决定 ...
Autodesk Forge Viewer与Forge API Node.js客户端SDK的TypeScript声明文件发布！
作为一个凝聚专(jie)业(cao)精(man)神(man)的团队(Autodesk ADN),这大过?年的岂能没有一点表示?!花式红包什么的早已化境,技术分享大家也审low疲劳了,所以我们这就本着M ...
webpack 深入浅出分析之打包 JS、ES6 和 Typescript
一.webpack 打包 JS 文件通过 npm install webpack 命令可以下载 webpack,通过 npm install webpack-cli -g 命令下载 webpack- ...
2019 年，19 种方法让自己成为更好的 Node.js 工程师
原文作者:Yoni Goldberg 译者:UC 国际研发 Jothy 写在最前:欢迎你来到"UC国际技术"公众号,我们将为大家提供与客户端.服务端.算法.测试.数据.前端等相关的 ...
Xlsx转Json(JS Object/Array) Javascript/Typescript版本
源起由于游戏策划异常偏爱用excel编写数据.很多数据可以用二维表的形式处理.但是还有一些数据更方便用树形结构存储.如果同时能也写在excel中,就可以方便双方的协作. 之前在网络上找到过一些xls ...
为Angular（2+）开发人员提供带TypeScript的Vue.js
目录介绍单页应用程序的演变(SPA) 三大框架概述 Angular开发者的Vue.js 学习Vue.js Vue.js页面的剖析构建示例应用程序 TypeScript的案例入门--Vue.js ...
用Typescript如火如荼地进行angular.js
目录介绍设置环境将指令翻译成惯用的Typescript 翻译服务翻译值提供者翻译控制器使tsconfig.json更严格离开angular.js边界结论本文介绍如何迁移旧的angul ...
使用Visual Studio Code + Node.js搭建TypeScript开发环境
Visual Studio Code搭建Typescript开发环境 -- 相关文章: http://www.cnblogs.com/sunjie9606/p/5945540.html [注意:这里仅 ...

当 JS 工程师遇到了 TypeScript 会发生什么?