Как создать свойство объекта из значения переменной в JavaScript?

Я хочу добавить новое свойство к myObj, назвать его string1 и присвоить ему значение string2, но когда я это сделаю, оно вернет undefined:

var myObj = new Object;
var a = 'string1';
var b = 'string2';
myObj.a = b;

alert(myObj.string1); //Returns 'undefined'
alert(myObj.a); //Returns 'string2'

Другими словами: как мне создать свойство объекта и дать ему имя, хранящееся в переменной, но не имя самой переменной?


person ecu    schedule 11.02.2010    source источник
comment
@Bergi, этот вопрос и ответ не повторяются! Другой - JQuery, а этот - vanilla js   -  person daniella    schedule 17.03.2017
comment
@daniella Свойство объекта - это абсолютно простой JavaScript. То, что он используется в примере jQuery, не имеет значения.   -  person Bergi    schedule 18.03.2017
comment
Для записи никогда не используйте new Object; Вместо этого используйте литерал объекта: var myObj = {}   -  person fregante    schedule 22.06.2019


Ответы (9)


Есть точечное обозначение и обозначение скобок

myObj[a] = b;
person philfreo    schedule 11.02.2010
comment
На самом деле они не эквивалентны; myObj.a = b означает нечто иное, чем myObj[a] = b (кроме a == 'a'), но что угодно ... это то, что вы хотите. - person Dominic Cooney; 11.02.2010
comment
Я имел в виду, что это эквивалентные способы установки свойства. Очевидно, они ведут себя по-разному (отсюда и цель публикации этого ответа), но результат у них одинаковый. - person philfreo; 11.02.2010
comment
philfreo: за исключением того, что у них разный результат, который является основанием для этого вопроса. - person bukzor; 25.08.2011
comment
Я просто сказал, что есть два способа установить объект: один для случая, когда ключ жестко запрограммирован, а другой, когда он переменный. Я имел в виду, что результат объекта эквивалентен, независимо от того, используете ли вы myObj['foo'] = 'bar' или myObj.foo = 'bar' - person philfreo; 25.08.2011
comment
Как-то этот метод дал мне массив [a:b] вместо {a:b} - person Jhourlad Estrella; 28.08.2018

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

var myObj = {[a]: b};

Обратите внимание, поддержка браузеров в настоящее время незначительна.

person Oriol    schedule 15.08.2014
comment
Хотя работает с Babel. - person Zequez; 06.11.2015
comment
Для таких, как я, которые разрабатывают с использованием Node.js и нуждаются в этом только для серверной части, поэтому не беспокоятся о реализациях браузера, это было ОЧЕНЬ полезно. Должно быть больше голосов! - person lucasnadalutti; 06.11.2015
comment
На самом деле это выглядит как единственный способ создать анонимный объект с переменной в качестве ключа, что очень полезно, когда вам просто нужно поместить это в массив. - person cocheci; 06.11.2015
comment
Какие браузеры это в настоящее время поддерживает? - person Jessica; 11.05.2016
comment
@Jessica kangax.github.io/compat-table/es6/ - person Oriol; 11.05.2016
comment
Здорово! Другие браузеры поддерживают это? - person stefcud; 17.05.2016
comment
Это просто спасло мне день! - person DongBin Kim; 28.03.2018
comment
Для справки см. имена вычисленных свойств MDN ES2015 Совместимость с браузером: Chrome 47+, Edge, Opera 34+ и Safari 8+. Не поддерживается в IE <= 11. - person Will B.; 03.07.2019
comment
Сейчас это в значительной степени поддерживает множество браузеров. Кроме IE, конечно. - person Arpan Srivastava; 21.08.2019

Точечная запись и свойства эквивалентны. Итак, вы бы сделали так:

var myObj = new Object;
var a = 'string1';
myObj[a] = 'whatever';
alert(myObj.string1)

(предупреждает "что угодно")

person cgp    schedule 11.02.2010

Ecu, если вы сделаете myObj.a, он будет искать свойство с именем a из myObj. Если вы сделаете myObj[a] =b, он будет искать свойство a.valueOf() myObj.

person user286806    schedule 25.08.2011

Один лайнер:

obj = (function(attr, val){ var a = {}; a[attr]=val; return a; })('hash', 5);

Or:

attr = 'hash';
val = 5;
var obj = (obj={}, obj[attr]=val, obj);

Что-нибудь короче?

person user2846569    schedule 12.12.2013
comment
Я не уверен, можно ли считать это однострочным, поскольку функция внутри имеет три оператора, а не один (что обычно является требованием однострочности). - person Andrew Larsson; 27.04.2014
comment
en.wikipedia.org/wiki/One-liner_program - person user2846569; 27.04.2014
comment
Мне нравится элегантность второго фрагмента. Это имеет смысл, потому что var выполняет два действия, и одно из первых заключается в том, что он определяет переменную как undefined. - person Trent; 26.02.2015
comment
не очень читабельно. - person Shahar; 29.05.2016

Вы можете просто использовать это:

function createObject(propName, propValue){
    this[propName] = propValue;
}
var myObj1 = new createObject('string1','string2');

Все, что вы передаете в качестве первого параметра, будет именем свойства, а второй параметр - значением свойства.

person Aaron George    schedule 20.08.2013

Вы не можете использовать переменную для доступа к свойству через точечную нотацию, вместо этого используйте нотацию массива.

var obj= {
     'name' : 'jroi'
};
var a = 'name';
alert(obj.a); //will not work
alert(obj[a]); //should work and alert jroi'
person jroi_web    schedule 19.08.2014

Поскольку $ scope - это объект, вы можете попробовать использовать JavaScript:

$scope['something'] = 'hey'

Это равно:

$scope.something = 'hey'

Я создал скрипку для тестирования.

person Tuan    schedule 09.10.2014

Следующее демонстрирует альтернативный подход для возврата объекта пары ключей с использованием формы (a, b). В первом примере в качестве имени свойства используется строка 'key', а в качестве значения - 'val'.

Пример №1:

(function(o,a,b){return o[a]=b,o})({},'key','val');

Пример: №2:

var obj = { foo: 'bar' };
(function(o,a,b){return o[a]=b,o})(obj,'key','val');

Как показано во втором примере, это может также изменить существующие объекты (если свойство уже определено в объекте, значение будет перезаписано).

Результат №1: { key: 'val' }

Результат 2: { foo: 'bar', key: 'val' }

person Trent    schedule 25.02.2015