在 TypeScript 中为对象动态分配属性
Shuvayan Ghosh Dastidar
2023年1月30日
2022年5月18日
-
在 TypeScript 中使用
as关键字向对象添加动态属性 -
在 TypeScript 中使用
Partial类型为对象动态添加属性 -
在 TypeScript 中使用
?为对象动态添加属性的运算符
TypeScript 是一种强类型语言，因此每个变量和对象都必须有一个类型。因此，很难为已定义的变量动态添加属性；但是，有一些方法可以做到这一点。
本教程将重点介绍如何将动态属性添加到对象。
在 TypeScript 中使用 as 关键字向对象添加动态属性
TypeScript 对每个变量都遵循严格的类型。但是，即使对象中不存在所有类型字段，也可以使用 as 关键字强制编译器将变量的类型推断为给定类型。
通过这种方式，可以进一步向对象添加动态属性。以下代码段显示了如何在空对象的情况下完成此操作。
interface Person {
name : string;
age : number;
country : string;
id : number;
}
// forcing the compiler to infer person as of type Person
var person : Person = {} as Person;
// dynamically adding types
person.id = 1;
person.country = "India";
person.name = "Ramesh";
console.log(person);
输出：
{
"id": 1,
"country": "India",
"name": "Ramesh"
}
除了空对象之外，还可以存在某些字段，例如 var person : Person = { id : 1 } as Person。
在 TypeScript 中使用 Partial 类型为对象动态添加属性
Partial 类型用于使接口的所有属性都是可选的。当创建对象只需要某些接口属性时，使用 Pick 类型。
Omit 类型用作 Pick 类型的反面 - 从界面中删除某些属性，同时根据需要保留所有其他属性。
interface Animal {
legs : number ;
eyes : number ;
name : string ;
wild : boolean ;
};
// we define a variable with partial types
var dogWithAllOptionalTypes : Partial<Animal> = {
eyes: 2
};
// Now, further properties can be added to the object when needed
dogWithAllOptionalTypes.legs = 4;
dogWithAllOptionalTypes.wild = false;
在 TypeScript 中使用 ? 为对象动态添加属性的运算符
? 运算符的行为与 Partial 类型非常相似。用户必须使用 ? 明确地使类型或接口中的字段可选运算符。
以下是使用前面示例的代码段来展示实现。
interface Animal {
legs : number ;
eyes? : number ;
name? : string ;
wild? : boolean ;
};
var dog : Animal = {
legs : 4
};
// Now further properties can be added to the object when needed
dog.eyes = 2;
dog.wild = false;
因此，在上面的示例中，字段 legs 是强制性的，而其他可选字段可以在需要时添加。
Author: Shuvayan Ghosh Dastidar
