主页 / coding / 问题 / 78896649
Accepted
Marcus Junius Brutus
Asked: 2024-08-21 19:15:33 +0800 CST

类型缩小在 switch 语句中不起作用

  • 772

为什么下面的代码没有经过类型检查（TypeScript 5.5.4）：

    type ValidationResult$Type = 'success' | 'invalid_or_expired_token' 
    export type ValidationResult = {
      type: 'success'
      token_info: object
    } | {
      type: 'invalid_or_expired_token'
    };
    
    const x: ValidationResult = undefined as unknown as ValidationResult;
    
    const {type}: {type: ValidationResult$Type} = x;
    
    switch (type) {
        case 'success':
        const {token_info} = x;
        break;
        case 'invalid_or_expired_token':
        break;
    }

而下面更简单的代码可以做到：

// type ValidationResult$Type = 'success' | 'invalid_or_expired_token' 
export type ValidationResult = {
  type: 'success'
  token_info: object
} | {
  type: 'invalid_or_expired_token'
};

const x: ValidationResult = undefined as unknown as ValidationResult;

// const {type}: {type: ValidationResult$Type} = x;
const {type} = x;

switch (type) {
    case 'success':
    const {token_info} = x;
    break;
    case 'invalid_or_expired_token':
    break;
}

操场

typescript

1 个回答

  1. Best Answer

    在此演示中，你可以看到两种情况：

    一个）

    function f1() {
  const {type} = x;
  switch (type) { // type is "success" | "invalid_or_expired_token"
      case 'success':
        const test1 = x.token_info; // OK
        break;
      case 'invalid_or_expired_token':
        const test2 = x.token_info; // Error
        break;
  }
}

    在这种情况下，type是"success" | "invalid_or_expired_token"。当 TypeScript 在进行控制流分析时，它能够看到 来自type，x.type那么 TS 足够聪明，能够猜测如果x.type是"success"，那么x具有属性token_info。

    B）

    function f2() {
  type ValidationResult$Type = ValidationResult['type'];
  const {type}: {type: ValidationResult$Type} = x;
  switch (type) { // type is "success" | "invalid_or_expired_token"
      case 'success':
        const test1 = x.token_info; // Error
        break;
      case 'invalid_or_expired_token':
        const test2 = x.token_info; // Error
        break;
  }
}

    在这种情况下，type也是"success" | "invalid_or_expired_token"。当 TypeScript 进行控制流分析时，它无法看到type来自x.type。您的注释{type: ValidationResult$Type}优先于从 推断x，那么 TS 无法将这些点连接起来并猜测如果type是"success"，则x具有 属性token_info。

    这个故事的寓意是，您应尽可能避免添加手动类型注释。

    • 1

相关问题