我有一个包含对象和数组的嵌套数据结构。我如何提取信息,即访问一个特定的或多个值(或键)?
例如:
var data = {
code: 42,
items: [{
id: 1,
name: 'foo'
}, {
id: 2,
name: 'bar'
}]
};
我如何访问项目中的第二个项目的名称?
我有一个包含对象和数组的嵌套数据结构。我如何提取信息,即访问一个特定的或多个值(或键)?
例如:
var data = {
code: 42,
items: [{
id: 1,
name: 'foo'
}, {
id: 2,
name: 'bar'
}]
};
我如何访问项目中的第二个项目的名称?
当前回答
要访问嵌套属性,需要指定其名称,然后搜索对象。
如果你已经知道确切的路径,那么你可以像这样在你的脚本中硬编码它:
data['items'][1]['name']
这些也有用——
data.items[1].name
data['items'][1].name
data.items[1]['name']
如果您事先不知道确切的名称,或者用户是为您提供名称的人。然后需要动态搜索数据结构。有些人建议可以使用for循环来完成搜索,但是有一种非常简单的方法可以使用Array.reduce遍历路径。
const data = { code: 42, items: [{ id: 1, name: 'foo' }, { id: 2, name: 'bar' }] }
const path = [ 'items', '1', 'name']
let result = path.reduce((a,v) => a[v], data)
路径的意思是:首先获取带有关键项的对象,它恰好是一个数组。然后取第1个元素(0个索引数组)。最后取该数组元素中键名的对象,恰好是字符串bar。
如果路径很长,甚至可以使用String。分开让这一切更容易-
'items.1.name'.split('.').reduce((a,v) => a[v], data)
这只是简单的JavaScript,没有使用任何第三方库,如jQuery或lodash。
其他回答
以防万一,有人在2017年或以后访问这个问题,并寻找一种容易记住的方法,这里有一篇关于在JavaScript中访问嵌套对象而不被迷惑的详细博客文章
无法读取未定义错误的属性“foo”
1. Oliver Steele的嵌套对象访问模式
最简单、最干净的方法是使用Oliver Steele的嵌套对象访问模式
const name = ((user || {}).personalInfo || {}).name;
用这个符号,你永远不会碰到
无法读取未定义的属性“名称”。
你基本上检查user是否存在,如果不存在,你立即创建一个空对象。这样,下一层键将始终从一个存在的对象或空对象访问,而不会从undefined访问。
2. 使用数组缩减访问嵌套对象
为了能够访问嵌套数组,您可以编写自己的数组reduce util。
const getNestedObject = (nestedObj, pathArr) => {
return pathArr.reduce((obj, key) =>
(obj && obj[key] !== 'undefined') ? obj[key] : undefined, nestedObj);
}
// pass in your object structure as array elements
const name = getNestedObject(user, ['personalInfo', 'name']);
// to access nested array, just pass in array index as an element the path array.
const city = getNestedObject(user, ['personalInfo', 'addresses', 0, 'city']);
// this will return the city from the first address item.
还有一种出色的类型处理最小库类型可以为您完成所有这些。
如果你愿意包含一个库,使用JSONPath将是最灵活的解决方案之一: https://github.com/s3u/JSONPath(节点和浏览器)
对于你的用例,json路径是:
$..items[1].name
so:
var secondName = jsonPath.eval(data, "$..items[1].name");
你可以使用lodash _get函数:
var object = { 'a': [{ 'b': { 'c': 3 } }] };
_.get(object, 'a[0].b.c');
// => 3
我的stringdata来自PHP文件,但仍然,我在var中表示这里。当我直接把我的json放入obj时,它不会显示什么,这就是为什么我把我的json文件作为
var obj = JSON.parse (stringdata); 所以之后,我得到消息obj,并显示在警告框,然后我得到数据,这是json数组和存储在一个变量ArrObj,然后我读取该数组的第一个对象的键值像这个ArrObj[0].id
var stringdata={
"success": true,
"message": "working",
"data": [{
"id": 1,
"name": "foo"
}]
};
var obj=JSON.parse(stringdata);
var key = "message";
alert(obj[key]);
var keyobj = "data";
var ArrObj =obj[keyobj];
alert(ArrObj[0].id);
我不认为提问只关心一个层次的嵌套对象,所以我提出下面的演示来演示如何访问深嵌套json对象的节点。好的,让我们找到id为5的节点。
var data = { code: 42, items: [{ id: 1, name: 'aaa', items: [{ id: 3, name: 'ccc' }, { id: 4, name: 'ddd' }] }, { id: 2, name: 'bbb', items: [{ id: 5, name: 'eee' }, { id: 6, name: 'fff' }] }] }; var jsonloop = new JSONLoop(data, 'id', 'items'); jsonloop.findNodeById(data, 5, function(err, node) { if (err) { document.write(err); } else { document.write(JSON.stringify(node, null, 2)); } }); <script src="https://rawgit.com/dabeng/JSON-Loop/master/JSONLoop.js"></script>