TypeScript中的type

什么是type?

type是TypeScript中创建类型别名的关键字，咱们可以简单理解为给复杂的类型起一个简单的名字。

必须掌握的5个核心用法

1. 基础类型别名（最简单）

// 给基础类型起别名
type Username =string
type Userage = number
type UserId = string

//使用的时候
let name:Username = 'Ruby'
let age: Userage = '18'
let id:UserId = 'u_007'

2. 联合类型（多选一）

// 状态只能是这三种之一 
type ConnectionStatus = "loading" | "success" | "error" 
// 主题只能是亮色或暗色 
type Theme = "light" | "dark"

//使用示例
let currentStatus:COnnectionStatus = "loading"
let appTheme:Theme = "dark"

3. 对象类型（描述对象的结构）

// 定义学生对象的结构 
type Student = { 
id: string name: string 
age: number grade: number 
email?: string // ? 表示可选属性 
} 

// 使用 
let student: Student = { 
id: "007", 
name: "ruby", 
age: 18, 
grade: 4 
// email 可以不写，因为是可选的 
}

4. 函数类型（描述函数的样子）

// 定义一个计算函数的类型 
type Calculator = (a: number, b: number) => number 
// 这些函数都符合Calculator类型 
let add: Calculator = (x, y) => x + y 
let multiply: Calculator = (x, y) => x * y 
let subtract: Calculator = (x, y) => x - y 

// 使用 
console.log(add(5, 3)) // 8 
console.log(multiply(4, 7)) // 28

5. 数组类型（描述数组中的元素）

// 字符串数组 
type StringList = string[] 
// 数字数组 
type NumberList = number[] 
// 学生对象数组 
type StudentList = Student[] 

// 使用 
let fruits: StringList = ["apple", "banana", "orange"] 
let scores: NumberList = [85, 92, 78, 96] 
let classList: StudentList = [ 
{id: "001", name: "pat", age: 16, grade: 1}, 
{id: "002", name: "lisa", age: 17, grade: 2} ]

理解之后的进阶用法

1、组合类型

//基础类型
type Name = string 
type Phone = string
type Email = string 

//组合复杂类型
type ContactInfo = {
     name:Name
     phone?:Phone
     email:Email
}

type User = {
    id:string
    contact:ContactInfo
}

2、条件类型组合

// 用户可能是游客或已登录用户 
type Guest = { 
     type: "guest" 
     sessionId: string 
} 
type LoggedInUser = { 
    type: "user" 
    id: string 
    name: string 
    email: string 
 } 
 type AppUser = Guest | LoggedInUser 
 // 使用时需要区分 
 function greetUser(user: AppUser) { 
 if (user.type === "guest") {
 console.log("欢迎游客！") 
 } else { 
 console.log(`欢迎回来，${user.name}！`) 
    } 
 }

3、索引签名

当对象可能有任意数量的属性，而我们不知道具体有哪些属性名时，就用索引签名。

type FlexibleUser = {
    // 固定属性（必须有）
    name: string
    age: number
    
    // 索引签名（可以有任意多个string类型的属性）
    [key: string]: any
}

let user: FlexibleUser = {
    name: "张三",
    age: 25,
    hobby: "游戏",        // ✅ 可以添加
    city: "北京",         // ✅ 可以添加  
    favoriteColor: "蓝色", // ✅ 可以添加
    anyOtherProperty: "任何值"  // ✅ 都可以
}

• [key: string]：属性名必须是字符串类型

• : any：属性值可以是任何类型

• key 只是一个名字，你可以叫它 prop、field、k 等等