【TypeScript教程】01—什么是TypeScript
TypeScript 是类型化的 JavaScript。 TypeScript 将类型添加到 JavaScript 以帮助您通过在运行 JavaScript 代码之前捕获错误来加快开发速度。
TypeScript 是一种建立在 JavaScript 之上的开源编程语言。 它适用于任何浏览器、任何操作系统、任何运行 JavaScript 的环境。
在本 TypeScript 教程中,您将学习:
为什么 TypeScript 比 vanilla JavaScript 有很多好处。
了解 TypeScript 的真正含义及其背后的工作原理。
使用 TypeScript 及其丰富的功能,如类型、类、接口、模块等。
要学习本教程,您需要具备以下条件:
基本的 JavaScript 知识。 如果您想学习 JavaScript,请查看 JavaScript 教程。
ECMAScript 2015 或 ES6 知识。
TypeScript简介
TypeScript 是 JavaScript 的超集。
TypeScript 建立在 JavaScript 之上。 首先,您编写 TypeScript 代码。 然后,使用 TypeScript 编译器将 TypeScript 代码编译成纯 JavaScript 代码。
拥有纯 JavaScript 代码后,您可以将其部署到 JavaScript 运行的任何环境中。
TypeScript 文件使用 .ts 扩展名而不是 JavaScript 文件的 .js 扩展名。
![【TypeScript教程】01—什么是TypeScript](https://www.typescripttutorial.net/wp-content/uploads/2020/05/what-is-typescript-compiler.png)
TypeScript 使用 JavaScript 语法并添加额外的语法来支持类型。
如果你有一个没有任何语法错误的 JavaScript 程序,它也是一个 TypeScript 程序。 这意味着所有的 JavaScript 程序都是 TypeScript 程序。 如果您要将现有的 JavaScript 代码库迁移到 TypeScript,这将非常有用。
下图显示了 TypeScript 和 JavaScript 之间的关系:
![【TypeScript教程】01—什么是TypeScript](https://www.typescripttutorial.net/wp-content/uploads/2020/05/what-is-typescript-typescript-and-js.png)
为什么要学习TypeScript
TypeScript 的主要目标是:
将可选类型引入 JavaScript。
实现未来 JavaScript 的计划功能,即当前 JavaScript 的 ECMAScript Next 或 ES Next。
1) TypeScript 在帮助避免错误的同时提高了你的工作效率
类型通过帮助您避免许多错误来提高生产力。 通过使用类型,您可以在编译时捕获错误,而不是让它们在运行时出现。
以下函数将两个数字 x 和 y 相加:
function add(x, y) { return x + y; }
如果您从 HTML 输入元素获取值并将它们传递给函数,您可能会得到意想不到的结果:
let result = add(input1.value, input2.value); console.log(result); // result of concatenating strings
例如,如果用户输入 10 和 20,add() 函数将返回 1020,而不是 30。
原因是 input1.value 和 input2.value 是字符串,而不是数字。 当您使用运算符 + 来添加两个字符串时,它会将它们连接成一个字符串。
当您使用 TypeScript 显式指定参数的类型时,如下所示:
function add(x: number, y: number) { return x + y; }
在此函数中,我们将数字类型添加到参数中。 函数 add() 将只接受数字,不接受任何其他值。
当您按如下方式调用该函数时:
let result = add(input1.value, input2.value);
……如果你将 TypeScript 代码编译成 JavaScript,TypeScript 编译器会报错。 因此,您可以防止错误在运行时发生。
2) TypeScript 将未来的 JavaScript 带到了今天
TypeScript 支持 ES Next 中为当前 JavaScript 引擎计划的即将推出的功能。 这意味着您可以在 Web 浏览器(或其他环境)完全支持它们之前使用新的 JavaScript 功能。
每年,TC39 都会针对 JavaScript 的标准 ECMAScript 发布多项新功能。 功能提案通常会经历五个阶段:
Stage 0: Strawperson
Stage 1: Proposal
Stage 2: Draft
Stage 3: Candidate
Stage 4: Finished
并且 TypeScript 通常支持第 3 阶段的功能。
本节完