318 votos

Es posible añadir dinámicamente las propiedades con nombre a objetos de JavaScript?

En JavaScript, he creado un objeto así:

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

Es posible añadir más propiedades de este objeto después de la creación inicial, si las propiedades nombre no está determinado hasta el tiempo de ejecución? es decir.

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

Gracias

511voto

Georg Schölly Puntos 63123

Sí.

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

data["PropertyD"] = 4;

// dialog box with 4 in it
alert(data.PropertyD);
alert(data["PropertyD"]);

47voto

cletus Puntos 276888

Sí es posible. Suponiendo que:

var data = {
    'PropertyA': 1,
    'PropertyB': 2,
    'PropertyC': 3
};
var propertyName = "someProperty";
var propertyValue = "someValue";

O bien:

data[propertyName] = propertyValue;

o

eval("data." + propertyName + " = '" + propertyValue + "'");

El primer método es el preferido. eval() tiene los evidentes problemas de seguridad si usted está usando los valores suministrados por el usuario así que no lo use si usted puede evitar pero vale la pena saber que existe y de lo que puede hacer.

Puedes hacer referencia a esta:

alert(data.someProperty);

o

data(data["someProperty"]);

o

alert(data[propertyName]);

26voto

abeing Puntos 178

Sé que la pregunta se respondió a la perfección, pero también he encontrado otra manera de agregar nuevas propiedades y quería compartirlo con ustedes:

Usted puede utilizar la función Object.defineProperty()

Se encuentran en Mozilla Developer Network

Ejemplo:

var o = {}; // Creates a new object

// Example of an object property added with defineProperty with a data property descriptor
Object.defineProperty(o, "a", {value : 37,
                               writable : true,
                               enumerable : true,
                               configurable : true});
// 'a' property exists in the o object and its value is 37

// Example of an object property added with defineProperty with an accessor property descriptor
var bValue;
Object.defineProperty(o, "b", {get : function(){ return bValue; },
                               set : function(newValue){ bValue = newValue; },
                               enumerable : true,
                               configurable : true});
o.b = 38;
// 'b' property exists in the o object and its value is 38
// The value of o.b is now always identical to bValue, unless o.b is redefined

// You cannot try to mix both :
Object.defineProperty(o, "conflict", { value: 0x9f91102, 
                                       get: function() { return 0xdeadbeef; } });
// throws a TypeError: value appears only in data descriptors, get appears only in accessor descriptors

14voto

Maxim Sloyko Puntos 4091

Aquí, mediante su notación:

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'

7voto

Gabriel Hurley Puntos 17079

Usted puede agregar muchas más propiedades como te gusta simplemente mediante la notación de puntos:

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

o:

data[newattribute] = somevalue

para la dinámica de las teclas.

Iteramos.com

Iteramos es una comunidad de desarrolladores que busca expandir el conocimiento de la programación mas allá del inglés.
Tenemos una gran cantidad de contenido, y también puedes hacer tus propias preguntas o resolver las de los demás.

Powered by: