有没有可能为JavaScript对象添加dynamic命名的属性?
在JavaScript中,我创build了一个如下所示的对象:
var data = { 'PropertyA': 1, 'PropertyB': 2, 'PropertyC': 3 };
如果在运行时间之前没有确定属性名称,是否可以在初始创build之后向这个对象添加更多属性? 即
var propName = 'Property' + someUserInput //imagine someUserInput was 'Z', how can I now add a 'PropertyZ' property to //my object?
是。
var data = { 'PropertyA': 1, 'PropertyB': 2, 'PropertyC': 3 }; data["PropertyD"] = 4; // dialog box with 4 in it alert(data.PropertyD); alert(data["PropertyD"]);
对的,这是可能的。 假设:
var data = { 'PropertyA': 1, 'PropertyB': 2, 'PropertyC': 3 }; var propertyName = "someProperty"; var propertyValue = "someValue";
或者:
data[propertyName] = propertyValue;
要么
eval("data." + propertyName + " = '" + propertyValue + "'");
第一种方法是首选。 如果你使用用户提供的值,eval()就有明显的安全问题,所以如果你可以避免使用它,值得知道它是否存在以及它可以做什么。
你可以参考这个:
alert(data.someProperty);
要么
data(data["someProperty"]);
要么
alert(data[propertyName]);
我知道这个问题是完美的回答,但我也find了另一种方法来添加新的属性,并希望与你分享:
你可以使用函数Object.defineProperty()
在Mozilla开发者networking上find
例:
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}); ob = 38; // 'b' property exists in the o object and its value is 38 // The value of ob is now always identical to bValue, unless ob 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
赢得ES6!
const prop = 'cool' const a = { [`dynamic-${prop}`]: true }
string插值和新的dynamic属性语法的组合。
在这里,使用你的符号:
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'
除了所有以前的答案,以及如果您想知道如何使用计算属性名称(ECMAScript 6)编写未来的dynamic属性名称,请执行以下操作:
var person = "John Doe"; var personId = "person_" + new Date().getTime(); var personIndex = { [ personId ]: person // ^ computed property name }; personIndex[ personId ]; // "John Doe"
参考: 了解ECMAScript 6 – Nickolas Zakas
您只需使用点符号即可添加更多的属性:
var data = { var1:'somevalue' } data.newAttribute = 'newvalue'
或者 :
data[newattribute] = somevalue
为dynamic键。
只是除了abeing上面的答案。 你可以定义一个函数来封装defineProperty的复杂性,如下所述。
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 );
参考: http : //addyosmani.com/resources/essentialjsdesignpatterns/book/#constructorpatternjavascript
您可以使用以下某些选项dynamic添加属性:
在你的例子中:
var data = { 'PropertyA': 1, 'PropertyB': 2, 'PropertyC': 3 };
您可以通过以下两种方式定义一个具有dynamic值的属性:
data.key = value;
要么
data['key'] = value;
更多..如果你的钥匙也是dynamic的,你可以使用Object类定义:
Object.defineProperty(data, key, withValue(value));
数据是你的对象, 键是存储键名的variables, 值是存储该值的variables。
我希望这有帮助!
最简单和最便携的方式是。
var varFieldName = "good"; var ob = {}; Object.defineProperty(ob, varFieldName , { value: "Fresh Value" });
基于#abeing答案!
我知道这个post已经有几个答案了,但是我还没有看到其中有多个属性,并且它们在一个数组中。 顺便说一下这个解决scheme是针对ES6的。
为了说明,假设我们有一个名为person的数组,里面有对象:
let Person = [{id:1, Name: "John"}, {id:2, Name: "Susan"}, {id:3, Name: "Jet"}]
所以,你可以添加一个属性与相应的值。 假设我们要添加一个默认值为EN的语言 。
Person.map((obj)=>({...obj,['Language']:"EN"}))
Person数组现在会变成这样:
Person = [{id:1, Name: "John", Language:"EN"}, {id:2, Name: "Susan", Language:"EN"}, {id:3, Name: "Jet", Language:"EN"}]
这是我解决问题的方法。
var obj = { }; var field = "someouter.someinner.someValue"; var value = 123; function _addField( obj, field, value ) { // split the field into tokens var tokens = field.split( '.' ); // if there's more than one token, this field is an object if( tokens.length > 1 ) { var subObj = tokens[0]; // define the object if( obj[ subObj ] !== undefined ) obj[ subObj ] = {}; // call addfield again on the embedded object var firstDot = field.indexOf( '.' ); _addField( obj[ subObj ], field.substr( firstDot + 1 ), value ); } else { // no embedded objects, just field assignment obj[ field ] = value; } } _addField( obj, field, value ); _addField(obj, 'simpleString', 'string'); console.log( JSON.stringify( obj, null, 2 ) );
生成以下对象:
{ "someouter": { "someinner": { "someValue": 123 } }, "simpleString": "string" }
从包含对象的dynamicstring名称(例如object.subobject.property)访问一个很好的方法,
function ReadValue(varname) { var v=varname.split("."); var o=window; if(!v.length) return undefined; for(var i=0;i<v.length-1;i++) o=o[v[i]]; return o[v[v.length-1]]; } function AssignValue(varname,value) { var v=varname.split("."); var o=window; if(!v.length) return; for(var i=0;i<v.length-1;i++) o=o[v[i]]; o[v[v.length-1]]=value; }
例:
ReadValue("object.subobject.property"); WriteValue("object.subobject.property",5);
eval适用于读取值,但写入值有点困难。
更高级的版本(创build子类,如果他们不存在,并允许对象,而不是全局variables)
function ReadValue(varname,o=window) { if(typeof(varname)==="undefined" || typeof(o)==="undefined" || o===null) return undefined; var v=varname.split("."); if(!v.length) return undefined; for(var i=0;i<v.length-1;i++) { if(o[v[i]]===null || typeof(o[v[i]])==="undefined") o[v[i]]={}; o=o[v[i]]; } if(typeof(o[v[v.length-1]])==="undefined") return undefined; else return o[v[v.length-1]]; } function AssignValue(varname,value,o=window) { if(typeof(varname)==="undefined" || typeof(o)==="undefined" || o===null) return; var v=varname.split("."); if(!v.length) return; for(var i=0;i<v.length-1;i++) { if(o[v[i]]===null || typeof(o[v[i]])==="undefined") o[v[i]]={}; o=o[v[i]]; } o[v[v.length-1]]=value; }
例:
ReadValue("object.subobject.property",o); WriteValue("object.subobject.property",5,o);
这和o.object.subobject.property是一样的
当然。 把它看作是一个字典或关联数组。 您可以随时添加。