Generando tipos TypeScript a partir de un objeto anidado

Estoy intentando generar varios tipos a partir de un objeto, pero me he quedado completamente bloqueado. Incluso la forma no-TS (generando primero objetos/arreglos más simples) y creando tipos a partir de ellos no parece funcionar. Estoy tratando de evitar repetir la información almacenada en el objeto.

¡Aprecio mucho cualquier ayuda!

// Objeto del cual quiero generar tipos
const PRODUCT_SECTIONS = {
fruit: {
name: “Fruta deliciosa”,
products: {
banana: “Banana”,
apple: “Manzana”,
},
},
vegetables: {
name: “Verduras frescas”,
products: {
mixedGreens: “Mezcla de vegetales”,
lettuce: “Lechuga”,
cucumbers: “Pepinos”,
},
},
soda: {
name: “Soda de calidad”,
products: {
coke: “Coca-Cola”,
sprite: “Sprite”,
},
},
} as const;

// Tipo deseado 1: todos los nombres de sección
type SECTION_NAME = “Fruta deliciosa” | “Verduras frescas” | “Soda de calidad”;

// Tipo deseado 3: selección de productos permitiendo 1 producto por sección
type SELECTED_PRODUCTS_STATE = {
fruit: “Banana” | “Manzana”;
vegetables: “Mezcla de vegetales” | “Lechuga” | “Pepinos”;
soda: “Coca-Cola” | “Sprite”;
};

davy.ai

July 25, 2023 at 9:12 am

Para generar los tipos deseados, puedes usar la palabra clave keyof para extraer las claves del objeto PRODUCT_SECTIONS y la palabra clave typeof para obtener el tipo de cada valor de clave. Aquí tienes una solución de ejemplo:

// Extraer los nombres de las secciones de las claves del objeto
type SECTION_KEY = keyof typeof PRODUCT_SECTIONS;

// Extraer los nombres de los productos de los valores del objeto
type PRODUCT_KEY<t extends="" section_key=""> = keyof typeof PRODUCT_SECTIONS[T]['products'];

// Tipo deseado 1: todos los nombres de las secciones
type SECTION_NAME = typeof PRODUCT_SECTIONS[SECTION_KEY]['name'];

// Tipo deseado 2: todos los productos
type PRODUCT = typeof PRODUCT_SECTIONS[SECTION_KEY]['products'][PRODUCT_KEY<section_key>];

// Tipo deseado 3: selección de producto permitiendo 1 producto por sección
type SELECTED_PRODUCTS_STATE = {
  [key in SECTION_KEY]: PRODUCT_KEY<key>;
};

Explicación:

SECTION_KEY es un tipo genérico que representa cualquier clave en el objeto PRODUCT_SECTIONS.
PRODUCT_KEY<t> es un tipo genérico que representa cualquier clave en el objeto products del valor PRODUCT_SECTIONS[T], donde T es una SECTION_KEY.
SECTION_NAME es el tipo de la propiedad name en cualquier valor PRODUCT_SECTIONS[T].
PRODUCT es el tipo de cualquier valor PRODUCT_SECTIONS[T]['products'][K], donde T es una SECTION_KEY y K es una PRODUCT_KEY<t>.
SELECTED_PRODUCTS_STATE es un tipo de objeto con claves que coinciden con los valores de SECTION_KEY y valores que son tipos PRODUCT_KEY<key>, donde key es la SECTION_KEY actual. Esto garantiza que solo se pueda seleccionar un producto por sección.

Nota: Es importante usar la afirmación as const en el objeto PRODUCT_SECTIONS para preservar los tipos literales de sus valores.

Answer

davy.ai

July 25, 2023 at 9:12 am
Para generar los tipos deseados, puedes usar la palabra clave keyof para extraer las claves del objeto PRODUCT_SECTIONS y la palabra clave typeof para obtener el tipo de cada valor de clave. Aquí tienes una solución de ejemplo:
```
// Extraer los nombres de las secciones de las claves del objeto
type SECTION_KEY = keyof typeof PRODUCT_SECTIONS;

// Extraer los nombres de los productos de los valores del objeto
type PRODUCT_KEY<t extends="" section_key=""> = keyof typeof PRODUCT_SECTIONS[T]['products'];

// Tipo deseado 1: todos los nombres de las secciones
type SECTION_NAME = typeof PRODUCT_SECTIONS[SECTION_KEY]['name'];

// Tipo deseado 2: todos los productos
type PRODUCT = typeof PRODUCT_SECTIONS[SECTION_KEY]['products'][PRODUCT_KEY<section_key>];

// Tipo deseado 3: selección de producto permitiendo 1 producto por sección
type SELECTED_PRODUCTS_STATE = {
  [key in SECTION_KEY]: PRODUCT_KEY<key>;
};
```
Explicación:
- SECTION_KEY es un tipo genérico que representa cualquier clave en el objeto PRODUCT_SECTIONS.
- PRODUCT_KEY<t> es un tipo genérico que representa cualquier clave en el objeto products del valor PRODUCT_SECTIONS[T], donde T es una SECTION_KEY.
- SECTION_NAME es el tipo de la propiedad name en cualquier valor PRODUCT_SECTIONS[T].
- PRODUCT es el tipo de cualquier valor PRODUCT_SECTIONS[T]['products'][K], donde T es una SECTION_KEY y K es una PRODUCT_KEY<t>.
- SELECTED_PRODUCTS_STATE es un tipo de objeto con claves que coinciden con los valores de SECTION_KEY y valores que son tipos PRODUCT_KEY<key>, donde key es la SECTION_KEY actual. Esto garantiza que solo se pueda seleccionar un producto por sección.
Nota: Es importante usar la afirmación as const en el objeto PRODUCT_SECTIONS para preservar los tipos literales de sus valores.

Comments are closed.

es.davy.ai

¿Tienes una pregunta?

Generando tipos TypeScript a partir de un objeto anidado

Answer

davy.ai