Cú pháp khai báo đối tượng JavaScript - tên biến là thuộc tính

Question

JavaScript cung cấp cho bạn nhiều cách để khai báo đối tượng. Khi bạn có hầu hết các dữ liệu có sẵn trong tầm tay, thuận tiện nhất (theo ý kiến ​​của tôi) như sau:

var person = { 
    name: 'John', 
    age: 23 
}; // "object literal syntax" 

Một điều tò mò về cú pháp này là nó giống hệt như thế này:

var person = { 
    'name': 'John', 
    'age': 23 
}; // "object literal syntax" 

Tức là, bạn có thể sử dụng dấu ngoặc kép hoặc bỏ qua chúng cho tên thuộc tính.

Khi so sánh rằng với cách thiết lập một công trình bất động sản duy nhất, bạn có hai lựa chọn:

person.birthday = "January 12"; // "dot syntax" 

hoặc

person['birthday'] = "January 12"; // "array syntax" 

Các "dot cú pháp" chỉ hoạt động khi các toán hạng bên phải là thực tế tên tài sản. Nếu bạn muốn sử dụng một biến cho tên thuộc tính, bạn phải sử dụng "mảng cú pháp", ví dụ:

var prop = "birthday"; 
person[prop] = "January 12"; 

Bây giờ, là nó có thể sử dụng một biến cho tên thuộc tính trong "đối tượng cú pháp đen" ? Vì nó không quan trọng nếu bạn trích dẫn các tên thuộc tính, dường như không có cách nào rõ ràng để sử dụng một biến ở đó. Tôi đang tìm một cái gì đó như thế này:

var prop = "birthday"; 
var person = { 
    name: 'John', 
    age: 23, 
    (prop): 'January 12' 
}; 

Ở đây tôi đang sử dụng (prop) như cú pháp tưởng tượng được sử dụng để biểu thị rằng đây là một biến và không phải là một chuỗi chữ.

Cảm ơn.

Answer 1

ES6 bây giờ cho phép cho việc này: 'người'

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

Answer 2

Không, điều này sẽ không hoạt động, đó là lý do tại sao, nếu bạn đang tự động đặt tên thuộc tính, mảng như ký hiệu được đề xuất và sử dụng.

var k='propertyname'; 
object[k]="value"; 

tác phẩm này trong khi sử dụng ký hiệu dấu chấm để đặt chỉ mục hoặc tên thuộc tính từ vatiable là không thể.

Answer 3

Bạn không thể làm điều này với các đối tượng, nhưng nếu bạn xem xét sử dụng một hàm constructor thay vào đó, nó có thể trông giống như thế này:

var prop = "birthday"; 
var Person = function() { 
    this.name = "Bob"; 
    this[prop] = "January 12"; 
}; 
var bob = new Person(); 

Tất nhiên bạn vẫn có ký hiệu mảng ở đây, nhưng có thể bạn thích aproach này anyway :)

Answer 4

đối với những người cần một sự thay thế thả-in cho dot cú pháp nơi các phím là các đối tượng thay vì chuỗi (nói cho làm tổ bên trong một đối tượng cha), đây là một số cách giải quyết:

var developers = { 
    person: { 
     'name': 'John', 
     'age': 23 
    }, 
    anarchist: (function(){ var a = {}; 
     a['name'] = 'John'; 
     a['age'] = 23; 
     a[false] = false; 
     a[1] = 1; 
     a[window] = window; 
    return a; })(), 
    conformist: _.object([ 
     ['name', 'John'], 
     ['age', 23], 
     [false, false], 
     [1, 1], 
     [window, window] 
    ]) 
}; 

// console.log(developers); // <- to see var dump in Firebug 

Phần tử vô chính phủ sử dụng self-executing-function để thu gom rác sau cuộc gọi và phần tử tuân thủ sử dụng hàm _.object() nếu bạn có thể bao gồm underscore.js trong trang web của mình.

Tôi ước rằng các hàm Object() và Array() dựng sẵn được phép truyền trong các khóa và giá trị theo cách gạch dưới.js làm nó :-)