当前位置：首页 > news >正文

解释 TypeScript 中的类型系统，如何定义和使用类型？

news 来源：原创 2025/8/23 6:21:47

1. 类型系统的核心作用

TypeScript类型系统本质上是JavaScript的静态类型增强方案，提供三个核心价值：

开发阶段类型检查（类似编译时eslint）
更清晰的API文档（类型即文档）
更好的IDE自动补全支持

代码示例：

// 错误示范：未指定类型导致潜在隐患
function add(a, b) {return a + b;
}
add('hello', 123); // 运行时错误但编译期不报错// 正确类型标注
function add(a: number, b: number): number {return a + b;
}
add('hello', 123); // 编译时报错：类型不匹配

2. 类型定义方式（重点考察点）

(1) 基础类型

// 原生类型
let name: string = 'Alice';
let age: number = 28;
let isStudent: boolean = true;// 数组类型
let hobbies: string[] = ['reading', 'coding'];
let scores: number[] = [90, 85, 92];// 元组类型（固定长度的异构数组）
let user: [string, number] = ['Bob', 30];

(2) 接口（Interface）

用于描述对象结构的最常用方式

interface User {id: number;name: string;email?: string; // 可选属性address: {city: string;zipCode: string;};
}// 正确实现
const user: User = {id: 1,name: 'Charlie',address: { city: 'Shanghai', zipCode: '200000' }
};// 错误实现（缺少必要属性）
const invalidUser = { name: 'David' }; // 编译报错

(3) 类型别名（Type Alias）

适用于复杂类型抽象

type Point = {x: number;y: number;
};type Rectangle = {topLeft: Point;bottomRight: Point;
};// 更复杂的联合类型
type ResponseData<T> = {data: T;error?: string;
};

(4) 联合类型（Union Types）

处理多种可能类型

function processInput(value: string | number) {if (typeof value === 'string') {console.log(`String input: ${value}`);} else {console.log(`Number input: ${value.toFixed(2)}`);}
}processInput('hello');    // 执行字符串分支
processInput(42);       // 执行数字分支
processInput(true);      // 编译时报错：类型不在联合类型中

(5) 交叉类型（Intersection Types）

合并多个类型特征

interface Serializable {serialize(): string;
}class Person {name: string;age: number;
}// 创建同时满足两个条件的类型
type SerializablePerson = Person & Serializable;class SerializablePersonImpl extends Person implements Serializable {serialize() {return JSON.stringify({ name: this.name, age: this.age });}
}

3. 高级类型技巧

(1) 类型推断（Type Inference）

function getProperty<T, K extends keyof T>(obj: T, key: K): T[K] {return obj[key];
}const user = { name: 'Alice', age: 30 };
const userName = getProperty(user, 'name'); // 推断为string类型

(2) 类型守卫（Type Guards）

