如果我想在Javascript中以编程方式将一个属性分配给一个对象,我会这样做:
var obj = {};
obj.prop = "value";
但在TypeScript中,这会产生一个错误:
属性“prop”在类型为“{}”的值上不存在
我应该如何在TypeScript中分配任何新属性给对象?
如果我想在Javascript中以编程方式将一个属性分配给一个对象,我会这样做:
var obj = {};
obj.prop = "value";
但在TypeScript中,这会产生一个错误:
属性“prop”在类型为“{}”的值上不存在
我应该如何在TypeScript中分配任何新属性给对象?
当前回答
当对象具有特定类型时,此解决方案非常有用。比如从其他源获取对象时。
let user: User = new User();
(user as any).otherProperty = 'hello';
//user did not lose its type here.
其他回答
只需这样做,您就可以添加或使用任何属性。(我使用的typescript版本为“typescript”:“~4.5.5”)
let contextItem = {} as any;
现在,您可以添加任何属性并在任何地方使用它。就像
contextItem.studentName = "kushal";
之后你可以这样使用它:
console.log(contextItem.studentName);
我很惊讶没有一个答案引用Object。赋值,因为这是我在考虑JavaScript中的“组合”时使用的技术。
在TypeScript中,它可以像预期的那样工作:
interface IExisting {
userName: string
}
interface INewStuff {
email: string
}
const existingObject: IExisting = {
userName: "jsmith"
}
const objectWithAllProps: IExisting & INewStuff = Object.assign({}, existingObject, {
email: "jsmith@someplace.com"
})
console.log(objectWithAllProps.email); // jsmith@someplace.com
优势
始终保持类型安全,因为您根本不需要使用任何类型 使用TypeScript的聚合类型(在声明objectWithAllProps类型时用&表示),这清楚地表明我们正在动态地(即动态地)组合一个新类型。
需要注意的事情
Object.assign has it's own unique aspects (that are well known to most experienced JS devs) that should be considered when writing TypeScript. It can be used in a mutable fashion, or an immutable manner (I demonstrate the immutable way above, which means that existingObject stays untouched and therefore doesn't have an email property. For most functional-style programmers, that's a good thing since the result is the only new change). Object.assign works the best when you have flatter objects. If you are combining two nested objects that contain nullable properties, you can end up overwriting truthy values with undefined. If you watch out for the order of the Object.assign arguments, you should be fine.
唯一完全类型安全的解决方案是这个,但是有点啰嗦,并且迫使您创建多个对象。
如果你必须先创建一个空对象,那么从这两个解决方案中选择一个。记住,每次你使用as,你就失去了安全。
安全解决方案
对象类型在getObject中是安全的,这意味着对象。A的类型为字符串| undefined
interface Example {
a: string;
b: number;
}
function getObject() {
const object: Partial<Example> = {};
object.a = 'one';
object.b = 1;
return object as Example;
}
短期解决方案
对象类型在getObject中是不安全的,这意味着对象。即使在赋值之前,A的类型也是string。
interface Example {
a: string;
b: number;
}
function getObject() {
const object = {} as Example;
object.a = 'one';
object.b = 1;
return object;
}
可以通过将成员添加到现有对象
扩大类型(读取:扩展/专门化接口) 将原始对象转换为扩展类型 将成员添加到对象中
interface IEnhancedPromise<T> extends Promise<T> {
sayHello(): void;
}
const p = Promise.resolve("Peter");
const enhancedPromise = p as IEnhancedPromise<string>;
enhancedPromise.sayHello = () => enhancedPromise.then(value => console.info("Hello " + value));
// eventually prints "Hello Peter"
enhancedPromise.sayHello();
既然你不能这样做:
obj.prop = 'value';
如果你的TS编译器和linter没有严格要求你,你可以这样写:
obj['prop'] = 'value';
如果你的TS编译器或linter是严格的,另一个答案将是类型转换:
var obj = {};
obj = obj as unknown as { prop: string };
obj.prop = "value";