通过字符串路径访问嵌套的 JavaScript 对象和数组

新手上路,请多包涵

我有这样的数据结构:

 var someObject = {
 'part1' : {
 'name': 'Part 1',
 'size': '20',
 'qty' : '50'
 },
 'part2' : {
 'name': 'Part 2',
 'size': '15',
 'qty' : '60'
 },
 'part3' : [
 {
 'name': 'Part 3A',
 'size': '10',
 'qty' : '20'
 }, {
 'name': 'Part 3B',
 'size': '5',
 'qty' : '20'
 }, {
 'name': 'Part 3C',
 'size': '7.5',
 'qty' : '20'
 }
 ]
 };

我想使用这些变量访问数据:

 var part1name = "part1.name";
 var part2quantity = "part2.qty";
 var part3name1 = "part3[0].name";

part1name 应填写 someObject.part1.name 的值,即“Part 1”。与填充 60 的 part2quantity 相同。

无论如何用纯javascript或JQuery来实现这一点?

原文由 Komaruloh 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 958
2 个回答

我只是根据我已经拥有的一些类似代码制作了这个,它似乎可以工作:

 Object.byString = function(o, s) {
 s = s.replace(/\[(\w+)\]/g, '.$1'); // convert indexes to properties
 s = s.replace(/^\./, ''); // strip a leading dot
 var a = s.split('.');
 for (var i = 0, n = a.length; i < n; ++i) {
 var k = a[i];
 if (k in o) {
 o = o[k];
 } else {
 return;
 }
 }
 return o;
 }

用法::

 Object.byString(someObj, 'part3[0].name');

请参阅 http://jsfiddle.net/alnitak/hEsys/ 上的工作演示

编辑 有些人注意到,如果传递一个字符串,其中最左边的索引不对应于对象内正确嵌套的条目,则此代码将引发错误。这是一个有效的问题,但恕我直言,最好在调用时使用 try / catch 块来解决,而不是让此函数静默返回 undefined 无效索引。

原文由 Alnitak 发布,翻译遵循 CC BY-SA 3.0 许可协议

 DotObject = obj => new Proxy(obj, {
 get: function(o,k) {
 const m = k.match(/(.+?)\.(.+)/)
 return m ? this.get(o[m[1]], m[2]) : o[k]
 }
 })

 const test = DotObject({a: {b: {c: 'wow'}}})
 console.log(test['abc'])

原文由 Giulio 发布,翻译遵循 CC BY-SA 4.0 许可协议

推荐问题