function isNumber(value: any): value is number {return typeof value === 'number';
}function printValue(value: any) {if (isNumber(value)) {console.log(`Number: ${value}`); // 类型被缩小为number} else {console.log(`String: ${value}`); // 类型被缩小为string}
}

(3) 映射类型（Mapped Types）

type Readonly<T> = {readonly [P in keyof T]: T[P];
};interface User {name: string;age: number;
}type ReadonlyUser = Readonly<User>; 
// 所有属性变为只读

4. 日常开发实践建议

(1) 严格模式配置

{"compilerOptions": {"strict": true,"noImplicitAny": true,"strictNullChecks": true}
}

strict模式开启后：
- 所有变量必须有显式类型声明
- 不能将null/undefined赋值给非允许类型
- 函数参数必须显式标注类型

(2) 合理使用any类型

// 不推荐
function handleData(data: any) {console.log(data.name); // 可能存在运行时错误
}// 推荐改进
function handleData(data: { name: string }) {console.log(data.name);
}// 必要时使用类型断言
const userInput = document.querySelector('#input') as HTMLInputElement;

(3) 类型安全的API设计

// 错误示范：返回不确定类型
function fetchUserData(id: number) {return fetch(`/api/users/${id}`).then(response => response.json());
}// 正确实现
interface UserResponse {id: number;name: string;email: string;
}async function fetchUserData(id: number): Promise<UserResponse> {const response = await fetch(`/api/users/${id}`);if (!response.ok) {throw new Error('Network error');}return response.json() as UserResponse; // 显式断言类型
}

(4) 类型别名的合理使用

// 不推荐过度嵌套
type DeepReadonly<T> = {readonly [P in keyof T]-?: DeepReadonly<T[P]>;
};// 推荐分层抽象
type Readonly<T> = {readonly [P in keyof T]: T[P];
};type DeepReadonly<T> = {readonly [P in keyof T]: DeepReadonly<T[P]>;
};

5. 常见陷阱与注意事项

(1) 类型合并冲突

interface A {x: number;
}interface B {x: string;
}// 合并会产生联合类型 {x: number} | {x: string}
type C = A & B; // 编译错误：类型不兼容

(2) 函数重载歧义

function process(value: number): number;
function process(value: string): string;function process(value: any) {if (typeof value === 'number') return value * 2;else return value.toUpperCase();
}// 更好的实现方式
function process<T>(value: T): T extends number ? number : string {return typeof value === 'number' ? value * 2 : value.toUpperCase();
}

(3) 类型推断失效场景

function createArray<T>(length: number, value: T): T[] {return Array(length).fill(value);
}const result = createArray(3, 'hello'); // 正确推断为string[]
const numericResult = createArray(3, 5); // 正确推断为number[]

6. 性能考量

类型定义不会影响运行时性能（TS编译后生成纯JS）
复杂类型系统会增加编译时间，建议：
- 合理拆分大型类型定义
- 使用条件类型代替深度递归结构
- 避免不必要的类型运算符

7. 工具类型实战

// Partial类型：将所有属性变为可选
type PartialUser = Partial<User>;// Required类型：将所有属性变为必选
type RequiredUser = Required<User>;// Omit类型：排除指定属性
type PublicUser = Omit<User, 'email'>;// Extract类型：提取共有类型
type CommonProps = Extract<User, Admin>; // Readonly类型：只读属性集合
type ReadonlyUser = Readonly<User>;// Record类型：键值对映射
type AgeMap = Record<string, number>;

8. 代码质量检查清单

所有函数参数都有明确类型标注
接口/类型别名包含必要文档注释
避免使用any类型（除非绝对必要）
数组类型优先使用泛型而非any[]
对复杂类型使用有意义的命名
类型别名和接口保持单一职责
定期运行tslint/type-check进行静态分析

作为资深开发者，建议建立以下类型安全开发规范：

在团队中强制启用严格模式
使用接口描述核心数据模型
对第三方库类型进行类型声明文件（d.ts）封装
利用类型推导减少冗余标注
重要业务逻辑添加单元类型测试

通过系统性的类型设计，可以显著提升代码的可维护性和健壮性，降低运行时错误率。在实际项目中，建议从核心模块开始逐步引入严格类型检查，配合IDE的类型提示功能，形成良好的类型驱动开发习惯。

解释 TypeScript 中的类型系统，如何定义和使用类型？

1. 类型系统的核心作用 TypeScript类型系统本质上是JavaScript的静态类型增强方案，提供三个核心价值： 开发阶段类型检查（类似编译时eslint）更清晰的API文档（类型即文档）更好的IDE自动补全支持代码示例&…...

编程日记 2025/8/23 6:21:47

安裝do時出現log file support is not available

“log file support is not available (press RETURN)” 这个提示信息表明日志文件支持不可用，让你按回车键继续。出现这种情况可能是因为 Odoo 的日志相关配置存在问题或者一些必要的依赖没有正确安装配置。以下是一些可以尝试的解决办法： 1. 检查 Odo…...

编程日记 2025/8/23 6:15:42

[HTTP协议]应用层协议HTTP从入门到深刻理解并落地部署自己的云服务(1)知识基础

[HTTP协议]应用层协议HTTP从入门到深刻理解并落地部署自己的云服务(1)知识基础水墨不写bug 文章目录 (一)概念梳理1.什么是协议?2.什么是应用层?3. 为什么要进行分层？ （二）HTTP协议2.1 初识HTTP协议2.2HTTP协议的URL2.2.1域名2.2.2端口号2…...

编程日记 2025/8/23 6:19:51

机票改签请求

示例代码： tool def update_ticket_to_new_flight(ticket_no: str, new_flight_id: int) -> str:"""Update the users ticket to a new valid flight.Args:ticket_no (str): The ticket number to be updated.new_flight_id (int): The ID of th…...

编程日记 2025/8/23 6:20:09

linux下文件读写操作

Linux下，文件I/O是操作系统与文件系统之间进行数据传输的关键部分。文件I/O操作允许程序读取和写入文件，管理文件的打开、关闭、创建和删除等操作。 1. 文件描述符在Linux中，每个打开的文件都由一个文件描述符来表示。文件描述符是一个非负…...

编程日记 2025/8/21 18:16:21

命名管道的创建和通信实现

目录命名管道的创建使用函数创建命名管道的通信预备创建 makefile设计 server.hpp设计 clent.hpp设计 comm.hpp设计 server.cc设计 clent.cc设计测试运行今天我们来学习命名管道由于匿名管道（pipe()）无法在两个毫不相干的进程之间进行通…...

编程日记 2025/8/21 15:47:17

C++和OpenGL实现3D游戏编程【连载24】——父物体和子物体之间的坐标转换

欢迎来到zhooyu的C++和OpenGL游戏专栏，专栏连载的所有精彩内容目录详见下边链接： 🔥C++和OpenGL实现3D游戏编程【总览】父子物体的坐标转换 1、本节要实现的内容前面章节我们了解了父物体与子物体的结构，它不仅能够表示物体之间的层次关系，更重要的一个作用就是展示物…...

编程日记 2025/8/23 6:19:15

21.HarmonyOS Next CustomSlider组件步长控制教程(三)

温馨提示：本篇博客的详细代码已发布到 git : https://gitcode.com/nutpi/HarmonyosNext 可以下载运行哦！ 文章目录 1. 步长控制概述2. 步长基本概念2.1 什么是步长？2.2 步长的作用 3. 设置步长3.1 基本参数3.2 代码示例 4. 步长与范围的关系4…...

编程日记 2025/8/23 6:19:14

小白学习：rag向量数据库

学习视频： https://www.bilibili.com/video/BV11zf6YyEnT/?spm_id_from333.337.search-card.all.click 例子： 用户提出问题客服机器人基于rag回答用户问题过程拆解： 客户问题 – 转化为向量表示 – 在向量数据库中进行相似性搜索 – 系…...

编程日记 2025/8/23 6:18:07

STM32 CAN模块原理与应用详解

目录概述一、CAN模块核心原理 1. CAN协议基础 2. STM32 CAN控制器结构 3. 波特率配置二、CAN模块配置步骤（基于HAL库） 1. 初始化CAN外设 2. 配置过滤器 3. 启动CAN通信三、数据收发实现 1. 发送数据帧 2. 接收数据帧（中断方式…...

编程日记 2025/8/23 6:16:04

NO.29十六届蓝桥杯备战|string九道练习|reverse|翻转|回文(C++)

P5015 [NOIP 2018 普及组] 标题统计 - 洛谷 #include <bits/stdc.h> using namespace std;int main() {ios::sync_with_stdio(false);cin.tie(nullptr);string s;getline(cin, s);int sz s.size();int cnt 0;for (int i 0; i < sz; i){if (isspace(s[i]))continue…...

编程日记 2025/8/16 12:02:21

MAC-禁止百度网盘自动升级更新

通过终端禁用更新服务（推荐）此方法直接移除百度网盘的自动更新组件，无需修改系统文件。步骤： 1.关闭百度网盘后台进程按下 Command + Space → 输入「活动监视器」→ 搜索 BaiduNetdisk 或 UpdateAgent → 结束相关进程。 2.删除自动更新配置文件打开终端…...

编程日记 2025/8/22 15:51:23

Unity DOTS从入门到精通之EntityCommandBufferSystem

文章目录前言安装 DOTS 包ECBECB可以执行的指令示例： 前言 DOTS（面向数据的技术堆栈）是一套由 Unity 提供支持的技术，用于提供高性能游戏开发解决方案，特别适合需要处理大量数据的游戏，例如大型开放世界游…...

编程日记 2025/8/22 8:12:21

【AIGC系列】6：HunyuanVideo视频生成模型部署和代码分析

AIGC系列博文： 【AIGC系列】1：自编码器（AutoEncoder, AE） 【AIGC系列】2：DALLE 2模型介绍（内含扩散模型介绍） 【AIGC系列】3：Stable Diffusion模型原理介绍【AIGC系列】4&#xff1…...

编程日记 2025/8/23 6:18:08

【Linux】使用问题汇总

#1 ssh连接的时候报Key exchange failed 原因：服务端版本高，抛弃了一些不安全的交换密钥算法，且客户端版本比较旧，不支持安全性较高的密钥交换算法。解决方案： 如果是内网应用，安全要求不这么高&#xf…...

编程日记 2025/8/23 6:18:07

nnUNet V2修改网络——全配置替换MultiResBlock模块

更换前，要用nnUNet V2跑通所用数据集，证明nnUNet V2、数据集、运行环境等没有问题阅读nnU-Net V2 的 U-Net结构，初步了解要修改的网络，知己知彼，修改起来才能游刃有余。 MultiRes Block 是 MultiResUNet 中核心组件之一，旨在解决传统 U-Net 在处理多尺度医学图像时的局…...

编程日记 2025/8/23 6:21:08

Git合并工具在开发中的使用指南

在团队协作开发中，Git 是最常用的版本控制工具，而代码合并（Merge）是多人协作不可避免的环节。当多个开发者同时修改同一文件的相同区域时，Git 无法自动完成合并，此时需要借助合并工具（Merge Too…...

编程日记 2025/8/23 6:20:09

AutoDL平台租借GPU，创建transformers环境，使用VSCode SSH登录

AutoDL平台租借GPU，创建transformers环境，使用VSCode SSH登录一、AutoDl平台租用GPU 1.注册并登录AutoDl官网：https://www.autodl.com/home 2.选择算力市场，找到需要的GPU： 我这里选择3090显卡 3.这里我们就选择P…...

编程日记 2025/8/23 6:21:09

listen EACCES: permission denied 0.0.0.0:811

具体错误 npm run serve> bige-v0.0.0 serve > viteThe CJS build of Vites Node API is deprecated. See https://vitejs.dev/guide/troubleshooting.html#vite-cjs-node-api-deprecated for more details. error when starting dev server: Error: listen EACCES: per…...

编程日记 2025/8/23 6:18:08

OpenAI API模型ChatGPT各模型功能对比，o1、o1Pro、GPT-4o、GPT-4.5调用次数限制附ChatGPT订阅教程

本文包含OpenAI API模型对比页面以及ChatGPT各模型功能对比表 - 截至2025最新整理数据：包含模型分类及描述；调用次数限制； 包含模型的类型有： Chat 模型（如 GPT-4o、GPT-4.5、GPT-4）专注于对话&#xff0c…...

编程日记 2025/8/22 21:48:50

六十天前端强化训练之第十五天React组件基础案例：创建函数式组件展示用户信息(第15-21天：前端框架（React）)

欢迎来到编程星辰海的博客讲解我们已经学了14天了，再坚持坚持，马上我们就可以变得更优秀了，加油，我相信大家，接下来的几天，我会给大家更新前端框架（React），看完可以给一…...

编程日记 2025/8/23 6:16:04

北大一二三四版全套DeepSeek教学资料

DeepSeek学习资料合集：https://pan.quark.cn/s/bb6ebf0e9b4d DeepSeek实操变现指南：https://pan.quark.cn/s/76328991eaa2 你是否渴望深入探索人工智能的前沿领域？是否在寻找一份能引领你从理论到实践，全面掌握AI核心技术的学习…...

编程日记 2025/8/22 9:33:33

计算机网络：计算机网络的组成和功能

计算机网络的组成： 计算机网络的工作方式： 计算机网络的逻辑功能; 总结： 计算机网络的功能： 1.数据通信 2.资源共享 3.分布式处理:计算机网络的分布式处理是指将计算任务分散到网络中的多个节点（计算机或设备&…...

编程日记 2025/8/22 14:18:12

管理网络安全

防火墙在 Linux 系统安全中有哪些重要的作用？ 防火墙作为网络安全的第一道防线，能够根据预设的规则，对进出系统的网络流量进行严格筛选。它可以阻止未经授权的外部访问，只允许符合规则的流量进入系统，从而保护系统免受…...

编程日记 2025/8/21 22:21:08

音频进阶学习十九——逆系统（简单进行回声消除）

文章目录前言一、可逆系统1.定义2.解卷积3.逆系统恢复原始信号过程4.逆系统与原系统的零极点关系二、使用逆系统去除回声获取原信号的频谱原系统和逆系统幅频响应和相频响应使用逆系统恢复原始信号整体代码如下总结前言在上一篇音频进阶学习十八——幅频响应相同系统、全…...

编程日记 2025/8/21 5:43:19

Redis7系列：设置开机自启

前面的文章讲了Redis和Redis Stack的安装，随着服务器的重启，导致Redis 客户端无法连接。原来的是Redis没有配置开机自启。此文记录一下如何配置开机自启。 1、修改配置文件前面的Redis和Redis Stack的安装的文章中已经讲了redis.config的配置&#xf…...

编程日记 2025/8/21 7:20:37

word甲烷一键下标

Sub 甲烷下标()甲烷下标宏Selection.Find.ClearFormattingSelection.Find.Replacement.ClearFormattingWith Selection.Find.Text "CH4".Replacement.Text "CHguoshao4".Forward True.Wrap wdFindContinue.Format False.MatchCase False.MatchWhole…...

编程日记 2025/8/19 7:58:11

SSH 连接中主机密钥验证失败问题的解决方法

问题描述在尝试通过 SSH 建立连接时，出现以下错误信息： WARNING: REMOTE HOST IDENTIFICATION HAS CHANGED! IT IS POSSIBLE THAT SOMEONE IS DOING SOMETHING NASTY! Someone could be eavesdropping on you right now (man-in-the-middle attack…...

编程日记 2025/8/21 11:14:34

网络安全工具nc(NetCat)

NetCat是一个非常简单的Unix工具，可以读、写TCP或UDP网络连接(network connection)。它被设计成一个可靠的后端(back-end)工具，能被其它的程序程序或脚本直接地或容易地驱动。同时，它又是一个功能丰富的网络调试和开发工具，因为它…...

编程日记 2025/8/21 8:15:09

探索在生成扩散模型中基于RAG增强生成的实现与未来

概述像 Stable Diffusion、Flux 这样的生成扩散模型，以及 Hunyuan 等视频模型，都依赖于在单一、资源密集型的训练过程中通过固定数据集获取的知识。任何在训练之后引入的概念——被称为知识截止——除非通过微调或外部适应技术（如低秩适…...

编程日记 2025/8/16 11:10:13

【Linux】37.网络版本计算器

文章目录 1. Log.hpp-日志记录器2. Daemon.hpp-守护进程工具3. Protocol.hpp-通信协议解析器4. ServerCal.hpp-计算器服务处理器5. Socket.hpp-Socket通信封装类6. TcpServer.hpp-TCP服务器框架7. ClientCal.cc-计算器客户端8. ServerCal.cc-计算器服务器9. 代码时序1. 服务器启…...

编程日记 2025/8/23 2:49:57

3.6c语言

#define _CRT_SECURE_NO_WARNINGS #include <math.h> #include <stdio.h> int main() {int sum 0,i,j;for (j 1; j < 1000; j){sum 0;for (i 1; i < j; i){if (j % i 0){sum i;} }if (sum j){printf("%d是完数\n", j);}}return 0; }#de…...

编程日记 2025/8/19 3:05:49

【 IEEE出版 | 快速稳定EI检索 | 往届已EI检索】2025年储能及能源转换国际学术会议（ESEC 2025)

重要信息主会官网：www.net-lc.net 【论文【】投稿】会议时间：2025年5月9-11日会议地点：中国-杭州截稿时间：见官网提交检索：IEEE Xplore, EI Compendex, Scopus 主会NET-LC 2025已进入IEEE 会议官方列表!&am…...

编程日记 2025/8/19 7:22:36

JVM常用概念之本地内存跟踪

问题 Java应用启动或者运行过程中报“内存不足！”，我们该怎么办? 基础知识对于一个在本地机器运行的JVM应用而言，需要足够的内存来存储机器代码、堆元数据、类元数据、内存分析等数据结构，来保证JVM应用的成功启动以及未来平…...

编程日记 2025/8/21 5:43:39

JVM 的主要组成部分及其作用？

创作内容丰富的干货文章很费心力，感谢点过此文章的读者，点一个关注鼓励一下作者，激励他分享更多的精彩好文，谢谢大家！ JVM包含两个子系统和两个组件，两个子系统为Class loader(类装载)、Execution engine(执…...

编程日记 2025/8/18 2:03:00

从能耗监测到碳资产管理：智慧校园能源管理平台的迭代升级与实践启示

一、核心价值提炼随着我国能源结构转型的持续优化和“双碳”目标的明确，构建现代化能源体系已成为国家发展的重要战略。在这一背景下，校园作为能源消耗的重要领域，其能源管理的智能化、绿色化转型显得尤为重要。本文将深入探讨校园智慧能源…...

编程日记 2025/8/22 19:35:49

数据库核心-redo、undo

一、redo日志 InnoDB操作以页为单位操作数据。并且首先操作内存中缓冲池的数据，然后刷新到disk中，但如果事务提交后宕机、未能刷新到disk中，就会造成不一致情况。重做日志： 系统重启时按照修改步骤重新更新数据页 redo日志占用…...

编程日记 2025/8/16 12:24:21

Ubuntu 下 nginx-1.24.0 源码分析 - ngx_core_module

定义在 src\core\nginx.c ngx_module_t ngx_core_module {NGX_MODULE_V1,&ngx_core_module_ctx, /* module context */ngx_core_commands, /* module directives */NGX_CORE_MODULE, /* module type */NULL…...

编程日记 2025/8/22 13:49:46

SQLAlchemy系列教程：如何执行原生SQL

Python中的数据库交互提供了高级API。但是，有时您可能需要执行原始SQL以提高效率或利用数据库特定的特性。本指南介绍在SQLAlchemy框架内执行原始SQL。在SQLAlchemy中执行原生SQL SQLAlchemy虽然以其对象-关系映射（ORM）功能而闻名&#xff…...

编程日记 2025/8/16 11:26:04

怎么实现：大语言模型微调案例

怎么实现：大语言模型微调案例目录怎么实现：大语言模型微调案例输入一个反常识的问题：首都在北京天安门之后对输出模型进行测试：首都在北京天安门微调代码：测试微调模型代码：微调输出模型结构输出模型参数大小对比Qwen 2.5_0.5:53MB输出模型：951MB 是一样的，没有进行…...

编程日记 2025/8/18 6:13:12

【Linux内核系列】：深入理解缓冲区

🔥 本文专栏：Linux 🌸作者主页：努力努力再努力wz ★★★ 本文前置知识： 文件系统以及相关系统调用接口输入以及输出重定向那么在此前的学习中，我们了解了文件的概念以及相关的系统调用接口，并…...

编程日记 2025/8/16 12:29:31

【Qt】成员函数指针

一、成员函数指针的本质与普通函数指针的区别： // 普通函数指针 void (*funcPtr)() &普通函数;// 成员函数指针 void (MyClass::*memberFuncPtr)() &MyClass::成员函数;• 绑定对象：成员函数指针必须与类的实例对象结合使用 • 隐含 this 指…...

编程日记 2025/8/20 23:42:20

关于 Can Utils 的详细介绍、使用方法及配置指南

Can Utils：开源CAN总线工具集合一、Can Utils简介 Can Utils 是一组开源的CAN总线工具链，专为嵌入式开发者和网络诊断工程师设计，支持Linux、Windows和macOS系统。它包含一系列轻量级命令行工具（如 cantoolz、candump、canbus …...

编程日记 2025/8/17 18:24:17

【Academy】OAuth 2.0 身份验证漏洞 ------ OAuth 2.0 authentication vulnerabilities

OAuth 2.0 身份验证漏洞 ------ OAuth 2.0 authentication vulnerabilities 1. 什么是 OAuth？2. OAuth 2.0 是如何工作的？3. OAuth 授权类型3.1 OAuth 范围3.2 授权代码授权类型3.3 隐式授权类型 4. OAuth 身份验证4.1 识别 OAuth 身份验证4.2 侦察OAuth…...

编程日记 2025/8/23 1:14:20