TypeScript 核心概念及代码示例的梳理无论您是正在学习TypeScript的开发者，还是有一定经验但想查漏补缺的

TypeScript 体系

一、基础类型系统

原始类型

let age: number = 25;                   // 数字类型
let name: string = "Alice";             // 字符串类型
let isActive: boolean = true;           // 布尔类型
let nothing: null = null;               // null
let notDefined: undefined = undefined;  // undefined
let uniqueId: symbol = Symbol("id");    // Symbol 类型
let bigValue: bigint = 100n;            // BigInt 类型

数组与元组

// 数组
let numbers: number[] = [1, 2, 3];      // 数字数组
let names: Array<string> = ["A", "B"];  // 泛型语法

// 元组（固定长度+类型）
let user: [string, number] = ["Alice", 30]; 
// user[0].substring(0);   // ✅ 正确
// user[1].substring(0);   // ❌ 错误：number 无 substring 方法

枚举（Enum）

enum Status { 
  Success = 200, 
  NotFound = 404 
}
console.log(Status.Success); // 200

特殊类型
- any：绕过类型检查（慎用）
- unknown：安全版 any，需类型检查后使用
- void：无返回值函数
- never：永不返回的函数（如抛异常）
```
function throwError(msg: string): never {
  throw new Error(msg);
}
```

二、函数与面向对象

函数类型注解

// 参数与返回值类型
function add(x: number, y: number): number {
  return x + y;
}

// 可选参数 & 默认值
function greet(name: string, age?: number = 18): string {
  return `Hello ${name}, age: ${age}`;
}

接口（Interface）
定义对象结构：

interface Person {
  name: string;
  age: number;
  isAdmin?: boolean;  // 可选属性
}
const alice: Person = { name: "Alice", age: 25 };

类与继承

class Animal {
  constructor(public name: string) {}  // 简写语法
  move(distance: number) {
    console.log(`${this.name} moved ${distance}m`);
  }
}

class Dog extends Animal {
  bark() { console.log("Woof!"); }
}
const dog = new Dog("Buddy");
dog.bark();

访问修饰符：public（默认）、private、protected

三、类型系统进阶

联合类型（Union）与交叉类型（Intersection）

type ID = string | number;  // 联合类型
type Named = { name: string };
type Aged = { age: number };
type Person = Named & Aged; // 交叉类型

类型守卫
缩小类型范围：

// typeof 守卫
function printId(id: string | number) {
  if (typeof id === "string") {
    console.log(id.toUpperCase());
  } else {
    console.log(id.toFixed(2));
  }
}

// 自定义守卫
function isFish(pet: Fish | Bird): pet is Fish {
  return "swim" in pet;
}

泛型（Generics）
创建可复用组件：

// 泛型函数
function identity<T>(arg: T): T {
  return arg;
}
let output = identity<string>("hello");

// 泛型接口
interface Box<T> {
  value: T;
}
const numberBox: Box<number> = { value: 42 };

类型别名与工具类型

type Point = { x: number; y: number };  // 类型别名

// 工具类型（内置）
type PartialPerson = Partial<Person>;    // 所有属性可选
type ReadonlyPoint = Readonly<Point>;    // 所有属性只读

四、模块与工具链

模块化（ES Modules）

// math.ts
export const add = (a: number, b: number): number => a + b;

// main.ts
import { add } from "./math";
console.log(add(2, 3)); // 5

配置文件（tsconfig.json）
核心配置项：

{
  "compilerOptions": {
    "target": "ES2025",     // 编译目标版本
    "module": "ESNext",     // 模块系统
    "strict": true,          // 启用严格模式
    "outDir": "./dist"       // 输出目录
  }
}

声明文件（.d.ts）
为 JS 库提供类型支持：

// myLib.d.ts
declare module "my-library" {
  export function doSomething(): void;
}

五、前沿特性（2025）

装饰器（Decorators）
元编程支持（类/方法/属性）：

function Log(target: any, key: string) {
  console.log(`Property decorated: ${key}`);
}

class Example {
  @Log
  message: string;
}

模板字面量类型
增强字符串类型安全：

type HTTPMethod = 'GET' | 'POST';
type Endpoint = '/users' | '/posts';
type APIRoute = `${HTTPMethod} ${Endpoint}`;
const route: APIRoute = 'GET /users'; //

条件类型与 infer
动态类型推导：

type UnwrapPromise<T> = T extends Promise<infer U> ? U : T;
type Result = UnwrapPromise<Promise<number>>; // number

Records & Tuples（提案）
不可变数据结构：

const point = #{ x: 1, y: 2 };  // Record
const coords = #[1, 2, 3];      // Tuple

学习建议：

1、先掌握类型系统（接口、泛型）。

2、实践工程配置（模块化、tsconfig）。

3、逐步深入装饰器、条件类型等高级特性。

4、结合框架（React/Vue）实战强化。

TypeScript 核心概念及代码示例的梳理

TypeScript 体系​​

一、基础类型系统​​

​​二、函数与面向对象​​

​​三、类型系统进阶​​

​​四、模块与工具链​​

​​五、前沿特性（2025）​​