TypeScript中将含数组的对象拆分生成新属性的无编译错误最优方案

类型定义 #

首先定义明确的类型避免编译报错：

// 原始API对象类型
interface RawApi {
  accessToken: string[];
  accessSecret: string[];
}

// 扩展后API对象类型，继承原始属性同时适配动态生成的用户属性
interface ExtendedApi extends RawApi {
  // 模板字面量索引签名，匹配 {用户名}_access / {用户名}_secret 格式的属性
  [key: `${string}_${'access' | 'secret'}`]: string;
}

转换逻辑实现 #

function extendApi(rawApi: RawApi): ExtendedApi {
  // 浅拷贝原始对象，保留原有属性
  const extendedApi = { ...rawApi } as ExtendedApi;

  // 处理accessToken数组，生成xxx_access属性
  rawApi.accessToken.forEach(item => {
    const [username, token] = item.split('::');
    // 异常格式兼容，避免空值赋值
    if (username && token) {
      extendedApi[`${username}_access`] = token;
    }
  });

  // 处理accessSecret数组，生成xxx_secret属性
  rawApi.accessSecret.forEach(item => {
    // 兼容原始数组中存在单冒号分隔的异常格式
    const splitSymbol = item.includes('::') ? '::' : ':';
    const [username, secret] = item.split(splitSymbol);
    if (username && secret) {
      extendedApi[`${username}_secret`] = secret;
    }
  });

  return extendedApi;
}

使用示例 #

const rawApi: RawApi = {
  accessToken: ['user1::aaaaa', 'user2::bbbbb'],
  accessSecret: ['user1:aaaaa', 'userb::bbbbb']
};

const finalApi = extendApi(rawApi);
// 输出符合要求的扩展后对象
console.log(finalApi);

补充说明 #

• 你给出的最终示例中的user2_secret属于笔误，按你提供的原始accessSecret数组内容，实际会生成userb_secret，如果需要做用户名映射可以在分割后额外加映射逻辑即可
• 模板字面量索引签名要求TS版本≥4.1，如果你使用更低版本的TS，可以把ExtendedApi的索引签名替换为普通字符串索引[key: string]: string即可正常编译

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