Динамический доступ к свойству объекта с помощью переменной

Question

Я пытаюсь получить доступ к свойству объекта, используя динамическое имя.Возможно ли это?

const something = { bar: "Foobar!" };
const foo = 'bar';
something.foo; // The idea is to access something.bar, getting "Foobar!"

Answer 1

Существует два способа доступа к свойствам объекта:

• Обозначение точки: something.bar
• Обозначение скобки: something['bar']

Значение в скобках может быть любым выражением.Поэтому, если имя свойства хранится в переменной, вы должны использовать скобки:

var foo = 'bar';
something[foo];
// both x = something[foo] and something[foo] = x work as expected

Answer 2

Это мое решение:

function resolve(path, obj) {
    return path.split('.').reduce(function(prev, curr) {
        return prev ? prev[curr] : null
    }, obj || self)
}

Примеры использования:

resolve("document.body.style.width")
// or
resolve("style.width", document.body)
// or even use array indexes
// (someObject has been defined in the question)
resolve("part.0.size", someObject) 
// returns null when intermediate properties are not defined:
resolve('properties.that.do.not.exist', {hello:'world'})

Answer 3

В javascript мы можем получить доступ с:

• точечная запись - foo.bar
• квадратные скобки - foo[someVar] или foo["string"]

Но только второй случай позволяет динамически обращаться к свойствам:

var foo = { pName1 : 1, pName2 : [1, {foo : bar }, 3] , ...}

var name = "pName"
var num  = 1;

foo[name + num]; // 1

// -- 

var a = 2;
var b = 1;
var c = "foo";

foo[name + a][b][c]; // bar

Answer 4

Ниже приведен пример ES6 того, как вы можете получить доступ к свойству объекта, используя имя свойства, которое было динамически создано путем объединения двух строк.

var suffix = " name";

var person = {
    ["first" + suffix]: "Nicholas",
    ["last" + suffix]: "Zakas"
};

console.log(person["first name"]);      // "Nicholas"
console.log(person["last name"]);       // "Zakas"

Это называется именами вычисляемых свойств

Answer 5

Вы можете достичь этого несколькими различными способами.

let foo = {
    bar: 'Hello World'
};

foo.bar;
foo['bar'];

Обозначение в скобках является особенно мощным, поскольку оно позволяет вам получить доступ к свойству на основе переменной:

let foo = {
    bar: 'Hello World'
};

let prop = 'bar';

foo[prop];

Это может быть расширено зацикливанием на каждом свойстве объекта. Это может показаться излишним из-за более новых конструкций JavaScript, таких как for ... of ..., но помогает проиллюстрировать пример использования:

let foo = {
    bar: 'Hello World',
    baz: 'How are you doing?',
    last: 'Quite alright'
};

for (let prop in foo.getOwnPropertyNames()) {
    console.log(foo[prop]);
}

Обозначения в виде точек и скобок также работают должным образом для вложенных объектов:

let foo = {
    bar: {
        baz: 'Hello World'
    }
};

foo.bar.baz;
foo['bar']['baz'];
foo.bar['baz'];
foo['bar'].baz;

Разрушение объекта

Мы также можем рассматривать деструктуризацию объекта как средство доступа к свойству объекта, но следующим образом:

let foo = {
    bar: 'Hello World',
    baz: 'How are you doing?',
    last: 'Quite alright'
};

let prop = 'last';
let { bar, baz, [prop]: customName } = foo;

// bar = 'Hello World'
// baz = 'How are you doing?'
// customName = 'Quite alright'

Answer 6

Вы можете сделать это, используя Lodash get

_.get(object, 'a[0].b.c');

Answer 7

ОБНОВЛЕНО

Я учел комментарии ниже и согласился. Эвала следует избегать.

Доступ к корневым свойствам объекта легко достигается с помощью obj[variable], но получение вложенных элементов усложняет задачу. Чтобы не писать уже написанный код, я предлагаю использовать lodash.get.

Пример

// Accessing root property
var rootProp = 'rootPropert';
_.get(object, rootProp, defaultValue);

// Accessing nested property
var listOfNestedProperties = [var1, var2];
_.get(object, listOfNestedProperties);

Lodash get можно использовать по-разному, вот ссылка на документацию lodash.get

Answer 8

Когда вам нужен динамический доступ к свойству, вы должны использовать квадратную скобку для доступа к свойству, а не "."оператор
Синтаксис: object [Propery}

const something = { bar: "Foobar!" };
const foo = 'bar';
// something.foo; -- not correct way at it is expecting foo as proprty in  something={ foo: "value"};
// correct way is  something[foo]
alert( something[foo])

Answer 9

Интересно, когда вам нужно передать параметры и этой функции.

Код jsfiddle

var obj = {method:function(p1,p2,p3){console.log("method:",arguments)}}

var str = "method('p1', 'p2', 'p3');"

var match = str.match(/^\s*(\S+)\((.*)\);\s*$/);

var func = match[1]
var parameters = match[2].split(',');
for(var i = 0; i < parameters.length; ++i) {
  // clean up param begninning
    parameters[i] = parameters[i].replace(/^\s*['"]?/,'');
  // clean up param end
  parameters[i] = parameters[i].replace(/['"]?\s*$/,'');
}

obj[func](parameters); // sends parameters as array
obj[func].apply(this, parameters); // sends parameters as individual values

Answer 10

const something = { bar: "Foobar!" };
const foo = 'bar';

something[\`${foo}\`];