Clave de objeto Javascript de corchetes

109

¿Alguien puede explicar cómo funciona el por qué / cómo funciona el siguiente método de asignación de claves en JavaScript?

a = "b"
c = {[a]: "d"}

regreso:

Object {b: "d"}
lcharbon
fuente

Respuestas:

162

Es la nueva sintaxis de nombre de propiedad calculada ES2015 (la especificación EcmaScript formalmente conocida como ES6) . Es una abreviatura de la someObject[someKey]tarea que conoces de ES3 / 5:

var a = "b"
var c = {[a]: "d"}

es azúcar sintáctico para:

var a = "b"
var c = {}
c[a] = "d"
Sean Vieira
fuente
27

Realmente, el uso de []ofrece una excelente manera de utilizar el valor real de la variable como propiedad clave al crear objetos JavaScript ./

Estoy bastante satisfecho con la respuesta anterior y la agradezco, ya que me permitió escribir esto con un pequeño ejemplo.

Ejecuté el código línea por línea en Node REPL (Node shell).

> var key = "fullName";     // Assignment
undefined
>
> var obj = {key: "Rishikesh Agrawani"}    // Here key's value will not be used
undefined
> obj     // Inappropriate, which we don't want
{ key: 'Rishikesh Agrawani' }
>
> // Let's fix
undefined
> var obj2 = {[key]: "Rishikesh Agrawani"}
undefined
> obj2
{ fullName: 'Rishikesh Agrawani' }
>
higull
fuente
6
const animalSounds = {cat: 'meow', dog: 'bark'};

const animal = 'lion';

const sound = 'roar';

{...animalSounds, [animal]: sound};

El resultado sera

{cat: 'meow', dog: 'bark', lion: 'roar'};
monireh d
fuente
-1

Además, la única condición para usar la []notación para acceder o asignar cosas en objetos cuando aún no sabemos qué va a ser hasta la evaluación o el tiempo de ejecución.

Eldiyar Talantbek
fuente