Добавить свойство в объект JavaScript, используя переменную в качестве имени?
Я вытаскиваю элементы из DOM с помощью jQuery и хочу установить свойство для объекта, используя id
элемента DOM.
пример
const obj = {}
jQuery(itemsFromDom).each(function() {
const element = jQuery(this)
const name = element.attr('id')
const value = element.attr('value')
// Here is the problem
obj.name = value
})
Если itemsFromDom
включает в себя элемент с id
из "myId", я хочу obj
иметь свойство с именем "myId". Выше дает мне name
,
Как мне назвать свойство объекта, используя переменную, используя JavaScript?
15 ответов
Вы можете использовать этот эквивалентный синтаксис:
obj[name] = value
С ECMAScript 2015 вы можете сделать это непосредственно в объявлении объекта, используя скобки:
var obj = {
[key]: value
}
куда key
может быть любым выражением (например, переменной), возвращающим значение:
var obj = {
['hello']: 'World',
[x + 2]: 42,
[someObject.getId()]: someVar
}
Вы даже можете сделать список объектов, как это
var feeTypeList = [];
$('#feeTypeTable > tbody > tr').each(function (i, el) {
var feeType = {};
var $ID = $(this).find("input[id^=txtFeeType]").attr('id');
feeType["feeTypeID"] = $('#ddlTerm').val();
feeType["feeTypeName"] = $('#ddlProgram').val();
feeType["feeTypeDescription"] = $('#ddlBatch').val();
feeTypeList.push(feeType);
});
Есть два разных обозначения для доступа к свойствам объекта
- Точечная запись: myObj.prop1
- Обозначение вскобках: myObj ["prop1"]
Точечная запись быстра и проста, но вы должны явно использовать фактическое имя свойства. Без подстановки, переменных и т. Д.
Обозначение в скобках является открытым. Он использует строку, но вы можете создать строку, используя любой допустимый код js. Вы можете указать строку как литерал (хотя в этом случае точечная запись будет читаться легче), либо использовать переменную, либо вычислить каким-либо образом.
Итак, все они устанавливают для свойства myObj с именем prop1 значение Hello:
// quick easy-on-the-eye dot notation
myObj.prop1 = "Hello";
// brackets+literal
myObj["prop1"] = "Hello";
// using a variable
var x = "prop1";
myObj[x] = "Hello";
// calculate the accessor string in some weird way
var numList = [0,1,2];
myObj[ "prop" + numList[1] ] = "Hello";
Ловушки:
myObj.[xxxx] = "Hello"; // wrong: mixed notations, syntax fail
myObj[prop1] = "Hello"; // wrong: this expects a variable called prop1
tl; dnr: если вы хотите вычислить или ссылаться на ключ, вы должны использовать скобочные обозначения. Если вы используете ключ явно, то используйте точечную запись для простого понятного кода.
Примечание: есть и другие хорошие и правильные ответы, но я лично нашел их немного краткими из-за слабого знакомства с причудливостью JS на лету. Это может быть полезно для некоторых людей.
С помощью lodash вы можете создать новый объект, такой как _.set:
obj = _.set({}, key, val);
Или вы можете установить существующий объект следующим образом:
var existingObj = { a: 1 };
_.set(existingObj, 'a', 5); // existingObj will be: { a: 5 }
Вы должны позаботиться о том, чтобы использовать точку (".") В своем пути, потому что lodash может установить иерархию, например:
_.set({}, "a.b.c", "d"); // { "a": { "b": { "c": "d" } } }
Сначала нам нужно определить ключ как переменную, а затем нам нужно назначить ключ как объект. Например,
var data = {key:'dynamic_key',value:'dynamic_value'}
var key = data.key;
var obj = { [key]: data.value}
console.log(obj)
Относится к теме, но не специально для jquery. Я использовал это в проектах реагирования ec6, может быть, кому-то поможет:
this.setState({ [`${name}`]: value}, () => {
console.log("State updated: ", JSON.stringify(this.state[name]));
});
PS: Обратите внимание на характер цитаты.
3 способа доступа к значению объекта Мы можем вывести значение объекта, передав соответствующий ключ. Поскольку в моем примере я использовал эмодзи в качестве ключа, это немного сложно. Итак, давайте рассмотрим более простой пример.
let me = {
name: 'samantha',
};
// 1. Dot notation
me.name; // samantha
// 2. Bracket notation (string key)
me['name']; // samantha
// 3. Bracket notation (variable key)
let key = 'name';
me[key]; // samantha
С появлением ES2015 Object.assign и вычисляемых имен свойств код OP сводится к:
var obj = Object.assign.apply({}, $(itemsFromDom).map((i, el) => ({[el.id]: el.value})));
Если вы хотите добавить поля к объекту динамически, самый простой способ сделать это следующим образом:
var params= [
{key: "k1", value=1},
{key: "k2", value=2},
{key: "k3", value=3}];
for(i=0; i< params.len; i++) {
data[params[i].key] = params[i].value
}
Это создаст объект данных, который имеет следующие поля:
{k1:1, k2:2, k3:3}
У ajavascript есть два типа аннотации для получения свойств объекта javascript:
Obj = {};
1) (.) Аннотация напр. Obj.id это будет работать, только если у объекта уже есть свойство с именем 'id'
2) ([]) аннотация напр. Obj[id] здесь, если у объекта нет свойства с именем 'id', он создаст новое свойство с именем 'id'.
так для примера ниже:
Новое свойство будет создаваться всегда, когда вы пишете Obj[имя]. И если свойство с таким именем уже существует, оно переопределит его.
const obj = {}
jQuery(itemsFromDom).each(function() {
const element = jQuery(this)
const name = element.attr('id')
const value = element.attr('value')
// This will work
obj[name]= value;
})
Если у вас есть объект, вы можете создать массив ключей, затем сопоставить и создать новый объект из ключей и значений предыдущего объекта.
Object.keys(myObject)
.map(el =>{
const obj = {};
obj[el]=myObject[el].code;
console.log(obj);
});
Основываясь на ответе wOxxOm, это пример использования:
const data = [
{"id": "z1", "val":10},
{"id": "z2", "val":20},
{"id": "z3", "val":30}
];
const obj = Object.assign.apply({}, data.map((el, i) => ({[el.id]: el.val})));
console.log(obj);
const data = [{
name: 'BMW',
value: '25641'
}, {
name: 'Apple',
value: '45876'
},
{
name: 'Benz',
value: '65784'
},
{
name: 'Toyota',
value: '254'
}
]
const obj = {
carsList: [{
name: 'Ford',
value: '47563'
}, {
name: 'Toyota',
value: '254'
}],
pastriesList: [],
fruitsList: [{
name: 'Apple',
value: '45876'
}, {
name: 'Pineapple',
value: '84523'
}]
}
let keys = Object.keys(obj);
result = {};
for(key of keys){
let a = [...data,...obj[key]];
result[key] = a;
}