首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Typescript如何检查具有多种类型的对象的类型

Typescript可以使用联合类型(Union Types)来检查具有多种类型的对象的类型。联合类型表示一个值可以是多个类型之一。在Typescript中,可以使用竖线(|)将多个类型组合在一起形成联合类型。

例如,假设我们有一个对象person,它可以是学生或教师类型:

代码语言:txt
复制
type Student = {
  name: string;
  age: number;
  grade: string;
};

type Teacher = {
  name: string;
  age: number;
  subject: string;
};

type Person = Student | Teacher;

function printDetails(person: Person) {
  console.log(person.name);
  console.log(person.age);
  
  // 使用类型断言来判断具体类型并执行相应的操作
  if ('grade' in person) {
    console.log(person.grade);
  } else {
    console.log(person.subject);
  }
}

const student: Student = {
  name: 'Alice',
  age: 18,
  grade: 'A'
};

const teacher: Teacher = {
  name: 'Bob',
  age: 30,
  subject: 'Math'
};

printDetails(student); // 输出:Alice 18 A
printDetails(teacher); // 输出:Bob 30 Math

在上面的例子中,我们定义了三个类型:Student、Teacher和Person。Person类型是Student和Teacher的联合类型。然后我们定义了一个函数printDetails,它接受一个Person类型的参数。在函数内部,我们可以通过类型断言来判断具体的类型,并执行相应的操作。

这样,当我们调用printDetails函数并传入一个学生对象时,它会打印学生的姓名、年龄和成绩;当我们传入一个教师对象时,它会打印教师的姓名、年龄和科目。

对于Typescript的类型检查来说,联合类型是一种非常有用的工具,可以帮助我们处理具有多种类型的对象的类型检查和操作。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

TypeScript 对象类型-接口

