Как задать определенные ключи объекту?

Question

[dmitry-toster]

Есть парочка типов:

type TFruit = 'apple' | 'banana'
type TFruitProps = 'color' | 'size'

Как сделать такую структуру валидной?

const food = {
    apple: {
        color: 'red'
    }
};

т.е свойство объекта food = любое значение типа TFruit
значение этого свойства = объект с ключом типа TFruitProps
Я это пытаюсь сделать через Record

type TFood = {
    [key in TFruitProps]: string
}

const food:Record<TFruit, TFood> = {
    apple: {
        color: 'red'
    }
}

Однако, TS ругается на недостающий ключ banana, хотя я указал его через разделитель |. Как сделать его необязательным?
Playground

Answer 1

[Дмитрий Беляев]

type TFood = Partial<Record<TFruit, Partial<Record<TFruitProps, string>>>>;

Comments

[dmitry-toster]

да, с вопросительным знаком это выглядит логично, но почему-то у меня все равно ошибка сохраняется:

Property 'banana' is missing in type '{ apple: { color: string; size: string; }; }' but required in type 'Record'.(2741)

[Дмитрий Беляев]

dmitry-toster, поправил

[dmitry-toster]

Дмитрий Беляев, спасибо за помощь, а вы не проверяли в песочнице? с поправленным ответом оно все еще не работает

[Дмитрий Беляев]

dmitry-toster, https://www.typescriptlang.org/play?#code/C4TwDgpg...

[dmitry-toster]

Дмитрий Беляев, большое спасибо

Answer 2

[profesor08]

Придумай другой способ организации своих данных. Потому что после получения ответа на этот вопрос, ты прибежишь со следующим в виде "А как обрабатывать такое г****"

Ответ на вопрос в следующем коде.

type TFruit = 'apple' | 'banana'
type TFruitProps = 'color' | 'size'

type Food = {
  [key in TFruit]?: {
    [key in TFruitProps]?: string;
  };
}

const redApple: Food = {
    apple: {
      color: "red"
    }
};

const bigApple: Food = {
    apple: {
      size: "big",
    }
};

const redBigApple: Food = {
    apple: {
      size: "big",
      color: "red"
    }
};

const redBanana: Food = {
    banana: {
      color: "red"
    }
};

const bigBanana: Food = {
    banana: {
      size: "big",
    }
};

const redBigBanana: Food = {
    banana: {
      size: "big",
      color: "red"
    }
};

const redBigGomunkul: Food = {
    apple: {
      size: "big",
      color: "red"
    },
    
    banana: {
      size: "big",
      color: "red"
    }
}

const wtf: Food = {}

Comments

[profesor08]

Лучше будет сделать коллекцию и работать с ней.

type Fruit = Partial<{
  color: string;
  size: string;
}>;

interface Apple extends Fruit {
  name: "apple";
}

interface Banana extends Fruit {
  name: "banana";
}

type Food = Apple | Banana;

const fruits: Food[] = [
  {
    name: "apple",
    color: "red",
  },
  {
    name: "banana",
    size: "big",
  }
];

const limes: Food[] = [
  {
    name: "lime", // error: Type '"lime"' is not assignable to type '"apple" | "banana"'
  }
];

[dmitry-toster]

profesor08, не вижу ничего сложного в своей структуре, чтобы ее переделывать

type Food = {
  [key in TFruit]?: {
    [key in TFruitProps]?: string;
  };
}

вот это то что мне и было нужно, спасибо.