Я пытаюсь получить доступ к свойству объекта, используя динамическое имя. Это возможно?
const something = { bar: "Foobar!" };
const foo = 'bar';
something.foo; // The idea is to access something.bar, getting "Foobar!"
javascript
object
properties
RichW
источник
источник
Ответы:
Есть два способа получить доступ к свойствам объекта:
something.bar
something['bar']
Значение в скобках может быть любым выражением. Следовательно, если имя свойства хранится в переменной, вы должны использовать скобочные обозначения:
источник
Это мое решение:
Примеры использования:
источник
В javascript мы можем получить доступ с:
foo.bar
foo[someVar]
илиfoo["string"]
Но только второй случай позволяет динамически обращаться к свойствам:
источник
Ниже приведен пример ES6 о том, как вы можете получить доступ к свойству объекта, используя имя свойства, которое было динамически сгенерировано путем объединения двух строк.
Это называется вычисляемым именем свойства
источник
Вы можете достичь этого несколькими различными способами.
Скобка нотации особенно мощная, так как она позволяет вам получить доступ к свойству на основе переменной:
Это может быть расширено зацикливанием на каждом свойстве объекта. Это может показаться излишним из-за более новых конструкций JavaScript, таких как for ... of ..., но помогает проиллюстрировать пример использования:
Обозначения в виде точек и скобок также работают, как ожидается, для вложенных объектов:
Деструктуризация объекта
Мы могли бы также рассмотреть деструктуризацию объекта как средство доступа к свойству объекта, но следующим образом:
источник
Вы можете сделать это, используя Lodash get
источник
ОБНОВЛЕНО
Я принял во внимание комментарии ниже и согласился. Эвала следует избегать.
Доступ к корневым свойствам в объекте легко достигается с помощью
obj[variable]
, но получение вложенности усложняет задачу. Не писать уже написанный код, который я предлагаю использоватьlodash.get
.пример
Lodash get можно использовать по-разному, вот ссылка на документацию lodash.get
источник
eval
возможности. stackoverflow.com/questions/86513/…eval
чего-то столь же тривиального, как доступ к свойствам, является излишним излишним и вряд ли целесообразным при любых обстоятельствах. Что за "беда"?obj['nested']['test']
работает очень хорошо и не требует от вас встраивания кода в строки.obj['nested']['value']
- помните детей, Eval это зло!_.get
к столу. Я думаю, что этот ответ заслуживает теперь положительных, а не отрицательных голосов. Это может быть излишним, но хорошо знать, что оно существует.Всякий раз, когда вам нужен динамический доступ к свойству, вы должны использовать квадратную скобку для доступа к свойству, а не "." Синтаксис оператора
: object [Propery}
источник
Я наткнулся на случай, когда я подумал захотелось передать «адрес» свойства объекта в виде данных другой функции и заполнить объект (с помощью AJAX), выполнить поиск из массива адресов и отобразить в этой другой функции. Я не мог использовать точечную запись без строковой акробатики, поэтому я подумал, что вместо этого лучше передать массив. В конце концов, я все-таки сделал что-то другое, но, похоже, связано с этим постом.
Вот пример объекта языкового файла, подобного тому, из которого я хотел получить данные:
Я хотел иметь возможность передавать массив, такой как: [«audioPlayer», «controls», «stop»] для доступа к тексту языка, в этом случае «stop».
Я создал эту маленькую функцию, которая ищет «наименее специфический» (первый) параметр адреса и переназначает возвращаемый объект самому себе. Затем он готов искать следующий наиболее специфический параметр адреса, если он существует.
Применение:
источник
Это становится интересным, когда вам нужно передать параметры и этой функции.
Код jsfiddle
источник
ES5 // Проверка глубоко вложенных переменных
Этот простой кусок кода может проверить наличие глубоко вложенных переменных / значений без необходимости проверять каждую переменную по пути ...
Ex. - глубоко вложенный массив объектов:
Вместо :
Теперь мы можем:
Ура!
источник
Function
вместо негоЯ задал вопрос, который как бы дублировал эту тему некоторое время назад, и после чрезмерного исследования, и, увидев, что здесь не хватает большого количества информации, я чувствую, что могу добавить кое-что ценное в этот старый пост.
однако я редко иду по этому пути, потому что он не работает со значениями свойств, назначенными через таблицы стилей. Чтобы привести пример, я продемонстрирую немного псевдокода.
Используя пример кода выше; если свойство width элемента div, который был сохранен в переменной 'elem', было стилизовано в таблице стилей CSS, а не внутри его тега HTML, вы, без сомнения, получите возвращаемое значение undefined, хранящееся внутри переменной cssProp. Неопределенное значение возникает из-за того, что для получения правильного значения код, написанный внутри таблицы стилей CSS, должен быть рассчитан для получения значения; Вы должны использовать метод, который будет вычислять значение свойства, значение которого находится в таблице стилей.
W3Schools getComputedValue Doc Это хороший пример и позволяет вам поиграть с ним, однако, эта ссылка Mozilla CSS getComputedValue doc рассказывает о функции getComputedValue подробно и должна быть прочитана любым начинающим разработчиком, который не совсем понимает эту тему.
... получает и устанавливает. Это то, что я использую, единственным недостатком является то, что вы познакомились с JQuery, но это, честно говоря, одна из очень многих веских причин, по которой каждый Javascript Developer должен изучать JQuery, это просто упрощает жизнь и предлагает методы, подобные этому, который недоступно со стандартным Javascript. Надеюсь, это поможет кому-то !!!
источник
Для тех, кто хочет установить значение вложенной переменной, вот как это сделать:
Документация: https://lodash.com/docs/4.17.15#set
Кроме того, документация, если вы хотите получить значение: https://lodash.com/docs/4.17.15#get
источник
Вы должны использовать
JSON.parse
, посмотрите на https://www.w3schools.com/js/js_json_parse.aspисточник
источник
foo
уже строка, так`${foo}`
что точно так же, какfoo
. (Кроме того, ваш код, кажется, имеет некоторые дополнительные обратные слеши, которые не принадлежат ему. Но он все равно будет бессмысленным, даже если вы исправите эту синтаксическую ошибку.)