Question

我正在尝试从字符串访问对象的嵌套属性。

这是我的示例代码：

var obj = {
  'text': 'hello',
  'foo': {
    'float': 0.5,
    'bar': {
      'id': 42
    }
  }
};

var keyOne = 'text';
var keyTwo = 'foo.float';
var keyThree = 'foo.bar.id';

console.log(obj[keyOne]); // successfully log 'hello'
console.log(obj[keyTwo]); // trying to log '0.5'
console.log(obj[keyThree]); // trying to log '42'

我正在尝试在JS中实现它，但我也已经准备好使用jQuery，以提供一种更清洁的解决方案。

Answer 1

为此，您需要进行一些遍历。

Split的路径是.，然后Array.reduce遍历各部分，每次迭代都通过bracket-notation accessor访问其引用的属性。

最终，您将获得所追求的价值。

var obj = {
  'text': 'hello',
  'foo': {
    'float': 0.5,
    'bar': {
      'id': 42,
      'baz': [{ name: 'Mary' }, { name: 'Jane' }]
    }
  }
};

var getValueByPath = (obj, path) =>
  path.split('.').reduce((acc, part) => acc ? acc[part] : undefined, obj);

var keyOne = 'text';
var keyTwo = 'foo.float';
var keyThree = 'foo.bar.id';
var keyFour = 'foo.bar.baz.1.name';

console.log(getValueByPath(obj, keyOne));
console.log(getValueByPath(obj, keyTwo));
console.log(getValueByPath(obj, keyThree));
console.log(getValueByPath(obj, keyFour));

Answer 2

这样访问有什么问题？您是否有理由需要在变量中定义键？

希望这会有所帮助：）

var obj = {
  text: 'hello',
  foo: {
    float: 0.5,
    bar: {
      id: 42,
    },
  },
};

console.log(obj.text);
console.log(obj.foo.float);
console.log(obj.foo.bar.id);

通过路径访问嵌套属性

2 个答案: