objetos - ¿Cómo puedo asignar dinámicamente propiedades a un objeto en TypeScript?

recorrer array de objetos javascript

Question

Si quisiera asignar programáticamente una propiedad a un objeto en Javascript, lo haría así:

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

Pero en TypeScript, esto genera un error:

La propiedad ''prop'' no existe en el valor de tipo ''{}''

¿Cómo se supone que asignaré cualquier propiedad nueva a un objeto en TypeScript?

Answer 1

Almacene cualquier propiedad nueva en cualquier tipo de objeto encasillado en ''cualquiera'':

var extend = <any>myObject;
extend.NewProperty = anotherObject;

Más tarde, puedes recuperarlo volviendo tu objeto extendido a ''cualquiera'':

var extendedObject = <any>myObject;
var anotherObject = <AnotherObjectType>extendedObject.NewProperty;

Answer 2

Aunque el compilador se queja, todavía debería mostrarlo como lo requiera. Sin embargo, esto funcionará.

var s = {};
s[''prop''] = true;

Answer 3

Es posible agregar un miembro a un objeto existente por

1. ampliando el tipo (léase: ampliar / especializar la interfaz)
2. lanzar el objeto original al tipo extendido
3. agregue el miembro al objeto

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();

Answer 4

Es posible denotar obj como any , pero eso frustra el propósito total de usar mecanografiado. obj = {} implica que obj es un Object . Marcarlo como any no tiene sentido. Para lograr la coherencia deseada, una interfaz se puede definir de la siguiente manera.

interface LooseObject {
[key: string]: any
}
var obj: LooseObject = {};

O para hacerlo compacto:

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

LooseObject puede aceptar campos con cualquier cadena como clave y any tipo como valor.

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

La verdadera elegancia de esta solución es que puede incluir campos seguros en la interfaz.

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;

Answer 5

Esta solución es útil cuando su objeto tiene un Tipo específico. Al igual que cuando se obtiene el objeto a otra fuente.

let user: User = new User();
(user as any).otherProperty = ''hello'';
//user did not lose its type here.

Answer 6

La mejor práctica es usar mecanografía segura, te recomiendo:

interface customObject extends MyObject {
newProp: string;
newProp2: number;
}

Answer 7

O todo de una vez:

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

Answer 8

Para garantizar que el tipo sea un Object (es decir , pares clave-valor ), use:

const obj: {[x: string]: any} = {}
obj.prop = ''cool beans''

Answer 9

Para preservar tu tipo anterior, transfiere tu objeto temporalmente a cualquier

 var obj = {}
(<any>obj).prop = 5;

La nueva propiedad dinámica solo estará disponible cuando uses el elenco:

 var a = obj.prop; ==> Will generate a compiler error
var b = (<any>obj).prop; ==> Will assign 5 to b with no error;

Answer 10

Puede agregar esta declaración para silenciar las advertencias.

declare var obj: any;

Answer 11

Si está utilizando Typescript, presumiblemente quiere usar el tipo seguridad; en cuyo caso Objeto desnudo y ''cualquiera'' están contraindicados.

Es mejor no usar Object o {}, pero algunos tipos con nombre; o puede que esté utilizando una API con tipos específicos, que necesita ampliar con sus propios campos. He encontrado que esto funciona:

class Given { ... } // API specified fields; or maybe it''s just Object {}
interface PropAble extends Given {
props?: string; // you can cast any Given to this and set .props
// ''?'' indicates that the field is optional
}
let g:Given = getTheGivenObject();
(g as PropAble).props = "value for my new field";
// to avoid constantly casting:
let k:PropAble = getTheGivenObject();
k.props = "value for props";

Answer 12

Si puede usar las características JavaScript de ES6, puede usar los nombres de propiedad calculados para manejar esto muy fácilmente:

var req = {id : 0123456};
var response = {responses: {[req.id]: ''The 0123456 response message''}};

La clave de objeto [req.id] tiene un valor dinámico

Answer 13

Una opción más para hacerlo es acceder a la propiedad como una colección:

var obj = {};
obj[''prop''] = "value";

Answer 14

var foo:IFoo = <any>{}; a poner any en el otro lado es decir var foo:IFoo = <any>{}; Entonces algo como esto sigue siendo seguro de tipo:

interface IFoo{
bar:string;
baz:string;
boo:string;
}
// How I tend to intialize
var foo:IFoo = <any>{};
foo.bar = "asdf";
foo.baz = "boo";
foo.boo = "boo";
// the following is an error,
// so you haven''t lost type safety
foo.bar = 123;

Alternativamente, puede marcar estas propiedades como opcionales:

interface IFoo{
bar?:string;
baz?:string;
boo?:string;
}
// Now your simple initialization works
var foo:IFoo = {};

Pruébalo en línea

Answer 15

asignar dinámicamente propiedades a un objeto en TypeScript.

para hacer eso solo necesitas usar interfaces de mecanografía así:

interface IValue {
prop1: string;
prop2: string;
}
interface IType {
[code: string]: IValue;
}

puedes usarlo así

var obj: IType = {};
obj[''code1''] = {
prop1: ''prop 1 value'',
prop2: ''prop 2 value''
};