TypeScript中如何对Object类型变量执行赋值与取值操作？

现有代码存在的问题 #

• 未初始化变量直接操作，会触发运行时报错
  prepareRequest函数内仅声明了request: AccountRequestInterface类型的变量，没有给它赋初始值，此时request的值为undefined，直接给request.additionalData赋值会抛出运行时错误：Cannot set properties of undefined。同时该函数的入参本身就是AccountRequestInterface类型的Request，不需要额外重复声明同名变量。
• object类型不支持索引操作，会触发编译错误
  TypeScript中的object类型仅代表「非原始类型的值」，没有定义任何属性和索引签名，不管是赋值后读取属性，还是用["consumerID"]的方式索引取值，编译器都会抛出类型错误，无法通过编译。
• 代码里的deummy是拼写错误，正确应为dummy。

修复方案 #

第一步：调整类型定义 #

如果你需要additionalData支持任意字符串键的存取，可以用索引签名或者TS内置的Record工具类型：

export interface AccountRequestInterface {
  // 写法1：索引签名，key为字符串，值为任意类型
  additionalData: {[key: string]: any};
  // 写法2：用Record工具类型，等价于上面的写法
  // additionalData: Record<string, any>;
}

如果你的additionalData结构是固定的，只有consumerID这一个字段，建议直接定义为明确的结构类型，能获得更严格的类型校验：

export interface AccountRequestInterface {
  additionalData: {
    consumerID: number;
  };
}

注意AccountServiceResponseAdditionalDataInterface接口里的additionalData也需要同步调整为相同的类型定义。

第二步：调整业务逻辑 #

修改prepareRequest的逻辑，要么直接操作入参，要么正确初始化新的返回对象：

prepareRequest(Request: AccountRequestInterface): AccountRequestInterface {
  // 直接修改入参的写法
  const additionalData = {"consumerID": 123456};
  Request.additionalData = additionalData;
  return Request;

  // 如果需要返回新对象的写法，先初始化再赋值
  // const request: AccountRequestInterface = {
  //   additionalData: {"consumerID": 123456}
  // };
  // return request;
}

调整完类型定义后，processResponse中的取值逻辑就可以正常运行，dummy可以拿到对应的consumerID值：

processResponse(eventType: EventType, response: AccountServiceResponseAdditionalDataInterface): void {
  // 此时不会报类型错误，可以正常取值
  let dummy = response.additionalData["consumerID"];
}

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