TypeScript 的联合类型和交集类型详解
typescript 是 javascript 的超集,引入了强大的类型系统,增强了代码的可读性和可维护性。联合类型和交集类型是 typescript 类型系统中重要的组成部分,它们允许我们创建更灵活和精确的类型定义。本文将深入探讨这两个类型,并通过一个示例演示如何结合使用它们。
案例研究:构建 Person 类型
考虑一个场景:根据性别,某些信息是“不该问”的。 我们希望在 TypeScript 中创建一个 Person 类型来反映这种约束。
(图片链接: https://www.php.cn/link/3f1d00695d5aac23f5c556054b88be47)
下表总结了“不该问”的信息:
男薪水关系地址全名女年龄体重地址全名
如果只使用简单的联合类型,例如:
type Person = { gender: 'man' | 'woman', dontAsk: 'salary' | 'relationship' | 'age' | 'weight'};
那么 const person1: Person = { gender: 'man', dontAsk: 'weight' }; 这样的代码不会报错,这与我们的预期不符。
联合类型 (Union Type)
联合类型允许一个变量拥有多种类型中的一种。例如:
type ManDontAsk = 'salary' | 'relationship';type WomanDontAsk = 'age' | 'weight';
这定义了男性和女性“不该问”的信息类型。
交集类型 (Intersection Type)
交集类型将多种类型组合成一种新的类型,该类型的变量必须同时满足所有组成类型的要求。例如,所有的人都应该有地址和全名:
type CommonPerson = { address?: string, fullName: string};
组合联合类型和交集类型
现在,我们可以结合联合类型和交集类型来创建精确的 Person 类型:
type Person = ({ gender: 'man', dontAsk: ManDontAsk} | { gender: 'woman', dontAsk: WomanDontAsk}) & CommonPerson;
这个类型定义确保:
Person 必须是男性或女性。根据性别,dontAsk 属性的类型不同。Person 必须包含 address(可选)和 fullName(必填)属性。
有效的 Person 对象示例:
const person1: Person = { gender: 'man', dontAsk: 'salary', fullName: 'John Doe'};const person2: Person = { gender: 'woman', dontAsk: 'weight', fullName: 'Jane Doe', address: '123 Main St'};
无效的 Person 对象示例 (TypeScript 编译器会报错):
const person3: Person = { // 错误:性别为男,但dontAsk为age gender: 'man', dontAsk: 'age', fullName: 'Jane Doe',};
总结
联合类型和交集类型是 TypeScript 类型系统中的强大工具,它们允许我们创建灵活且精确的类型定义,从而提高代码的可读性和可维护性。 通过巧妙地结合使用这两种类型,我们可以更有效地表达复杂的类型关系,并尽早发现类型错误。 这对于大型项目和团队协作至关重要。
以上就是TypeScript 中的并集和交集类型的详细内容,更多请关注创想鸟其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1500340.html
微信扫一扫
支付宝扫一扫