Ist es möglich, dynamisch benannte Eigenschaften zu JavaScript-Objekten hinzuzufügen?

Question

In JavaScript habe ich ein Objekt wie folgt erstellt:

var data = {
    'PropertyA': 1,
    'PropertyB': 2,
    'PropertyC': 3
};

Ist es möglich, diesem Objekt nach seiner ersten Erstellung weitere Eigenschaften hinzuzufügen, wenn der Name der Eigenschaften erst zur Laufzeit festgelegt wird? d.h.

var propName = 'Property' + someUserInput
//imagine someUserInput was 'Z', how can I now add a 'PropertyZ' property to 
//my object?

Answer 1

Hier, unter Verwendung Ihrer Notation:

var data = {
    'PropertyA': 1,
    'PropertyB': 2,
    'PropertyC': 3
};
var propName = 'Property' + someUserInput
//imagine someUserInput was 'Z', how can I now add a 'PropertyZ' property to 
//my object?
data[propName] = 'Some New Property value'

Answer 2

Sie können beliebig viele weitere Eigenschaften hinzufügen, indem Sie einfach die Punktschreibweise verwenden:

var data = {
    var1:'somevalue'
}
data.newAttribute = 'newvalue'

ou :

data[newattribute] = somevalue

für dynamische Schlüssel.

Answer 3

Zusätzlich zu allen vorherigen Antworten, und falls Sie sich fragen, wie wir dynamische Eigenschaftsnamen in der Zukunft unter Verwendung von berechneten Eigenschaftsnamen ( ECMAScript 6 ), hier ist die Vorgehensweise:

var person = "John Doe";
var personId = "person_" + new Date().getTime();
var personIndex = {
    [ personId ]: person
//  ^ computed property name
};

personIndex[ personId ]; // "John Doe"

---

Hinweis: ECMAScript 6 verstehen - Nickolas Zakas

Answer 4

Nur eine Ergänzung zur obigen Antwort von abeing. Sie können eine Funktion definieren, um die Komplexität von defineProperty wie unten erwähnt zu kapseln.

var defineProp = function ( obj, key, value ){
  var config = {
    value: value,
    writable: true,
    enumerable: true,
    configurable: true
  };
  Object.defineProperty( obj, key, config );
};

//Call the method to add properties to any object
defineProp( data, "PropertyA",  1 );
defineProp( data, "PropertyB",  2 );
defineProp( data, "PropertyC",  3 );

Hinweis: http://addyosmani.com/resources/essentialjsdesignpatterns/book/#constructorpatternjavascript

Answer 5

Sie können Eigenschaften dynamisch hinzufügen, indem Sie einige der unten aufgeführten Optionen verwenden:

In Ihrem Beispiel:

var data = {
    'PropertyA': 1,
    'PropertyB': 2,
    'PropertyC': 3
};

Sie können eine Eigenschaft mit einem dynamischen Wert auf die folgenden beiden Arten definieren:

data.key = value;

ou

data['key'] = value;

Noch mehr..wenn Ihr Schlüssel auch dynamisch ist, können Sie mit der Klasse Object definieren:

Object.defineProperty(data, key, withValue(value));

où Daten ist Ihr Objekt, Schlüssel ist die Variable zum Speichern des Schlüsselnamens und Wert ist die Variable, in der der Wert gespeichert wird.

Ich hoffe, das hilft!