一切福田，不離方寸，從心而覓，感無不通。

TypeScript 特性

相对 JavaScript，TypeScript 增加了许多关键功能，特别是围绕类型系统和代码结构的增强功能。

TypeScript 的一些关键特性：

  • 静态类型检查：TypeScript 在编译时就会检查代码的类型是否匹配，能够发现很多潜在的错误。即使是简单的错误（例如拼写错误或类型不一致），也可以在编写代码时被捕获到。
  • 类型推断：TypeScript 能够自动推断变量的类型。比如当你声明一个变量并赋值时，TypeScript 会根据赋值来推断这个变量的类型，不需要每次都显式声明类型。
  • 接口和类型定义：TypeScript 提供了 interface 和 type 关键字，允许你定义复杂的数据结构。这对于项目中不同部分的代码协作和数据交互来说非常重要。
  • 类和模块支持：TypeScript 支持面向对象编程中的类（class）概念，增加了构造函数、继承、访问控制修饰符（如 public、private、protected），并且支持 ES 模块化规范。
  • 工具和编辑器支持：TypeScript 拥有良好的编辑器支持，特别是与 Visual Studio Code 集成时，能提供智能提示、自动补全、重构等工具，使开发过程更高效。
  • 兼容 JavaScript：TypeScript 是 JavaScript 的超集，这意味着所有合法的 JavaScript 代码都是合法的 TypeScript 代码。这使得 JavaScript 项目可以逐步迁移到 TypeScript，而无需完全重写。

以下是 TypeScript 增加的主要功能：

1. 静态类型

TypeScript 的最大特性就是增加了静态类型系统。在 TypeScript 中，开发者可以显式地声明变量、参数、返回值的类型，这样可以在编译时捕获很多潜在的类型错误。常见类型包括 number、string、boolean、array、tuple、enum 等，此外也支持自定义类型。

1
2
let name: string = "Alice";
let age: number = 25;

2. 类型推断

TypeScript 可以自动推断变量类型，即使不显式声明类型，TypeScript 也会根据变量的赋值内容来推断类型，从而在大多数情况下减少类型注解的书写量。

1
let name = "Alice"; // 推断为 string

3. 接口 (Interfaces)

TypeScript 提供了接口，允许定义复杂的对象结构。接口可以定义属性和方法，还可以通过 implements 关键字实现接口，或者通过 extends 进行扩展，便于定义复杂的数据类型。

1
2
3
4
5
6
7
8
9
10
11
12
13
interface Person {
  name: string;
  age: number;
  greet(): void;
}
 
class Student implements Person {
  constructor(public name: string, public age: number) {}
 
  greet() {
    console.log(`Hello, my name is ${this.name}`);
  }
}

4. 类型别名 (Type Aliases)

类型别名 (type) 可以为复杂的类型定义简短的别名，便于代码复用。

1
2
type StringOrNumber = string | number;
let value: StringOrNumber = 42;

5. 枚举 (Enums)

TypeScript 引入了 enum 类型，用于定义一组命名的常量，提高代码的可读性。枚举在 JavaScript 中没有直接的对应。

1
2
3
4
5
6
7
enum Direction {
  Up,
  Down,
  Left,
  Right,
}
let dir: Direction = Direction.Up;

6. 元组 (Tuples)

元组允许定义具有固定数量和类型的数组。它适用于需要固定数据结构的场景，比如坐标或 RGB 颜色值。

1
let point: [number, number] = [10, 20];

7. 访问控制修饰符 (Access Modifiers)

TypeScript 在类中提供了 public、private 和 protected 修饰符，允许控制属性或方法的可见性，支持更好的封装。

1
2
3
4
5
6
7
8
class Person {
  private name: string;
  protected age: number;
  public constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }
}

8. 抽象类 (Abstract Classes)

TypeScript 支持抽象类，抽象类不能直接实例化，需要由子类实现。抽象类适用于定义通用行为和抽象方法的类层次结构。

1
2
3
4
5
6
7
8
9
abstract class Animal {
  abstract makeSound(): void;
}
 
class Dog extends Animal {
  makeSound() {
    console.log("Woof!");
  }
}

9. 泛型 (Generics)

TypeScript 支持泛型，允许在类、接口和函数中使用参数化类型，使得代码可以适应不同的类型需求，同时保持类型安全。

1
2
3
4
5
function identity<T>(value: T): T {
  return value;
}
 
let num = identity<number>(42);

10. 模块和命名空间

TypeScript 提供了基于 ES6 的模块系统，使用 import 和 export 导入和导出模块。此外，TypeScript 还支持命名空间（Namespace），用于组织代码和避免命名冲突。

1
2
3
4
5
6
7
8
// math.ts
export function add(a: number, b: number): number {
  return a + b;
}
 
// main.ts
import { add } from "./math";
console.log(add(2, 3));

11. 类型守卫 (Type Guards)

TypeScript 提供了类型守卫，可以在代码中检查变量类型，帮助编译器推断更加具体的类型。这对于联合类型尤为重要。

1
2
3
4
5
6
7
function printId(id: string | number) {
  if (typeof id === "string") {
    console.log(id.toUpperCase());
  } else {
    console.log(id.toFixed(2));
  }
}

12. 可选链和空值合并运算符

TypeScript 增加了 JavaScript 的可选链 (?.) 和空值合并运算符 (??)，简化了代码中对可能为 null 或 undefined 值的处理。

1
2
3
4
5
let user = { name: "Alice", address: { city: "Wonderland" } };
console.log(user?.address?.city); // 如果 address 存在则输出 city，否则返回 undefined
 
let value = null;
console.log(value ?? "default"); // 如果 value 为 null 或 undefined，则返回 "default"

13. 类型兼容性和工具类型

TypeScript 提供了一些工具类型，如 Partial、Pick、Readonly、Record 等，这些类型可以帮助生成新的类型，简化类型定义。

1
2
3
4
5
6
interface Todo {
  title: string;
  description: string;
}
 
let partialTodo: Partial<Todo> = { title: "Learn TypeScript" }; // 可选属性

14. 编译期错误检查

TypeScript 提供的编译期错误检查可以捕获 JavaScript 中不易发现的错误，如拼写错误、类型不匹配等，帮助提升代码质量。

15. ES 新特性支持

TypeScript 提前支持了一些还未在所有环境中普及的 ES 特性，如装饰器（Decorators）、异步迭代器等，且能够将其编译成兼容 JavaScript 版本。

通过这些特性，TypeScript 提供了更安全、更结构化的代码能力，在大型项目和多人协作中尤其具有优势。

 

from:https://www.runoob.com/typescript/ts-features.html

Copyright © 2025 Longsheng All rights reserved