一、什么是接口 在 TypeScript 中,我们使用接口(Interfaces)来定义对象类型 接口是一系列抽象方法声明,是一些方法特征集合,第三方可以通过这组抽象方法调用,让具体类执行具体方法...TypeScript 中接口除了可用于对类一部分行为进行抽象以外,还可用于对「对象形状(Shape)」进行描述 举个例子: interface Person { name: string;...需要注意是,一旦定义了任意属性,那么确定属性和可选属性类型都必须是它类型子集: interface Person { name: string; age?...上例中,使用 readonly 定义属性 id 初始化后又被赋值,所以报错 注意,只读约束存在于第一次给对象赋值时候,而非第一次给只读属性赋值时候: interface Person {...上例中,报错信息有两处: 1、在对 faker 进行赋值时候,没有给 id 赋值 2、在给 faker.id 赋值时候,由于它是只读属性,所以报错了 五、联合类型和接口 以下实例演示了如何在接口中使用联合类型

3.3K10

TypeScript基础类型:原始类型对象类型、数组类型、元组类型、枚举类型和联合类型

TypeScript 是一种由微软开发静态类型编程语言,它是 JavaScript 超集,并且可以在编译时进行类型检查。...TypeScript 强大类型系统使得开发者能够更轻松地编写可维护、可扩展代码。本文将详细介绍 TypeScript基础类型,包括原始类型对象类型、数组类型、元组类型、枚举类型和联合类型。...类型推断和类型断言TypeScript 具有强大类型推断能力,它可以根据上下文自动推断变量类型。例如,如果我们在定义变量时直接赋值,TypeScript 可以推断出变量类型。...总结本文详细介绍了 TypeScript 基础类型,包括原始类型对象类型、数组类型、元组类型、枚举类型和联合类型等方面。...TypeScript 强大类型系统使得开发者能够在编译时进行类型检查,减少了在运行时出现类型错误概率。

31030

TypeScript函数类型

{ return x+y; }; 这是可以通过编译,不过事实上,上面的代码只对等号右侧匿名函数进行了类型定义,而等号左边 mySum,是通过赋值操作进行类型推论而推断出来。...{ return x+y; }; 注意不要混淆了 TypeScript => 和 ES6 中 =>。...在 TypeScript 类型定义中,=> 用来表示函数定义,左边是输入类型,需要用括号括起来,右边是输出类型。...可选参数 前面提到,输入多余(或者少于要求)参数,是不允许。那么如何定义可选参数呢?与接口中可选属性类似,我们用 ?...在编辑器代码提示中,可以正确看到前两个提示。 注意,TypeScript 会优先从最前面的函数定义开始匹配,所以多个函数定义如果有包含关系,需要优先把精确定义写在前面。

2K30

TypeScript类型断言-类型声明和转换

TS中并不能判断在使用联合类型时具体是那种类型?当我们不知道是什么类型情况下要使用某个类型特有的属性或者方法,那么就可以用断言来实现,它实际上是对编辑器做了提前告知行为,但是并不能保证运行中报错。...主要有两种方式来实现,具体如下:断言形式(1)尖括号形式语法:+value,尖括号中填写具体类型。...;let length:number = (anyValue).length;//0使用断言虽然能避免编译中报错,但是却避免不了运行中报错type ClaaM = number |...ClaaM):string{ return (val).substr(0,1)}func(1)我们可以看到编辑器中没有报错,如下:但是编译成JS后,运行过程中就报错了,如下:所以除非确切知道变量数据类型...,否则不要使用类型断言,这是因为类型断言会让 TypeScript 编译器将变量当做指定类型,而不管它实际类型,在程序运行时可能有类型错误,断言需要慎用。

26910

TypeScript: 常用高级类型

,枚举类型是真实运行代码,因此枚举类型是真实存在对象,而并非仅仅只是简单类型约束。...可问题在于touch事件对象与mouse事件对象是不一样。那么我们在兼容了这两种事件回调中,如何去描述该回调事件对象呢? 通常使用 & 符号来解决这样常见,将两种类型合并为一种类型。...per: string | string[] 我们在代码编写时,希望能够自动提示对应api,typescript则不知道应该如何处理这种情况。...这种处理,就叫做类型保护。 5 索引类型 我们可以使用 keyof 来获取一个对象key对应具体值。...目标对象类型,我们不确定,因此,只能使用一个泛型变量做一个简单约束。key值类型呢?我们可以使用 keyof 从泛型对象中获取。于是又定义另外一个泛型变量 K 来接收获取结果。

1.9K10

TypeScript与Babel、webpack关系以及IDE对TS类型检查

,多么强大类型检查,最终产物都是js。...(允许类具有属性)和@babel/plugin-proposal-object-rest-spread(对象展开); preset开头就是预置组件包合集,其中@babel/preset-env表示使用了可以根据实际浏览器运行环境...为什么类型检查失效了?还记得我们前面提到babel怎么处理ts? Babel 如何处理 TypeScript 代码?它删除它。...是的,babel并没有进行类型检查,而是将各种类型移除掉以达到快速完成编译目的。那么问题来了,我们如何让babel进行类型判断呢?...babel部分处理,根类型没有根本关系,而类型检查使用到tsconfig和tsc则只作用在类型检查部分,根ts代码编译没有任何关系。

40130

TypeScript类型断言

---- 类型断言 类型断言使我们可以覆盖 TypeScript 为存储位置计算静态类型,这对于解决类型系统限制很有用。...类型断言与其他语言中类型强制转换有相似之处,但是它们不会引发异常,并且在运行时也不做任何事情(它们确实会静态执行一些少量检查)。...类型断言是不得已方法,应尽可能避免。他们(暂时)删除了静态类型系统为我们提供安全网。 注意,在 A 行中,我们还覆盖了 TypeScript 静态类型,不过是通过类型注释完成。...这种覆盖方式比类型声明要安全得多,因为你可以做事情少得多。TypeScript 类型必须能够分配给注释类型。...示例:声明一个接口 为了访问任意对象 obj 属性 .name,我们暂时将 obj 静态类型更改为 Named(A行和B行)。

3.7K40

Typescript 类型本质是什么

类型分为基础类型和引用类型,基础类型分配在栈上,而引用类型分配在堆上,之所以有引用类型是因为这种类型是复合出来,比如对象,它可能有任意多个属性,这种就放在可动态分配内存堆上,然后在栈上记录下该地址,...静态类型语言则是把类型标识保存在了代码里,也就是有静态类型系统。声明变量类型在运行时会分配相应内存空间,就会赋相同类型值,就会调用该类型有的方法,如果不是,在编译时就能检查出来。...这种同样类型变量只赋值同类型值,只做该类型允许操作就叫做类型安全,显然,动态类型类型不安全,会在运行时有各种类型相关问题,而静态类型则通过类型系统在编译期间就把类型不安全操作检查了出来进行报错...静态类型系统 3 个层次 其实静态类型系统分为 3 个层次: 纯静态类型系统 第一种就是纯静态类型系统,变量类型都是定义时声明,但有一个问题就是遇到参数类型可能是多种类型时候会比较麻烦。...总结 类型本质上是运行时变量内存大小和可对它进行操作,变量只赋值同类型值就是类型安全,动态类型在源码中没有类型信息,没法保证类型安全,而静态类型则是在源码中有类型信息,可以在编译期间检查类型错误

1.4K10

Typescript 类型本质是什么

类型分为基础类型和引用类型,基础类型分配在栈上,而引用类型分配在堆上,之所以有引用类型是因为这种类型是复合出来,比如对象,它可能有任意多个属性,这种就放在可动态分配内存堆上,然后在栈上记录下该地址,...静态类型语言则是把类型标识保存在了代码里,也就是有静态类型系统。声明变量类型在运行时会分配相应内存空间,就会赋相同类型值,就会调用该类型有的方法,如果不是,在编译时就能检查出来。...这种同样类型变量只赋值同类型值,只做该类型允许操作就叫做类型安全,显然,动态类型类型不安全,会在运行时有各种类型相关问题,而静态类型则通过类型系统在编译期间就把类型不安全操作检查了出来进行报错...静态类型系统 3 个层次 其实静态类型系统分为 3 个层次: 纯静态类型系统 第一种就是纯静态类型系统,变量类型都是定义时声明,但有一个问题就是遇到参数类型可能是多种类型时候会比较麻烦。...总结 类型本质上是运行时变量内存大小和可对它进行操作,变量只赋值同类型值就是类型安全,动态类型在源码中没有类型信息,没法保证类型安全,而静态类型则是在源码中有类型信息,可以在编译期间检查类型错误

1.6K30

TypeScript 类型体操:合并映射类型处理结果为联合类型

索引类型TypeScript常见类型,它是聚合多个元素类型对象、类、元组等都是索引类型。...它可以对索引类型索引和值做一些变换,然后产生新索引类型。...: TypeScript 也内置了很多基于映射类型实现工具类型,比如 Partial、Required 等。...总之,会了映射类型就能够对索引类型做各种变换了。 但是,这些都是对索引类型整体做变换,变换结果依然是一个索引类型。 有的时候是想把它们分开。比如这种需求: 希望能把每个索引给分开。...总结 索引类型TypeScript常见类型,可以通过映射类型语法来对它做一些修改,生成新索引类型

1.6K40

TypeScript数组类型定义

TypeScript 中声明和初始化数组也很简单,和声明数字类型和字符串类型变量也差不多,只不过在指定数组类型时要在类型后面加上一个中括号 [] 语法格式 const array_name: dataype...[] = [val, val2]; 示例 声明一个 string 类型数组 const character: string[] = ["杨过", "小龙女"]; 一维数组类型 声明一个 number..., val2, val3],[v1, v2, v3]]; // 等同于 const array_name: datatype[][] = [[val1, val2, val3]]; 多维数组类型 TypeScript...// 源具有 2 个元素,但目标仅允许 1 个。...个 建议: 在定义数组类型时候使用数组泛型定义,这样显得更直观一点 Tuple 元组类型(元组类型允许表示一个已知元素数量和类型数组)

5.3K40

TypeScript】TS类型断言-类型声明和转换(七)

TS中并不能判断在使用联合类型时具体是那种类型?当我们不知道是什么类型情况下要使用某个类型特有的属性或者方法,那么就可以用断言来实现,它实际上是对编辑器做了提前告知行为,但是并不能保证运行中报错。...主要有两种方式来实现,具体如下:断言形式(1)尖括号形式语法:+value,尖括号中填写具体类型。...;let length:number = (anyValue).length;//0使用断言虽然能避免编译中报错,但是却避免不了运行中报错type ClaaM = number |...ClaaM):string{ return (val).substr(0,1)}func(1)我们可以看到编辑器中没有报错,如下: 但是编译成JS后,运行过程中就报错了,所以除非确切知道变量数据类型...,否则不要使用类型断言,这是因为类型断言会让 TypeScript 编译器将变量当做指定类型,而不管它实际类型,在程序运行时可能有类型错误,断言需要慎用。

25010

实现TypeScript互斥类型

此时,你会怎么用TypeScript来定义这个类型?本文将带大家实现一个互斥类型来解决这个问题,欢迎各位感兴趣开发者阅读本文。 前置知识 在实现之前,我们需要先来了解几个基础知识。...对象中多属性同类型定义 有一个对象它包含5个可选属性a、b、c、d、e,他们类型都为string,大多数人定义方式应该如下所示: type obj = { a?:string; b?...: string }; never类型TypeScript中它有一个特殊类型never,它是所有类型类型,无法再进行细分,也就意味着除了其本身没有类型可以再分配给它。...接下来,我们来梳理下实现思路: 实现一个排除类型,用于从A对象类型中剔除B对象类型属性,并将排除后属性类型设为never,得到一个新对象类型。...> & T); 注意:为了类型可复用性,我们使用了泛型,对此不熟悉开发者请移步:TypeScript中文网——泛型 测试用例 我们将文章开头所说问题代入上述实现代码中,看一下它能否将其解决,如下所示

