Dynamically add Properties to an Object in TypeScript

使用索引签名为对象动态添加属性，例如
const obj: {[key: string]: any} = {} . 当我们事先不知道类型属性的所有名称及其值的类型时，使用索引签名。

interface Person {
  [key: string]: any;
const obj: Person = {};
obj.name = 'Tom';
obj.age = 30;
该{[key: string]: any}语法是 TypeScript 中的

，当我们事先不知道类型属性的所有名称和值的形状时使用。
{[key: string]: string}您可能还会在示例中看到索引签名。它代表一个键值结构，当用 a 索引时string返回一个 type 的值string。
如果字符串键的值any在索引签名中设置为 ，您可以向任何类型的对象添加属性，因为任何东西都比any.
索引.ts
interface Person {
  [key: string]: any;
  age: number;
  name: string;
  country?: string;
const obj: Person = {
  name: 'Tom',
  age: 30,
obj.country = 'Chile';
obj.language = 'TypeScript';
这是缩小您提前知道的某些属性类型的好方法。
例如，如果我尝试将age属性设置为 a string，类型检查器会抛出错误，因为它需要一个number.
索引.ts
interface Person {
  [key: string]: any;
  age: number;
  name: string;
  country?: string;
const obj: Person = {
  name: 'Tom',
  age: 30,
// ⛔️ Error: Type 'string' is not
// assignable to type 'number'.ts(2322)
obj.age = '100';
我们已经将该age属性的类型设置为number，因此类型检查器可以帮助我们发现应用程序中的错误。
一种更新的实现方法是使用

Record

实用程序类型。
使用Record实用程序类型向对象动态添加属性，例如

const obj: Record<string, any>. 实用程序类型构造一个对象类型，其Record键和值是特定类型的。
索引.ts
const obj: Record<string, any> = {
  name: 'Tom',
obj.age = 30;
obj.country = 'Chile';
我们键入上面的对象以具有 type 的键和 type 的string值

any。
interface EmployeeData extends Record<string, any> {
  role: string;
  salary: number;
  color?: string;
const employees: Record<string, EmployeeData> = {
  tom: { role: 'accountant', salary: 10, color: 'blue' },
  alice: { role: 'manager', salary: 15 },
// ⛔️ Type 'number' is not
// assignable to type 'string'.ts(2322)
employees.tom.role = 100;
// ✅ still works
employees.tom.hello = 'world';
该接口EmployeeData从Record具有字符串键和any类型值的构造类型扩展而来。