整个TypeScript官方文档分为这么一些模块：

1. 快速开始

2. 手册

3. 参考文档

4. 模块参考

5. 教程

6. 更新内容

7. 声明文件

8. JavaScript

9. 项目

原文链接：https://www.typescriptlang.org/docs/handbook/typescript-in-5-minutes.html

文档位置：快速开始

翻译：谢杰

审校：谢杰

TypeScript 与 JavaScript 之间有一种特殊的关系。TypeScript 在完全兼容 JavaScript 所有特性的基础上，额外提供了一套类型系统。

例如，JavaScript 提供了诸如 string 和 number 等语言原语，但它不会检查你是否始终如一地使用这些类型。而 TypeScript 会进行这样的检查。

这意味着，现有的可运行的 JavaScript 代码，本质上也是合法的 TypeScript 代码。TypeScript 的主要优势在于，它可以帮助你发现代码中意料之外的行为，从而降低出错的可能性。

本教程将简要介绍 TypeScript，并重点讲解其类型系统。

类型的推断

TypeScript 了解 JavaScript 的语言特性，因此在很多情况下可以自动为你推断出类型。例如，当你创建一个变量并为其赋值时，TypeScript 会根据这个值推断出对应的类型：

let helloWorld = "Hello World";

等同于：

let helloWorld: string;

通过理解 JavaScript 的运行机制，TypeScript 构建了一套能够接受 JavaScript 代码的类型系统，并在此基础上添加类型能力。这意味着你可以在不显式标注类型的情况下，依然获得完整的类型系统支持。上面的例子中，正是通过这样的推断机制，TypeScript 知道 helloWorld 是一个 string。

如果你曾在 Visual Studio Code 中编写过 JavaScript，并体验过自动补全功能，其实底层正是依赖 TypeScript 来提升 JavaScript 的开发体验。

定义类型

在 JavaScript 中可以使用各种各样的设计模式。然而，有些设计模式会使类型推导变得困难（例如，使用动态编程的模式）。为了解决这些情况，TypeScript 在 JavaScript 的语法基础上做了扩展，允许你显式告诉 TypeScript 每个值的类型。

例如，创建一个类型可推断为包含 name: string 和 id: number 的对象，可以这样写：

const user = {  name: "Hayes",  id: 0,};

你也可以通过 interface 显式描述这个对象的结构：

interface User {  name: string;  id: number;}

然后，在声明变量时使用 : TypeName 语法，标注该对象符合你定义的接口：

const user: User = {  name: "Hayes",  id: 0,};

如果你传入一个不符合接口结构的对象，TypeScript 会发出警告：

