这是我参与「第四届青训营 」笔记创作活动的第一天
TypeScript 发展历史
- 2012-10: 微软发布了TypeScript 第一个版本（0.8）
- 2014-10: Angular 发布了基于TypeScript的2.0 版本
- 2015-04: 微软发布了 Visual Studio Code
- 2016-05: @types/react 发布， TypeScript 可开发React
- 2020-09: Vue 发布了3.0版本，官方支持TypeScript
- 2021-11 V4.5 版本发布
JavaScript 与 TypeScript 的区别
TypeScript 是 JavaScript 的超集，扩展了 JavaScript 的语法，因此现有的 JavaScript 代码可与 TypeScript 一起工作无需任何修改，TypeScript 通过类型注解提供编译时的静态类型检查。 TypeScript 可处理已有的 JavaScript 代码，并只对其中的 TypeScript 代码进行编译。
如何学习TypeScript
学习没有捷径，最好的学习方法就是先建立起对事物的全面认知，然后由浅入深地系统学习。 这里的“全面”如何理解？我们首先要了解 TypeScript 是由哪些部分组成的。相对严谨来说，TypeScript 由三个部分组成：类型、语法与工程。我们可以从这三个部分入手，来建立起一个全面、系统的学习路径。
首先是类型能力。它是最核心的部分，也是学习成本最高的部分。它为 JavaScript 中的变量、函数等概念提供了类型的标注，同时内置了一批类型工具，基于这些类型工具我们就能实现更复杂的类型描述，将类型关联起来。你可以从最简单的类型开始，每学到一个新的类型能力就添加上去，思考它和已掌握部分的交相融合，以此一步步掌握整个类型系统。
接着是语法部分。TypeScript 提前支持了一些已经到达 Stage 3 / 4 阶段，或是比较重要的 TC39 提案，比如使用最多的可选链（?.）、空值合并（??）、装饰器等，这些语法都已经或即将成为 ECMAScript Next 的新成员。在 TypeScript 中使用这些新语法时，你只需要简单的配置就能实现语法的降级，让编译后的代码可以运行在更低的浏览器或 Node 版本下。这一部分几乎没有学习成本，他们就像语言的 API，你只需要多提醒自己去使用，及时查询官方文档就能熟悉了。
类型能力与新语法确实很棒，但浏览器不认怎么办？TypeScript 会在构建时被抹除类型代码与语法的降级。这一能力就是通过 TypeScript Compiler（tsc）实现的。tsc 以及 tsc 配置（TSConfig）是 TypeScript 工程层面的重要部分。除此以外，TypeScript 工程能力的另一重要体现就是，我们可以通过类型声明的方式，在 TypeScript 中愉快地使用 JavaScript 社区的大量 npm 包。
类型、语法、工程其实也代表了三个不同阶段使用 TypeScript 目的：为 JavaScript 代码添加类型与类型检查来确保健壮性，提前使用新语法或新特性来简化代码，以及最终获得可用的 JavaScript 代码。因此，类型-语法-工程，也是学习 TypeScript 的最佳路径。
基本数据类型
/* 字符串 */
const q :string = 'string';
/* 数字 */
const w :number = 1;
/* 布尔值 */
const e :boolean = true;
/* null */
const r :null = null;
/* undefined */
const t :undefined = undefined;
TypeScript泛型
泛型（Generics）是允许同一个函数接受不同类型参数的一种模板。相比于使用 any 类型，使用泛型来创建可复用的组件要更好，因为泛型会保留参数类型。
/* 泛型接口 & 多泛型 */
interface IX<T, U> {
key: T;
val: U;
}
/* 泛型类 */
class IMan<T> {
instance: T;
}
/* 泛型别名 */
type ITypeArr<T> = Array<T>;
function getRepeatArr(target) {
return new Array(100).fill(trarget);
}
type IGetRepeatArr = (target :any) => any[];
/* 不预先指定具体的类型，而在使用的时候再指定类型的一种特性 */
type IGetReapeatArrR = <T>(target :T) => T[];
参考文献
掘金小册: 《TypeScript 全面进阶指南》
