TypeScript-字面量类型和TypeScript-可辨识联合、可辨识联合完整性检查

2023-09-29 16:44:26 浏览数 (1)

字面量概述

字面量就是源代码中一个 固定的值 例如数值字面量: 1, 2, 3, ... 例如字符串字面量: 'a', 'abc', ...

  • 在 TS 中我们可以把字面量作为具体的类型来使用:
  • 当使用字面量作为具体类型时, 该类型的取值就必须是该字面量的值
代码语言:typescript复制
type MyNum = 1;
let value1: MyNum = 1;
let value2: MyNum = 2;

如上的代码在编译器当中 let value2: MyNum = 2; 是报错的,取值就必须是该字面量的值

可辨识联合概述

具有共同的 可辨识特征 一个类型别名, 包含了具有共同的 可辨识特征 的类型的 联合

关于什么是共同的可辨识特征如下:

代码语言:typescript复制
// 正方形
interface Square {
    // 共同的可辨识特征
    kind: "square";
    size: number;
}

// 长方形
interface Rectangle {
    // 共同的可辨识特征
    kind: "rectangle";
    width: number;
    height: number;
}

// 圆圈
interface Circle {
    // 共同的可辨识特征
    kind: "circle";
    radius: number;
}

假如我现在要求如上这三个图形的面积,实现代码分别如下:

代码语言:typescript复制
// 正方形
interface Square {
    // 共同的可辨识特征
    kind: "square";
    size: number;
}

// 长方形
interface Rectangle {
    // 共同的可辨识特征
    kind: "rectangle";
    width: number;
    height: number;
}

// 圆圈
interface Circle {
    // 共同的可辨识特征
    kind: "circle";
    radius: number;
}

type Shape = (Square | Rectangle | Circle);

function area(s: Shape) {
    switch (s.kind) {
        case "square":
            return s.size * s.size;
        case "rectangle":
            return s.width * s.height;
        case "circle":
            // ** 是ES7中推出的幂运算符
            return Math.PI * s.radius ** 2;
    }
}

如上代码中的 Shape 就是一个 可辨识联合

  • 因为: 它的取值是一个 联合
  • 因为: 这个联合的每一个取值都有一个共同的 可辨识特征

可辨识联合完整性检查

在企业开发中, 如果想对可辨识联合的完整性进行检查, 主要有两种实现方式分别如下

方式一

给函数添加返回值 开启 strictNullChecks

如果实现的不完整在编译器当中是会进行报错的:

image-20211204205827858image-20211204205827858
代码语言:typescript复制
// 正方形
interface Square {
    // 共同的可辨识特征
    kind: "square";
    size: number;
}

// 长方形
interface Rectangle {
    // 共同的可辨识特征
    kind: "rectangle";
    width: number;
    height: number;
}

// 圆圈
interface Circle {
    // 共同的可辨识特征
    kind: "circle";
    radius: number;
}

type Shape = (Square | Rectangle | Circle);

function area(s: Shape): number {
    switch (s.kind) {
        case "square":
            return s.size * s.size;
        // case "rectangle":
        //     return s.width * s.height;
        case "circle":
            return Math.PI * s.radius ** 2;
    }
}
image-20211204205842818image-20211204205842818

实现完整就不会报错:

image-20211204210127120image-20211204210127120

方式二

添加 default never

如果实现的不完整在编译器当中是会进行报错的:

image-20211204210005497image-20211204210005497
代码语言:typescript复制
// 正方形
interface Square {
    // 共同的可辨识特征
    kind: "square";
    size: number;
}

// 长方形
interface Rectangle {
    // 共同的可辨识特征
    kind: "rectangle";
    width: number;
    height: number;
}

// 圆圈
interface Circle {
    // 共同的可辨识特征
    kind: "circle";
    radius: number;
}

type Shape = (Square | Rectangle | Circle);

function MyNever(x: never): never {
    throw new Error('可辨识联合处理不完整'   x);
}

function area(s: Shape): number {
    switch (s.kind) {
        case "square":
            return s.size * s.size;
        // case "rectangle":
        //     return s.width * s.height;
        case "circle":
            return Math.PI * s.radius ** 2;
        default:
            return MyNever(s)
    }
}

实现完整就不会报错:

image-20211204210053977image-20211204210053977

最后

本期结束咱们下次再见

0 人点赞