将JavaScript代码转换为TypeScript时报错，求助正确转换方案

完整转换后代码 #

// 定义Profile对象的类型约束
interface Profile {
  name: string;
  age: string;
  designation: string;
  grade: string;
}

// 给profiles数组显式标注类型
const profiles: Profile[] = [{
    name: "kamal",
    age: "20",
    designation: "developer",
    grade: "A",
  },
  {
    name: "arun",
    age: "25",
    designation: "developer",
    grade: "A",
  },
  {
    name: "chan",
    age: "23",
    designation: "developer",
    grade: "A",
  },
];

// 函数参数添加类型限定，prop用keyof限制为Profile的合法属性
function profileLookup(name: string, prop: keyof Profile) {
  for (let i = 0; i < profiles.length; i++) {
    if (profiles[i].name === name) {
      console.log(profiles[i][prop]);
    }
  }
}

profileLookup("arun", "age");

核心修改说明 #

• 新增Profile接口，明确每个用户属性的类型，替代TypeScript的隐式类型推断，避免后续修改对象结构时出现类型冲突
• profiles变量标注为Profile[]数组类型，确保数组内所有对象都符合Profile结构要求
• 函数参数增加类型约束：name限定为字符串类型，prop通过keyof Profile限定为只能是Profile中已定义的属性名，编译阶段就会拦截非法参数，不需要运行时额外判断
• 移除了冗余的prop in profiles[i]校验，keyof语法已经从类型层面保证了prop的合法性

如果你的使用场景需要支持动态传入prop（比如prop来自用户输入，无法在编译阶段确定值），可以使用以下兼容写法：

function profileLookup(name: string, prop: string) {
  for (let i = 0; i < profiles.length; i++) {
    const current = profiles[i];
    if (current.name === name && Object.prototype.hasOwnProperty.call(current, prop)) {
      console.log(current[prop as keyof Profile]);
    }
  }
}

这种写法先通过hasOwnProperty做运行时属性存在性校验，再用as keyof Profile类型断言告诉TypeScript你已经确认prop是合法属性，不会出现类型错误。

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