美文网首页
第四章 联合类型

第四章 联合类型

作者: 为了_理想 | 来源:发表于2022-11-22 09:04 被阅读0次

联合类型

联合类型(Union Types)表示取值可以为多种类型中的一种。

let myFavoriteNumber: string | number;
myFavoriteNumber = 'seven';
myFavoriteNumber = 7;

联合类型使用 | 分隔每个类型。

这里的 let myFavoriteNumber: string | number 的含义是,允许 myFavoriteNumber 的类型是 string 或者 number,但是不能是其他类型。

let myFavoriteNumber: string | number;
myFavoriteNumber = true;

// index.ts(2,1): error TS2322: Type 'boolean' is not assignable to type 'string | number'.
//   Type 'boolean' is not assignable to type 'number'.

访问联合类型的属性或方法

当 TypeScript 不确定一个联合类型的变量到底是哪个类型的时候,我们只能访问此联合类型的所有类型里**(共有的属性或方法):

function getLength(something: string | number): number {
    return something.length;
}

// index.ts(2,22): error TS2339: Property 'length' does not exist on type 'string | number'.
//   Property 'length' does not exist on type 'number'.

上例中,length 不是 stringnumber 的共有属性,所以会报错。

访问 stringnumber 的共有属性是没问题的:

function getString(something: string | number): string {
    return something.toString();
}

联合类型的变量在被赋值的时候,会根据类型推论的规则推断出一个类型:

let myFavoriteNumber: string | number;
myFavoriteNumber = 'seven';
console.log(myFavoriteNumber.length); // 5
myFavoriteNumber = 7;
console.log(myFavoriteNumber.length); // 编译时报错(数字类型没有长度)

// index.ts(5,30): error TS2339: Property 'length' does not exist on type 'number'.

上例中,第二行的 myFavoriteNumber 被推断成了 string,访问它的 length 属性不会报错。

而第四行的 myFavoriteNumber 被推断成了 number,访问它的 length 属性时就报错了。

相关文章

  • TypeScript06(类型断言 | 联合类型 | 交叉类型)

    联合类型 函数使用联合类型 交叉类型 多种类型的集合,联合对象将具有所联合类型的所有成员 类型断言 语法:值 as...

  • TS学习笔记(7)-联合类型

    联合类型 ========= 知识点 联合类型是指可以包含多种数据类型 不推荐使用 联合类型的定义方法 联合类型的...

  • TypeScript入门基础(联合类型、对象类型)

    联合类型联合类型(Union Types)表示取值可以为多种类型中的一种。 联合类型使用 | 分隔每个类型。 这里...

  • typescript入门-高级类型

    交叉类型 联合类型 联合类型表示一个值可以是几种类型之一 只能访问此联合类型的所有类型里共有的成员 类型区分 通过...

  • TS 联合类型和交叉类型

    联合类型 通过 | 将变量设置多种类型,赋值时可以根据设置的类型来赋值。举例说明: 联合基础类型 联合对象类型 可...

  • 联合类型 |

    A | B 是并集的意思,既可以是A也可以是B,也可以是A和B的交集 但是当 type A = string | ...

  • 高级TypeScript

    1、联合类型和类型保护 联合类型:一个变量可能有两种或两种以上的类型。 类型保护:联合类型的具体实例需...

  • typescript语法精讲一(笔记)

    - 使用联合类型 联合类型保证传入的是联合中的某一个类型的值即可 -可选类型补充 可选类型可以看作是 类型 和 u...

  • TypeScript中的约束与类型断言(2)

    一、TypeScript中的联合类型 联合类型表示取值可以为多种类型中的一种 只能访问此联合类型的所有类型里共有的...

  • flow中文文档(八)

    联合类型 不相交联合 精确的不相交联合 联合类型 有时,创建一个其他类型之一的类型很有用。例如,您可能希望编写一个...

网友评论

      本文标题:第四章 联合类型

      本文链接:https://www.haomeiwen.com/subject/hfakhrtx.html