在 TypeScript 中，为对象增加属性是一种常见的操作。然而，在实践中，我们可能会遇到类型定义问题，特别是当我们使用动态属性名称时。本文将介绍 TypeScript 中为对象增加属性时遇到的类型定义问题，并提供解决方案和示例代码。
问题描述
假设我们有一个对象 person，它有一个固定属性 name 和一个动态属性 age。我们想在运行时为 person 添加一个新的动态属性 address，并赋值为字符串类型。
-- -------------------- ---- ------- --------- ------ - ----- ------- ----- -------- ---- - ----- ------- ------ - - ----- -------- ---- --- -- -------------- - ---- ---- ---- -- -----
上面的代码看起来很简单，但是如果我们尝试编译它，会得到一个类型错误：
Property 'address' does not exist on type 'Person'.
这是因为我们在 Person 接口中定义了一个动态属性，但是它的类型是 any，并没有包含我们想要添加的新属性 address。因此，TypeScript 认为我们不能将 address 属性添加到 person 对象中。
解决方案
要解决这个问题，我们需要对 Person 接口进行修改，以允许添加我们想要的新属性。我们可以使用索引签名来定义动态属性，同时限制它们的类型。例如，我们可以将 Person 接口修改为：
interface Person {
name: string;
age: number;
[key: string]: string | number;
}这个版本的 Person 接口定义了一个动态属性，它的名称可以是任何字符串，但是它的值必须是字符串或数字类型。现在，我们可以修改 person 对象来添加新属性 address，并且 TypeScript 不会报错了。
const person: Person = {
name: 'Alice',
age: 30,
};
person.address = '123 Main St'; // 不会报错示例代码
下面是一个完整的示例代码，它演示了如何在 TypeScript 中为对象增加属性时遇到的类型定义问题，并提供了解决方案。
-- -------------------- ---- ------- --------- ------ - ----- ------- ---- ------- ----- -------- ------ - ------- - ----- ------- ------ - - ----- -------- ---- --- -- -------------- - ---- ---- ---- -- ----
结论
在 TypeScript 中为对象增加属性时遇到的类型定义问题是常见的。为了解决这个问题，我们需要对接口进行修改，以允许添加新属性。使用索引签名可以让我们定义动态属性，并限制它们的类型。通过这种方式，我们可以避免类型错误，并使代码更加健壮和可读。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/674151f6d40a3cb159ea74a4