3K40

Typescript 数据类型总结

一、是什么 typescript 和 javascript几乎一样,拥有相同数据类型,另外在javascript基础上提供了更加实用类型供开发使用 在开发阶段,可以为明确变量定义为某种类型,这样...typescript就能在编译阶段进行类型检查,当类型不合符预期结果时候则会出现错误提示 二、有哪些 typescript 数据类型主要有如下: boolean(布尔类型) number(数字类型)...enum Color {Red, Green, Blue} let c: Color = Color.Green; any 可以指定任何类型值,在编程阶段还不清楚类型变量指定一个类型,不希望类型检查器对这些值进行检查而是直接让它们通过编译阶段检查...,表示一个空对象引用,而undefined表示一个没有设置值变量 默认情况下null和undefined是所有类型类型, 就是说你可以把 null和 undefined赋值给 number类型变量...); } object 对象类型,非原始类型,常见形式通过{}进行包裹 let obj:object; obj = {name: 'Wang', age: 25}; 三、总结 和javascript

2.1K31

Typescript 数据类型总结

一、是什么 typescript 和 javascript几乎一样,拥有相同数据类型,另外在javascript基础上提供了更加实用类型供开发使用 在开发阶段,可以为明确变量定义为某种类型,这样...typescript就能在编译阶段进行类型检查,当类型不合符预期结果时候则会出现错误提示 二、有哪些 typescript 数据类型主要有如下: boolean(布尔类型) number(数字类型)...enum Color {Red, Green, Blue} let c: Color = Color.Green; any 可以指定任何类型值,在编程阶段还不清楚类型变量指定一个类型,不希望类型检查器对这些值进行检查而是直接让它们通过编译阶段检查...,表示一个空对象引用,而undefined表示一个没有设置值变量 默认情况下null和undefined是所有类型类型, 就是说你可以把 null和 undefined赋值给 number类型变量...); } object 对象类型,非原始类型,常见形式通过{}进行包裹 let obj:object; obj = {name: 'Wang', age: 25}; 三、总结 和javascript

1.1K10
领券