Búsqueda de sitios web

javascript - ¿Con qué puedo reemplazar 'any' al declarar un tipo de objeto en Typescript?

class ResistorColor 
{
  private colors: string[]

  public colorValues: any = {
    grey: 8,
    white: 9
  }
}

'any' allí significa que Typescript no debería preocuparse por su tipo.

Quiero reemplazar 'any' por un tipo. ¿Cómo damos tipos adecuados a tales objetos en Typescript?

Respuesta #1

No quieres usar any excepto en los casos en que absolutamente tengas que hacerlo. any significa que un tipo puede ser literalmente cualquier cosa, por lo que no tienes información sobre cuál es el tipo. TypeScript no puede verificar el uso incorrecto de la variable porque has dicho "cualquier cosa vale".

Hay muchas formas de escribir esto correctamente, pero aquí hay una idea. Puedes definir un type Color que sea la unión de los nombres string de todos los colores válidos. Tu private colors es un arreglo de estos, por lo que sería Color[]. Tu public colorValues es un mapeo de colores a números, por lo que puedes usar el tipo de utilidad incorporado Record para describirlo como Record<Color, number>, que es un objeto donde las claves son del tipo Color y los valores son del tipo number. (Si no todos los colores están presentes en el objeto, entonces usarías Partial<Record<Color, number>> para un mapeo incompleto).

type Color = 'grey' | 'white';

class ResistorColor 
{
  private colors: Color[] = []; // initial value avoids "not assigned in the constructor" error

  public colorValues: Record<Color, number> = {
    grey: 8,
    white: 9
  }
}

Enlace de Playground de Typescript

Podría tener sentido obtener el type Colors usando typeof en un array de nombres de colores, pero no sé en qué parte de tu código tendrías un array u objeto con todos los colores. Esto podría tener sentido si, por ejemplo, inicializas los colorValues con algún valor base.

const colors = ['grey', 'white'] as const; // use as const to preserve string literals

type Color = (typeof colors)[number];  // indexed access by [number] to get the element type
// resolves to: type Color = "grey" | "white"

class ResistorColor {
    public colorValues: Record<Color, number>;

    constructor(baseVal: number = 0) {
        this.colorValues = {} as Record<Color, number>; // need to make an `as` assertion when starting with an incomplete object
        colors.forEach(
            color => this.colorValues[color] = baseVal
        );
    }
}

Enlace de Playground de Typescript

Respuesta #2

Como otros han mencionado, usar any como anotación de tipo en TypeScript no ayuda a escribir código seguro. Es mejor evitar usar el tipo any y dejar que TypeScript intente inferir el tipo mediante la Inferencia de Tipos.

Si quisieras proporcionar una anotación de tipo explícita para la variable colorValues. Podrías crear una interfaz o usar un alias de tipo, que actúa como un plano para definir las propiedades que esperas que el objeto tenga.

interface Colors {
  grey: number;
  white: number;
}

public colorValues: Colors = {
  grey: 8,
  white: 9
}

Artículos relacionados