JavaScrpt typeOf TypeScript - 使用 typeof 从数据中获取类型

确保变量设置的值与预期相符的一个好方法是设置变量的特定类型。

如果您已经在对象或数组中拥有数据，以下方法非常适合创建您的类型！

假设您有以下数据：

const data = {
  value: 123,
  text: 'text'
};

然后，您可以使用以下命令创建基于该类型的类型：

type Data = typeof data;
// type Data = {
//   value: number;
//   text: string;
// }

您可以对嵌套对象执行相同的操作：

const data = {
  value: 123,
  text: 'text',
  subData: {
    value: false
  }
};
type Data = typeof data;
// type Data = {
//   value: number;
//   text: string;
//   subData: {
//     value: boolean;
//   };
// }

从 TypeScript 3.4 开始，如果您有一个字符串数组，则可以执行以下操作（请注意as const）：

const data = ['text 1', 'text 2'] as const;
type Data = typeof data[number];
// type Data = "text 1" | "text 2"

也可以从带有对象的数组中获取类型：

const locales = [
  {
    locale: 'se',
    language: 'Swedish',
  },
  {
    locale: 'en',
    language: 'English',
  }
] as const;
type Locale = typeof locales[number]['locale'];
// type Locale = "se" | "en"

也可以从键中获取类型：

const currencySymbols = {
  GBP: '£',
  USD: '$',
  EUR: '€',
}
type CurrencySymbol = keyof typeof currencySymbols;
// type CurrencySymbol = "GBP" | "USD" | "EUR"

as const关于vs 使用的注意事项<const>。它们的工作方式相同，但<const>在 .tsx 文件 (React) 中会失败。

const data = ['text 1', 'text 2'] as const;
// is the same as
const data = <const>['text 1', 'text 2'];

文章来源：https://dev.to/andreasbergqvist/typescript-get-types-from-data-using-typeof-4b9c