联合类型

2023年03月02日

柏拉文

越努力，越幸运

TypeScript联合类型 表示一个值可以是几种类型之一。 我们用竖线|分隔每个类型。如果一个值是联合类型，我们只能访问此联合类型的所有类型里共有的成员。

基础数据联合类型

基础数据类型联合类型

const x: number|string = 3;

基础数据类型访问联合类型中的非共有成员报错

function foo(x:number|string):number{
  return x;  // TypeScript 报错: Type 'string | number' is not assignable to type 'number'. Type 'string' is not assignable to type 'number'.ts(2322)
}

基础数据类型只能访问联合类型中的共有成员

function foo(x:number|string):number|string{
  return x;
}

引用数据联合类型

引用数据类型联合类型

interface TypeA {
  name: string,
  say():void
}

interface TypeB {
  name: string
  run():void
}

const x: TypeA | TypeB = {
  name: '哈哈',
  say(){},
  run(){}
}

引用数据类型访问联合类型中的非共有成员报错

interface TypeA {
  say:()=>{}
}

interface TypeB{
  run:()=>{}
}

function foo(argu: TypeA | TypeB){
  argu.say(); // TypeScript 报错: Property 'say' does not exist on type 'TypeA | TypeB'Property 'say' does not exist on type 'TypeB'.ts(2339)
}

引用数据类型只能访问联合类型中的共有成员

interface TypeA {
  name:string,
  say:()=>{}
}

interface TypeB{
  name:string
  run:()=>{}
}

function foo(argu: TypeA | TypeB){
  argu.name = '放到';
}