Chave do objeto Javascript dos colchetes

Alguém pode explicar como o porquê / como funciona o método abaixo de atribuição de chaves em JavaScript?

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

Retorna:

Object {b: "d"}

É a nova sintaxe de nome de propriedade computada ES2015 (a especificação EcmaScript formalmente conhecida como ES6) . É uma abreviatura para a someObject[someKey]tarefa que você conhece do ES3 / 5:

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

é o açúcar sintático para:

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

Na verdade, o uso de []oferece uma maneira excelente de usar o valor real da variável como propriedade- chave ao criar objetos JavaScript ./

Estou bastante satisfeito com a resposta acima e agradeço, pois me permitiu escrever isso com um pequeno exemplo.

Executei o código linha por linha no 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' }
>

const animalSounds = {cat: 'meow', dog: 'bark'};

const animal = 'lion';

const sound = 'roar';

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

O resultado será

{cat: 'meow', dog: 'bark', lion: 'roar'};

Além disso, a única condição para usar []notação para acessar ou atribuir coisas em objetos quando ainda não sabemos o que vai ser até a avaliação ou tempo de execução.