联合类型(|)表示“可能是其一”,用于建模多种合法值(如状态、api响应);交叉类型(&)表示“必须同时满足”,用于合并类型特性(如对象组合、配置叠加),二者结合可精准建模复杂组件props并配合类型守卫安全访问。

在 TypeScript 中,联合类型(|)和交叉类型(&)不是语法糖,而是建模真实业务逻辑的底层工具。用对了,类型检查能提前暴露错误;用错了,反而会让代码更难维护。
联合类型:表达“可能是这个,也可能是那个”
它适用于值存在多种合法形态的场景,比如状态、配置模式或 API 响应结构。
-
基础写法:用竖线
|连接多个类型,如string | number | boolean,变量可取其中任意一种值 -
字面量联合更实用:比如
type Status = 'idle' | 'loading' | 'success' | 'error',比string精确得多,避免拼错状态名 -
访问限制是保护机制:声明为
string | number的变量不能直接调用.toUpperCase(),因为number没这个方法——这不是报错,是提醒你该加类型守卫了
交叉类型:表达“既要满足这个,也要满足那个”
它常用于组合接口、合并配置、或给已有类型叠加新能力。
Java Maven 项目审查工作流的通用输入处理。当 Java Maven 项目以 ZIP压缩包或 GitLab 仓库 URL 形式提供且需要...时使用。
-
对象合并最常见:比如
interface User { id: number; name: string }和interface Timestamped { createdAt: string; updatedAt: string },交叉后User & Timestamped要求同时具备全部字段 -
同名属性需兼容:如果两个类型都有
id字段,但一个是string、一个是number,交叉结果中id类型会变成never(即矛盾),编译器会立刻报错 - 函数签名也能交叉:两个函数类型交叉后,会合并所有重载签名,适合构建多态回调接口
组合使用:联合 + 交叉 = 精准建模复杂组件 Props
这是实际项目中最有力的搭配方式,尤其适合多态 UI 组件。
-
先定义共性基础:比如所有表单模式都含
label: string和required: boolean -
再定义分支专属:编辑态有
onSave: () => void,只读态有tooltip?: string -
最后组合成完整契约:
type FormProps = BaseProps & (EditMode | ReadOnlyMode)—— 这样既保证通用字段必填,又确保分支属性不会被误用 -
配合类型守卫安全访问:通过判断
props.editable === true,TypeScript 就能自动缩小类型到EditMode分支,允许调用onSave
注意优先级和分配律:避免类型意外坍缩
联合与交叉混合时,& 比 | 优先级高,类似数学里的乘法先于加法。
-
A & B | C & D等价于(A & B) | (C & D),不是A & (B | C) & D - 需要后者语义时,必须显式加括号:
A & (B | C),它等价于(A & B) | (A & C)(分配律) - 滥用
any & string或string & number会得到any或never,这类组合通常意味着设计问题
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南










