Как установить имя свойства объекта JS из переменной

178

Мне нужно установить имя свойства объекта JS динамически.

for(i=1; i<3; i++) {
    var key  = i+'name';

    data = {
        key : 'name1',
    }
}

Результат должен быть:

data = {
    1name: 'name1'
    2name: 'name1'
}

javascript

— Винот Бабу
источник

Если они последовательные, почему вы не используете массив?

— Epascarello

Я хочу знать, кто из вас трех попал не в ту стрелу. Да ладно, признаться.

— Чарльз

1

возможный дубликат использования переменной для ключа в

— литерале

194

var jsonVariable = {};
for(var i=1; i < 3; i++) {
  jsonVariable[i + 'name'] = 'name' + i;        
}

— закрытие
источник

4

В приведенном ниже ответе Мусы также правильно сформулировано, что использование нотации [] на самом деле является единственным способом сделать это.

— Деннис Плуциник

1

Также обратите внимание, что ответ @ ChilNut ниже теперь описывает самый простой способ сделать это с помощью ES6

— rambossa

1

Фактически, с новым синтаксисом то, что пытается достичь OP, будет возможно только в том случае, если предел цикла жестко задан и мал

— Муса

168

Вам придется использовать []нотацию для динамической установки ключей.

var jsonVariable = {};
for(i=1; i<3; i++) {        
 var jsonKey  = i+'name';
 jsonVariable[jsonKey] = 'name1';

}

Теперь в ES6 вы можете использовать литеральный синтаксис объекта для динамического создания ключей объекта, просто обернув переменную в []

var key  = i + 'name';
data = {
    [key] : 'name1',
}

— Musa
источник

3

jsonVariable = {}; не должен быть инициализирован внутри цикла for.

— закрытие

Также вы делаете jsonVariable global здесь

— Деннис Плуциник

130

С ECMAScript 6 вы можете использовать имена переменных свойств с литеральным синтаксисом объекта, например так:

var keyName = 'myKey';
var obj = {
              [keyName]: 1
          };
obj.myKey;//1

Этот синтаксис доступен в следующих новых браузерах:

Edge 12+ (без поддержки IE), FF34 +, Chrome 44+, Opera 31+, Safari 7.1+

( https://kangax.github.io/compat-table/es6/ )

Вы можете добавить поддержку старых браузеров с помощью транспилятора, такого как babel . Весь проект легко перенести, если вы используете пакетный модуль, такой как накопительный пакет или веб-пакет .

— chiliNUT
источник

2

Спасибо за добавление потрясающего синтаксиса

— ES6

Без ES6 я не могу определить var payload = {dynamicKey: val}, мне нужно сделать var payload = {} и payload [variableName] = val.

— Sainath SR

23

Это способ динамически установить значение

var jsonVariable = {};
for (var i = 1; i < 3; i++) {
    var jsonKey = i + 'name';
    jsonVariable[jsonKey] = 'name' + i;
}

— ТММК
источник

20

Используйте переменную в качестве ключа объекта

let key = 'myKey';

let data = {[key] : 'name1'; }

Смотрите Как итерировать на вашем объекте здесь

— Борис Детри
источник

Не могли бы вы рассказать немного подробнее, чтобы другие знали, почему это может быть решением?

— Фаберест

Информация, которую вы добавили, в порядке, просто никогда не отвечайте только с помощью кода;)

— Фаберест

7

Неважно, откуда берется переменная. Главное, что у нас есть один ... Задайте имя переменной в квадратных скобках "[..]".

var optionName = 'nameA';
var JsonVar = {
[optionName] : 'some value'
}

— Кнут Геринг
источник

Это хорошо работает, интересно, работает ли оно во всех браузерах / версиях

— Mercury

1

jsonVariable = {}
for(i=1; i<3; i++) {        
   var jsonKey  = i+'name';
   jsonVariable[jsonKey] = 'name1'
}

это будет похоже на

    jsonVariable = {
    1name : 'name1'
    2name : 'name1'
}

— Суман
источник

0

Следуя приведенному выше комментарию Sainath SR, я смог установить имя свойства объекта js из переменной в скрипте Google Apps (которая пока не поддерживает ES6), определив объект, а затем определив другой ключ / значение вне объекта:

var salesperson = ...

var mailchimpInterests = { 
        "aGroupId": true,
    };

mailchimpInterests[salesperson] = true;

— Марк Корриган
источник