interface User {  name: string;  id: number;}
const user: User = {  username: "Hayes", // ❌ 报错：对象字面量只能指定已知属性，'username' 不存在于 'User' 类型中  id: 0,};

由于 JavaScript 本身支持类和面向对象编程，TypeScript 也同样支持。你可以将 interface 与 class 结合使用：

interface User {  name: string;  id: number;}
class UserAccount {  name: string;  id: number;
  constructor(name: string, id: number) {    this.name = name;    this.id = id;  }}
const user: User = new UserAccount("Murphy", 1);

你还可以使用接口来注解函数的参数和返回值类型：

function deleteUser(user: User) {  // ...}
function getAdminUser(): User {  // ...}

JavaScript 中原生支持的一些基础类型包括：boolean、bigint、null、number、string、symbol 和 undefined，这些都可以在接口中使用。TypeScript 还扩展了几个额外的类型：

• any：任意类型，不做任何类型检查

• unknown：未知类型，使用时必须先明确其具体类型

• never：永远不会发生的类型（例如抛出异常或无限循环）

• void：用于表示函数没有返回值，或返回 undefined

你会发现 TypeScript 中定义类型有两种语法：interface 和 type。推荐优先使用 interface，只有在需要一些特殊功能时再使用 type。

组合类型

在 TypeScript 中，你可以通过组合简单类型来构建复杂类型。最常用的两种组合方式是：

1. 联合类型（union） 

2. 泛型（generics）

联合类型

使用联合类型时，你可以声明某个值可以是多个类型中的任意一种。例如，可以用联合类型来描述布尔类型是 true 或 false：

type MyBool = true | false;

注意：将鼠标悬停在 MyBool 上，你会发现它被识别为 boolean。这是结构类型系统的一种特性，后文会进一步解释。

联合类型的一个常见用法是限定值只能是某些特定的字符串或数字字面量：

type WindowStates = "open" | "closed" | "minimized";type LockStates = "locked" | "unlocked";type PositiveOddNumbersUnderTen = 1 | 3 | 5 | 7 | 9;

联合类型也可以用来处理不同类型的数据。例如，你可能会写一个函数，它的参数可以是 string 或 string[]：

function getLength(obj: string | string[]) {  return obj.length;}

你可以使用 typeof 来判断变量的类型：

例如，可以根据传入参数的类型（字符串或数组）返回不同的结果：

function wrapInArray(obj: string | string[]) {  if (typeof obj === "string") {    return [obj];    // (parameter) obj: string  }  return obj;}

泛型

泛型为类型引入了“变量”的能力。一个常见的例子是数组：不带泛型的数组可以包含任意类型的值，而带泛型的数组则可以明确描述数组中元素的类型。

type StringArray = Array<string>;type NumberArray = Array<number>;type ObjectWithNameArray = Array<{ name: string }>;

你也可以声明带有泛型参数的自定义类型：

interface Backpack<Type> {  add: (obj: Type) => void;  get: () => Type;}
// 下面这行是告诉 TypeScript 存在一个叫 backpack 的常量declare const backpack: Backpack<string>;
// object 是 string 类型，因为我们在上面将 Backpack 的类型参数指定为了 string。const object = backpack.get();
// 由于 backpack 的泛型是 string，因此不能向 add 方法传入 number 类型的值。backpack.add(23);// ❌ 报错：类型 "number" 的参数不能赋值给类型 "string" 的参数。

结构类型系统

TypeScript 的核心原则之一是：类型检查关注的是值的“结构”。这种方式有时也被称为鸭子类型（duck typing）或结构类型（structural typing）。

译者注：

所谓鸭子类型，就是那句话：“如果它看起来像鸭子、叫起来像鸭子，那它就是鸭子。”

在TypeScript里，只要一个对象结构上（具有的字段和类型）满足某个接口，那它就可以被当成那个接口类型使用。即便它从来没有 implements 过这个接口。

这和C#以及Java这种“名义类型系统”有着非常大的区别。

在结构类型系统中，只要两个对象具有相同的结构，它们就会被视为相同的类型。

interface Point {  x: number;  y: number;}
function logPoint(p: Point) {  console.log(`${p.x}, ${p.y}`);}
// 输出 "12, 26"const point = { x: 12, y: 26 };logPoint(point);

上面的 point 变量并没有显式声明为 Point 类型，但在类型检查时，TypeScript 会将 point 的结构与 Point 的结构进行对比。由于它们结构一致，因此该代码可以通过编译。

结构匹配只要求对象的部分字段与目标类型一致即可：

const point3 = { x: 12, y: 26, z: 89 };logPoint(point3); // 输出 "12, 26"
const rect = { x: 33, y: 3, width: 30, height: 80 };logPoint(rect); // 输出 "33, 3"
const color = { hex: "#187ABF" };logPoint(color);// ❌ 报错：类型 '{ hex: string; }' 无法赋值给参数类型 'Point'// 缺少属性 x 和 y

在结构类型系统中，class 和 object 的结构匹配方式是一样的：

class VirtualPoint {  x: number;  y: number;
  constructor(x: number, y: number) {    this.x = x;    this.y = y;  }}
const newVPoint = new VirtualPoint(13, 56);logPoint(newVPoint); // 输出 "13, 56"

只要对象或类拥有所需的全部属性，TypeScript 就认为它们是兼容的，而不会关心具体的实现细节。

译者解读：

这篇官方文档向有 JavaScript 开发经验的开发者，介绍了TypeScript的核心特性。这些特性都是JavaScript中不存在的，主要包括了这么一些概念：

1. TypeScript会自动做类型推断，也可以开发者手动标注。

2. TypeScript是结构类型系统，又被称之为鸭子类型。这是非常非常重要的一个知识点，和C#以及Java这种“名义类型系统”有着非常大的区别。

3. TypeScript支持联合类型，就是将不同类型组合起来，这也是传统的名义类型系统做不到的。

4. TypeScript也支持泛型。

5. 类型在编译时完全擦除。

阅读原文：原文链接