Estoy intentando acceder a una propiedad de un objeto utilizando un nombre dinámico, ¿Es esto posible?
const algo = { bar: "Foobar!" };
const foo = 'bar';
algo.foo;
La idea es acceder a algo.bar
, obteniendo "Foobar!"
En Javascript puedes crear y acceder a atributos usando dos tipos de notaciones:
<identificador del objeto> . <nombre del atributo>
Es la más común:
let objeto= {
atributo1: 'hola'
}
console.log(objeto.atributo1);
Tiene dos limitaciones:
hola mundo
.Para resolver estos dos problemas tienes la ...
<identificador del objeto> [ <nombre del atributo como texto> ]
Al usar un string entre corchetes el nombre del atributo puede ser guardado en una variable o ser generado sobre la marcha (aquí tienes un ejemplo para encontrar atributos cuando no sabemos cuántos hay).
let objeto={confuso: () => console.log('Esto es una función')};
let mundo=1;
let atributos=[1,'hola-mundo', 'con espacios','confuso()','hola'];
atributos.forEach((attr,index) => {
objeto[attr]=index*2;
});
console.log(objeto);
console.log(objeto['hola-mundo']);
//objeto.hola-mundo sería interpretado como una resta!
console.log(objeto.hola-mundo);
//objeto.confuso() llama al método confuso, no al atributo "confuso()"
objeto.confuso(); //
console.log(objeto[atributos[4]]);
No tiene limitaciones pero cuando usamos un IDE tiene la desventaja de que es más complicado para el analizador semántico saber si estamos cometiendo una errata al escribir el nombre del atributo, lo que es especialmente útil si usamos typescript.
En el caso de tu ejemplo podrías probar esto:
const algo = { bar: "Foobar!" };
const foo = 'bar';
algo.foo;
console.log(algo[foo])
[ ]
tal quealgo[foo]
. Estoy mirando, creo que esto ya deberia estar resuelto en una pregunta del sitio. Un saludo