在 TypeScript 中为对象动态分配属性
Shuvayan Ghosh Dastidar
2023年1月30日
-
在 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
是强制性的,而其他可选字段可以在需要时添加。