如果我想在Javascript中以编程方式将一个属性分配给一个对象,我会这样做:

var obj = {};
obj.prop = "value";

但在TypeScript中,这会产生一个错误:

属性“prop”在类型为“{}”的值上不存在

我应该如何在TypeScript中分配任何新属性给对象?


当前回答

最简单的是

const obj = <any>{};
obj.prop1 = "value";
obj.prop2 = "another value"

其他回答

只需这样做,您就可以添加或使用任何属性。(我使用的typescript版本为“typescript”:“~4.5.5”)

let contextItem = {} as any;

现在,您可以添加任何属性并在任何地方使用它。就像

contextItem.studentName = "kushal";

之后你可以这样使用它:

console.log(contextItem.studentName);

或者一气呵成:

  var obj:any = {}
  obj.prop = 5;

索引类型

可以将obj表示为任意值,但这违背了使用typescript的全部目的。obj ={}表示obj是一个对象。把它标记为任何都没有意义。为了实现所需的一致性,可以按照如下方式定义接口。

interface LooseObject {
    [key: string]: any
}

var obj: LooseObject = {};

或使之紧凑:

var obj: {[k: string]: any} = {};

LooseObject可以接受任何字符串作为键,任何类型作为值的字段。

obj.prop = "value";
obj.prop2 = 88;

这个解决方案的真正优雅之处在于,您可以在接口中包含类型安全字段。

interface MyType {
    typesafeProp1?: number,
    requiredProp1: string,
    [key: string]: any
}

var obj: MyType ;
obj = { requiredProp1: "foo"}; // valid
obj = {} // error. 'requiredProp1' is missing
obj.typesafeProp1 = "bar" // error. typesafeProp1 should be a number

obj.prop = "value";
obj.prop2 = 88;

记录<Keys,Type>实用程序类型

更新(2020年8月):@transang在评论中提到了这一点

Record<Keys,Type>是typescript中的Utility类型。对于属性名未知的键-值对,它是一种更简洁的替代方法。 值得注意的是,Record<Keys,Type>是{[k: Keys]: Type}的命名别名,其中Keys和Type是泛型。 在我看来,这一点值得一提

相比较而言,

var obj: {[k: string]: any} = {};

就变成了

var obj: Record<string,any> = {}

MyType现在可以通过扩展Record类型来定义

interface MyType extends Record<string,any> {
    typesafeProp1?: number,
    requiredProp1: string,
}

虽然这回答了最初的问题,但@GreeneCreations的回答可能会从另一个角度来解决这个问题。

我很惊讶没有一个答案引用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.

您可以添加此声明来屏蔽警告。

declare var obj: any;