Khoá đối tượng Javascript trong ngoặc vuông

Bất cứ ai có thể giải thích tại sao / cách phương pháp gán khóa trong JavaScript dưới đây hoạt động như thế nào không?

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

trở về:

Object {b: "d"}

Đó là cú pháp tên thuộc tính được tính toán ES2015 mới (đặc tả EcmaScript chính thức được gọi là ES6) . Đó là cách viết tắt cho someObject[someKey]bài tập mà bạn biết từ ES3 / 5:

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

là đường cú pháp cho:

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

Thực sự việc sử dụng []đưa ra một cách tuyệt vời để sử dụng giá trị thực tế của biến như chính /tài sản trong khi tạo ra JavaScript đối tượng .

Tôi đã thống kê khá nhiều với câu trả lời ở trên và tôi đánh giá cao nó vì nó cho phép tôi viết điều này với một ví dụ nhỏ.

Tôi đã thực thi từng dòng mã trên 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};

Kết quả sẽ là

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

Ngoài ra, chỉ có điều kiện sử dụng []ký hiệu để truy cập hoặc gán nội dung trong các đối tượng khi chúng ta chưa biết nó sẽ như thế nào cho đến khi đánh giá hoặc thời gian chạy.