Início / coding / Perguntas / 79574297
Accepted
JhonRM
Asked: 2025-04-15 10:36:12 +0800 CST

Resolver dinamicamente o tipo de propriedade aninhada com base em literal de string

  • 772

Estou procurando uma maneira de resolver dinamicamente um tipo de propriedade em tempo de compilação com base em uma string literal. Tentei usar uniões discriminadas e, embora funcione na maioria das vezes, as mensagens de erro do TypeScript são um tanto confusas e enganosas.

Aqui está um exemplo simplificado:

export type EntityTypes = "Cow" | "Dog";

export interface EntityCowDetails { milkQuantity: number, herdId: number }

export interface EntityDogDetails { barkVoiceId: number }

export type EntityDetails<T extends EntityTypes> =
  T extends "Cow"
    ? EntityCowDetails
    : T extends "Dog"
      ? EntityDogDetails
      : never;

export interface EntityEntry<T extends EntityTypes> {
  primaryKey: string;
  displayText: string;
  details: EntityDetails<T>;
}

export interface Entity<T extends EntityTypes> {
  entityType: T;
  entities: EntityEntry<T>[];
}

export type DogEntity = Entity<"Dog">;
export type CowEntity = Entity<"Cow">;

export interface ServerResponse {
  entitiesContainer: (
    | DogEntity
    | CowEntity
  )[];
}

Agora imagine que eu tenho um objeto como este:

const response: ServerResponse = {
  entitiesContainer: [
    {
      entityType: "Dog",
      entities: [
        {
          primaryKey: "23",
          displayText: "Luna",
          details: {
            barkVoiceId: 2,
          },
        },
      ],
    },
  ],
};

Isso funciona bem. Mas se eu acidentalmente fornecer um campo de outra entidade (por exemplo, milkQuantityda vaca), recebo um erro confuso:

details: {
  milkQuantity: 10,
}

TypeScript reclama:

Property 'herdId' is missing in type '{ milkQuantity: number; }' but required in type 'EntityCowDetails'

Então, se eu tentar "consertar" adicionando todos os campos específicos da vaca, recebo outro erro:

Object literal may only specify known properties, and 'milkQuantity' does not exist in type 'EntityDogDetails'

essa última mensagem deve ser sempre o erro, independentemente de eu adicionar propriedades de outras entidades?

Existe uma maneira melhor de estruturar isso para que os tipos sejam resolvidos de forma mais intuitiva e essas mensagens de erro enganosas sejam evitadas?

Além disso, embora eu entenda que isso pode ser possível usando herança em vez desse mapeamento condicional, essa é uma abordagem melhor neste caso?

typescript

1 respostas

  1. Best Answer

    Aqui está uma reprodução mais curta do seu problema:

    type X = { type: "x", data: { x1: string, x2: string } }
type Y = { type: "y", data: { y1: string, y2: string } }

const z: X | Y = { type: "x", data: { y1: "abc" } };
//   ---------------------->  ~~~~                         
// Property 'y2' is missing in type '{ y1: string; }' 
// but required in type '{ y1: string; y2: string; }'.

    Este é efetivamente um recurso ausente do TypeScript, descrito em microsoft/TypeScript#40934 . Se você estiver atribuindo um valor inválido a um tipo de união , isso significa que ele não poderá ser atribuído a cada membro da união.

    O TypeScript poderia dizer "it isn't assignable to X | Y: it isn't an Xbecause x1and x2are missing…, and it isn't a Ybecause y2is missing and because typeis wrong", mas seria muito prolixo listar todas as maneiras pelas quais a atribuição falha. Ele apenas escolhe uma. Não é "errado" fazer uma escolha arbitrária, mas poderia ser confuso se a escolha feita não estiver relacionada à intenção do desenvolvedor.

    Muitas vezes, não é possível saber a intenção do desenvolvedor, então não há muito o que fazer. Mas, no caso de uma união discriminada, isso realmente deveria ser possível... a propriedade discriminante type: "x"corresponde apenas a X, então o TypeScript deveria, idealmente, falar sobre como o restante do objeto não corresponde a X.

    Mas, infelizmente, isso nem sempre acontece. O problema em microsoft/TypeScript#40934 é uma manifestação disso, e seu exemplo é outra. A união já está discriminada, mas o mecanismo de relatório de erros não utiliza essa informação.

    Por enquanto, esse é apenas um recurso que está faltando e, se você quiser evitar o problema, precisará refatorar seu código de alguma forma.

    Há muitas maneiras de fazer isso, e não fica claro na formulação da pergunta como se julgaria qual seria a melhor abordagem. Se você quiser manter a estrutura geral do seu código, poderá usar uma função auxiliar genérica que apenas retorne sua entrada, como

    const entity = <T extends EntityTypes>(
  e: Entity<T>) => e

    porque quando você chama tal função, o TypeScript irá inferir Tcom base no discriminante, e então você definitivamente só receberá uma mensagem de erro relacionada a isso:

    const response: ServerResponse = {
  entitiesContainer: [entity({
    entityType: "Dog",
    entities: [{
      primaryKey: "23",
      displayText: "Luna",
      details: {
        milkQuantity: 10, // error!
        //~~~~~~~~~~ 
        // Object literal may only specify known properties, 
        // and 'milkQuantity' does not exist in type 'EntityDogDetails'.
      }
    }]
  })]
};

    Você pode mover essa função auxiliar para qualquer nível do seu código (por exemplo, function serverResponse<T extends EntityTypes[]>(entitiesContainer: ⋯) ou desmembrá-la para que aceite partes da entrada (por exemplo, function entity(entityType, entities)), dependendo do que melhor se adequar ao caso de uso subjacente. Muitas vezes, já existe uma função que aceita um valor do tipo relevante, e você pode torná -la genérica. Os detalhes estão fora do escopo da pergunta, conforme formulada.

    Link do playground para o código

    • 1

relate perguntas