如何基于options对象为嵌套数组myObj声明TypeScript类型

问题描述 #

现有如下嵌套数组对象：

myObj = [ [ x, y, z ], [ k, l ], [ i ] ]

其中所有元素（x、y、z、k、l、i等）的值均来自另一个对象options的任意属性值：

options = { A: 'red', B: 'green', C: 'blue' }

需要声明对应的TypeScript类型MyType，实现myObj: MyType = [ [ ... ] ]的类型约束。

解决方案 #

可以通过以下步骤实现类型声明：

1. 提取options的属性值类型
   利用TypeScript的typeof和keyof操作符，获取options所有属性值的联合类型：

   type OptionValue = typeof options[keyof typeof options];
   

   这会得到具体的联合类型：'red' | 'green' | 'blue'。

2. 定义嵌套数组类型MyType
   由于myObj是一个数组，其每个元素又是任意长度的OptionValue类型数组，因此MyType可以声明为：

   type MyType = OptionValue[][];
   

完整示例代码 #

const options = { A: 'red', B: 'green', C: 'blue' };

type OptionValue = typeof options[keyof typeof options];
type MyType = OptionValue[][];

// 符合类型约束的赋值
const myObj: MyType = [
  ['red', 'green', 'blue'],
  ['green', 'red'],
  ['blue']
];

内容的提问来源于stack exchange，提问作者blagus