我有一个包含对象和数组的嵌套数据结构。如何提取信息，即访问特定或多个值(或键)？
例如：
var data = {
code: 42,
items: [{
id: 1,
name: 'foo'
}, {
id: 2,
name: 'bar'
}]
};
如何在items中访问第二个项目的name？
JavaScript只有一种数据类型，可以包含多个值：对象。 数组是对象的一种特殊形式。
(普通)对象的格式为
{key: value, key: value, ...}
数组的格式为
[value, value, ...]
数组和对象都公开key->value结构。数组中的键必须是数字，而任何字符串都可以用作对象中的键。键值对也称为"属性" 。
可以使用点符号
访问属性const value = obj.someProperty;
或括号符号，如果属性名称不是有效的JavaScript 标识符名称 [spec] ，或者名称是变量的值：
// the space is not a valid character in identifier names
const value = obj["some Property"];
// property name as variable
const name = "some Property";
const value = obj[name];
因此，只能使用方括号表示法来访问数组元素：
const value = arr[5]; // arr.5 would be a syntax error
// property name / index as variable
const x = 5;
const value = arr[x];
JSON是数据的文本表示形式，就像XML，YAML，CSV等一样。要使用此类数据，首先必须将其转换为JavaScript数据类型，即数组和对象(以及如何使用它们进行了解释)。问题使用JavaScript解析JSON？解释了如何解析JSON？ / p>
如何访问数组和对象是JavaScript的基本知识，因此建议阅读 MDN JavaScript指南，尤其是各部分
嵌套数据结构是引用其他数组或对象的数组或对象，即其值是数组或对象。可以通过连续应用点或括号符号来访问此类结构。
这里是一个例子：
const data = {
code: 42,
items: [{
id: 1,
name: 'foo'
}, {
id: 2,
name: 'bar'
}]
};
假设我们要访问第二项的name。
这是我们如何逐步进行：
我们可以看到data是一个对象，因此我们可以使用点表示法访问其属性。 items属性的访问方式如下：
data.items
该值是一个数组，要访问其第二个元素，我们必须使用方括号表示法：
data.items[1]
此值是一个对象，我们再次使用点符号来访问name属性。所以我们最终得到：
const item_name = data.items[1].name;
或者，我们可以对任何属性使用括号表示法，特别是如果名称中包含的字符会使其对点表示法的使用无效：
const item_name = data['items'][1]['name'];
undefined吗？在大多数情况下，当您获得undefined时，对象/数组根本没有具有该名称的属性。
const foo = {bar: {baz: 42}};
console.log(foo.baz); // undefined
使用 console.log 或 console.dir 和检查对象/数组的结构。您尝试访问的属性可能实际上是在嵌套对象/数组上定义的。
console.log(foo.bar.baz); // 42
如果属性名称未知，或者我们要访问对象/数组元素的所有属性，则可以使用 for...in [MDN] >循环对象和 for < em> [MDN] 循环使数组迭代所有属性/元素。
对象
要遍历data的所有属性，我们可以遍历 object ，如下所示：
for (const prop in data) {
// `prop` contains the name of each property, i.e. `'code'` or `'items'`
// consequently, `data[prop]` refers to the value of each property, i.e.
// either `42` or the array
}
根据对象的来源(以及您要执行的操作)，您可能必须在每次迭代中测试该属性是否确实是对象的属性，还是继承的属性。您可以使用 Object#hasOwnProperty [MDN] 。
通过hasOwnProperty代替for...in，您可以使用 Object.keys [MDN] 以获得属性名称数组：
Object.keys(data).forEach(function(prop) {
// `prop` is the property name
// `data[prop]` is the property value
});
数组
要遍历data.items 数组的所有元素，我们使用for循环：
for(let i = 0, l = data.items.length; i < l; i++) {
// `i` will take on the values `0`, `1`, `2`,..., i.e. in each iteration
// we can access the next element in the array with `data.items[i]`, example:
//
// var obj = data.items[i];
//
// Since each element is an object (in our example),
// we can now access the objects properties with `obj.id` and `obj.name`.
// We could also use `data.items[i].id`.
}
也可以使用for...in遍历数组，但是有理由应避免这样做：为什么将" for(列表中的变量项)"与数组一起视为JavaScript中的不良做法？。
随着对ECMAScript 5的浏览器支持的增加，数组方法 forEach [MDN] 也成为一个有趣的替代方法：
data.items.forEach(function(value, index, array) {
// The callback is executed for each element in the array.
// `value` is the element itself (equivalent to `array[index]`)
// `index` will be the index of the element in the array
// `array` is a reference to the array itself (i.e. `data.items` in this case)
});
在支持ES2015(ES6)的环境中，您还可以使用 for...of [MDN] 循环，其中不仅适用于数组，还适用于任何 iterable ：
for (const item of data.items) {
// `item` is the array element, **not** the index
}
在每次迭代中，for...of会直接为我们提供可迭代的下一个元素，没有访问或使用的"索引"。
如果我不知道数据结构的"深度"怎么办？
除了未知键外，它具有的数据结构的"深度"(即有多少个嵌套对象)也可能是未知的。如何访问深度嵌套的属性通常取决于确切的数据结构。
但是如果数据结构包含重复模式，例如作为二叉树的表示形式，解决方案通常包括 递归 < em> [Wikipedia] 访问数据结构的每个级别。
以下是获取二叉树的第一个叶节点的示例：
function getLeaf(node) {
if (node.leftChild) {
return getLeaf(node.leftChild); // <- recursive call
}
else if (node.rightChild) {
return getLeaf(node.rightChild); // <- recursive call
}
else { // node must be a leaf node
return node;
}
}
const first_leaf = getLeaf(root);
const root = {
leftChild: {
leftChild: {
leftChild: null,
rightChild: null,
data: 42
},
rightChild: {
leftChild: null,
rightChild: null,
data: 5
}
},
rightChild: {
leftChild: {
leftChild: null,
rightChild: null,
data: 6
},
rightChild: {
leftChild: null,
rightChild: null,
data: 7
}
}
};
function getLeaf(node) {
if (node.leftChild) {
return getLeaf(node.leftChild);
} else if (node.rightChild) {
return getLeaf(node.rightChild);
} else { // node must be a leaf node
return node;
}
}
console.log(getLeaf(root).data);
访问键和深度未知的嵌套数据结构的一种更通用的方法是测试值的类型并采取相应的措施。
这里是一个将嵌套数据结构内的所有原始值添加到数组中的示例(假定它不包含任何函数)。如果遇到一个对象(或数组)，我们只需对该值再次调用toArray(递归调用)。
function toArray(obj) {
const result = [];
for (const prop in obj) {
const value = obj[prop];
if (typeof value === 'object') {
result.push(toArray(value)); // <- recursive call
}
else {
result.push(value);
}
}
return result;
}
const data = {
code: 42,
items: [{
id: 1,
name: 'foo'
}, {
id: 2,
name: 'bar'
}]
};
function toArray(obj) {
const result = [];
for (const prop in obj) {
const value = obj[prop];
if (typeof value === 'object') {
result.push(toArray(value));
} else {
result.push(value);
}
}
return result;
}
console.log(toArray(data));
助手
由于复杂对象或数组的结构不一定很明显，因此我们可以在每个步骤中检查值以确定如何进一步移动。 console.log [ MDN] 和 console.dir [MDN] 帮助我们做到这一点。例如(Chrome控制台的输出)：
> console.log(data.items)
[ Object, Object ]
在这里，我们看到data.items是一个包含两个都是对象的元素的数组。在Chrome控制台中，对象甚至可以立即展开和检查。
> console.log(data.items[1])
Object
id: 2
name: "bar"
__proto__: Object
这告诉我们data.items[1]是一个对象，展开后，我们看到它具有三个属性，即id，name
和__proto__。后者是用于对象原型链的内部属性。但是，原型链和继承超出了此答案的范围。
您可以通过这种方式访问
data.items[1].name
或
data["items"][1]["name"]
如果您试图通过id或name从示例结构访问item，而又不知道其在数组中的位置，最简单的方法是使用 underscore.js 库：
var data = {
code: 42,
items: [{
id: 1,
name: 'foo'
}, {
id: 2,
name: 'bar'
}]
};
_.find(data.items, function(item) {
return item.id === 2;
});
// Object {id: 2, name: "bar"}
根据我的经验，使用高阶函数而不是for或for..in循环会导致代码更易于推理，因此更易于维护。 / p>
只要2美分。
对象和数组具有许多内置方法，可以帮助您处理数据。
注意：在许多示例中，我正在使用箭头功能。它们类似于函数表达式，但是它们用词法绑定this值。
Object.keys() ， Object.values() (ES 2017)和 Object.entries() (ES 2017) Object.keys()返回对象键的数组，Object.values()返回对象值的数组，Object.entries()以[key,value]的格式返回对象的键和相应值的数组。
const obj = {
a: 1
,b: 2
,c: 3
}
console.log(Object.keys(obj)) // ['a', 'b', 'c']
console.log(Object.values(obj)) // [1, 2, 3]
console.log(Object.entries(obj)) // [['a', 1], ['b', 2], ['c', 3]]
Object.entries()具有for-of循环和解构赋值
const obj = {
a: 1
,b: 2
,c: 3
}
for (const [key, value] of Object.entries(obj)) {
console.log(`key: ${key}, value: ${value}`)
}
使用
For-of循环使您可以迭代数组元素。语法是for(数组的const元素)(我们可以将const替换为var或let，但这是如果我们不打算修改element，最好使用const。
解构分配使您可以从数组或对象中提取值并将其分配给变量。在这种情况下，const[key,value]意味着我们没有将[key,value]数组分配给element，而是分配了第一个元素该数组的key和第二个元素的value。等效于此：
for (const element of Object.entries(obj)) {
const key = element[0]
,value = element[1]
}
如您所见，解构使这一过程变得更加简单。
Array.prototype.every() 和 Array.prototype.some() 如果指定的回调函数为的每个元素返回true，则every()方法将返回true。数组。如果指定的回调函数为 some (至少一个)元素返回true，则some()方法将返回true
const arr = [1, 2, 3]
// true, because every element is greater than 0
console.log(arr.every(x => x > 0))
// false, because 3^2 is greater than 5
console.log(arr.every(x => Math.pow(x, 2) < 5))
// true, because 2 is even (the remainder from dividing by 2 is 0)
console.log(arr.some(x => x % 2 === 0))
// false, because none of the elements is equal to 5
console.log(arr.some(x => x === 5))
Array.prototype.find() 和 Array.prototype.filter() find()方法返回第一个元素，该元素满足提供的回调函数。 filter()方法返回满足所提供回调函数的 all 个元素的数组。
const arr = [1, 2, 3]
// 2, because 2^2 !== 2
console.log(arr.find(x => x !== Math.pow(x, 2)))
// 1, because it's the first element
console.log(arr.find(x => true))
// undefined, because none of the elements equals 7
console.log(arr.find(x => x === 7))
// [2, 3], because these elements are greater than 1
console.log(arr.filter(x => x > 1))
// [1, 2, 3], because the function returns true for all elements
console.log(arr.filter(x => true))
// [], because none of the elements equals neither 6 nor 7
console.log(arr.filter(x => x === 6 || x === 7))
Array.prototype.map() map()方法返回一个数组，该数组具有在数组元素上调用提供的回调函数的结果。
const arr = [1, 2, 3]
console.log(arr.map(x => x + 1)) // [2, 3, 4]
console.log(arr.map(x => String.fromCharCode(96 + x))) // ['a', 'b', 'c']
console.log(arr.map(x => x)) // [1, 2, 3] (no-op)
console.log(arr.map(x => Math.pow(x, 2))) // [1, 4, 9]
console.log(arr.map(String)) // ['1', '2', '3']
Array.prototype.reduce() reduce()方法通过使用两个元素调用提供的回调函数，将数组减少为单个值。
const arr = [1, 2, 3]
// Sum of array elements.
console.log(arr.reduce((a, b) => a + b)) // 6
// The largest number in the array.
console.log(arr.reduce((a, b) => a > b ? a : b)) // 3
reduce()方法采用可选的第二个参数，它是初始值。当您在其上调用reduce()的数组可以包含零个或一个元素时，这很有用。例如，如果我们想创建一个函数sum()，该函数将数组作为参数并返回所有元素的和，则可以这样写：
const sum = arr => arr.reduce((a, b) => a + b, 0)
console.log(sum([])) // 0
console.log(sum([4])) // 4
console.log(sum([2, 5])) // 7
有时，使用字符串访问嵌套对象可能是理想的。简单的方法是第一级，例如
var obj = { hello: "world" };
var key = "hello";
alert(obj[key]);//world
但是复杂的json通常不是这种情况。随着json变得越来越复杂，在json内部查找值的方法也变得复杂。导航json的递归方法是最好的，如何利用递归取决于要搜索的数据类型。如果涉及条件语句， json搜索可能是一个很好的工具。
如果已经知道要访问的属性，但是路径很复杂，例如在此对象中
var obj = {
arr: [
{ id: 1, name: "larry" },
{ id: 2, name: "curly" },
{ id: 3, name: "moe" }
]
};
您知道您想获得对象中数组的第一个结果，也许您想使用
var moe = obj["arr[0].name"];
但是，这将导致异常，因为具有该名称的对象没有属性。能够使用此方法的解决方案将是使对象的树状外观变平。这可以递归完成。
function flatten(obj){
var root = {};
(function tree(obj, index){
var suffix = toString.call(obj) == "[object Array]" ? "]" : "";
for(var key in obj){
if(!obj.hasOwnProperty(key))continue;
root[index+key+suffix] = obj[key];
if( toString.call(obj[key]) == "[object Array]" )tree(obj[key],index+key+suffix+"[");
if( toString.call(obj[key]) == "[object Object]" )tree(obj[key],index+key+suffix+".");
}
})(obj,"");
return root;
}
现在，可以将复杂的对象展平了
var obj = previous definition;
var flat = flatten(obj);
var moe = flat["arr[0].name"];//moe
这是 jsFiddle演示 正在使用这种方法。
这个问题已经很老了，因此是当代更新。随着ES2015的出现，还有一些替代方法可以保留您所需的数据。现在有一个称为对象解构的功能，用于访问嵌套对象。
const data = {
code: 42,
items: [{
id: 1,
name: 'foo'
}, {
id: 2,
name: 'bar'
}]
};
const {
items: [, {
name: secondName
}]
} = data;
console.log(secondName);
上面的示例从名为items的数组(,
name键中创建了一个名为
secondName的变量。 code>说跳过数组中的第一个对象。
值得注意的是，由于简单的数组访问更易于阅读，因此在此示例中它可能是过大了，但是通常在拆分对象时很有用。
这是您的特定用例的非常简短的介绍，解构可能是一开始不习惯的不寻常语法。我建议阅读 Mozilla的Destructuring Assignment文档来学习更多
要访问嵌套属性，您需要指定其名称，然后搜索对象。
如果您已经知道确切的路径，则可以在脚本中对其进行硬编码，如下所示：
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)
该路径是一种表达方式：首先使用键items捕获对象，该键恰好是一个数组。然后采用1 -st元素(0个索引数组)。最后，在该数组元素中使用键为name的对象，该对象恰好为字符串bar。
如果路径很长，甚至可以使用String.split来简化所有操作-
'items.1.name'.split('.').reduce((a,v) => a[v], data)
这只是普通的JavaScript，没有使用任何第三方库(如jQuery或lodash)。
您可以使用lodash_get函数：
var object = { 'a': [{ 'b': { 'c': 3 } }] };
_.get(object, 'a[0].b.c');
// => 3
var ourStorage = {
"desk": {
"drawer": "stapler"
},
"cabinet": {
"top drawer": {
"folder1": "a file",
"folder2": "secrets"
},
"bottom drawer": "soda"
}
};
ourStorage.cabinet["top drawer"].folder2; // Outputs -> "secrets"
或
//parent.subParent.subsubParent["almost there"]["final property"]
基本上，在每个子对象之间展开一个点，该子对象在其下展开，并且当对象名称由两个字符串组成时，必须使用[" obj Name"]表示法。否则，只需一个点就足够；
为此，访问嵌套数组的方式如下：
var ourPets = [
{
animalType: "cat",
names: [
"Meowzer",
"Fluffy",
"Kit-Cat"
]
},
{
animalType: "dog",
names: [
"Spot",
"Bowser",
"Frankie"
]
}
];
ourPets[0].names[1]; // Outputs "Fluffy"
ourPets[1].names[0]; // Outputs "Spot"
另一个描述上述情况的有用文档： https ：//developer.mozilla.org/zh-CN/docs/Learn/JavaScript/Objects/Basics#Bracket_notation
通过点步行进行属性访问： https： //developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Property_Accessors#Dot_notation
使用 JSONPath 将是最灵活的解决方案之一： https://github.com/s3u/JSONPath (节点和浏览器)
对于您的用例，json路径为：
$..items[1].name
如此：
var secondName = jsonPath.eval(data, "$..items[1].name");
我更喜欢JQuery。它更干净而且易于阅读。
$.each($.parseJSON(data), function (key, value) {
alert(value.<propertyname>);
});
以防万一，有人在2017年或以后访问此问题并寻找易于记忆的方式，这是一篇关于使用JavaScript访问嵌套对象，而不会被
迷惑无法读取未定义的属性'foo'错误
最简单，最干净的方法是使用Oliver Steele的嵌套对象访问模式
const name = ((user || {}).personalInfo || {}).name;
使用这种符号，您将永远不会遇到
无法读取未定义的属性"名称" 。
基本上，您检查用户是否存在，如果不存在，则动态创建一个空对象。这样，将始终从存在的对象或空对象中访问下一级键，而永远不会从未定义的对象中访问
。要访问嵌套数组，您可以编写自己的数组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.
还有一个出色的类型处理最小型库 typy 可以为您完成所有这一切。 / p>
动态访问多级对象。
var obj = {
name: "salut",
subobj: {
subsubobj: {
names: "I am sub sub obj"
}
}
};
var level = "subobj.subsubobj.names";
level = level.split(".");
var currentObjState = obj;
for (var i = 0; i < level.length; i++) {
currentObjState = currentObjState[level[i]];
}
console.log(currentObjState);
如果您正在寻找一个或多个满足特定条件的对象，则可以使用查询来选择-js
//will return all elements with an id larger than 1
data.items.where(function(e){return e.id > 1;});
//will return the first element with an id larger than 1
data.items.first(function(e){return e.id > 1;});
//will return the first element with an id larger than 1
//or the second argument if non are found
data.items.first(function(e){return e.id > 1;},{id:-1,name:""});
还有一个single和一个singleOrDefault，它们的工作方式分别类似于first和firstOrDefault。唯一的区别是，如果发现多于个匹配项，他们将抛出。
有关query-js的进一步说明，您可以从以下发布
这是一个JavaScript库，可提供一整堆有用的功能性编程帮助器，而无需扩展任何内置对象。
var data = {
code: 42,
items: [{
id: 1,
name: 'foo'
}, {
id: 2,
name: 'bar'
}]
};
var item = _.findWhere(data.items, {
id: 2
});
if (!_.isUndefined(item)) {
console.log('NAME =>', item.name);
}
//using find -
var item = _.find(data.items, function(item) {
return item.id === 2;
});
if (!_.isUndefined(item)) {
console.log('NAME =>', item.name);
}
古老的问题，但没人提到lodash(只是下划线)。
如果您已经在项目中使用lodash，我认为在一个复杂的示例中可以采用一种优雅的方法：
选择1
_.get(response, ['output', 'fund', 'data', '0', 'children', '0', 'group', 'myValue'], '')
与：
选择2
response.output.fund.data[0].children[0].group.myValue
第一个选项和第二个选项的区别在于，在选项1 中，如果路径中缺少一个属性(未定义)，则不会出错，它会返回第三个参数。
对于数组过滤器，lodash具有_.find()，但是我宁愿使用常规的filter()。但是我仍然认为上述方法_.get()在处理真正复杂的数据时超级有用。我过去曾经面对过非常复杂的API，这很方便！
我希望它对寻找标题所暗示的真正复杂数据的选项的人有用。
我不认为发问者仅关注一个级别的嵌套对象，因此我呈现以下演示来演示如何访问深度嵌套的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));
}
});
一种Pythonic的，递归的和功能性的方法来解开任意JSON树：
handlers = {
list: iterate,
dict: delve,
str: emit_li,
float: emit_li,
}
def emit_li(stuff, strong=False):
emission = '<li><strong>%s</strong></li>' if strong else '<li>%s</li>'
print(emission % stuff)
def iterate(a_list):
print('<ul>')
map(unravel, a_list)
print('</ul>')
def delve(a_dict):
print('<ul>')
for key, value in a_dict.items():
emit_li(key, strong=True)
unravel(value)
print('</ul>')
def unravel(structure):
h = handlers[type(structure)]
return h(structure)
unravel(data)
其中 data 是一个python列表(从JSON文本字符串解析)：
data = [
{'data': {'customKey1': 'customValue1',
'customKey2': {'customSubKey1': {'customSubSubKey1': 'keyvalue'}}},
'geometry': {'location': {'lat': 37.3860517, 'lng': -122.0838511},
'viewport': {'northeast': {'lat': 37.4508789,
'lng': -122.0446721},
'southwest': {'lat': 37.3567599,
'lng': -122.1178619}}},
'name': 'Mountain View',
'scope': 'GOOGLE',
'types': ['locality', 'political']}
]
jQuery的grep 函数可用于过滤数组：
var data = {
code: 42,
items: [{
id: 1,
name: 'foo'
}, {
id: 2,
name: 'bar'
}]
};
$.grep(data.items, function(item) {
if (item.id === 2) {
console.log(item.id); //console id of item
console.log(item.name); //console name of item
console.log(item); //console item object
return item; //returns item object
}
});
// Object {id: 2, name: "bar"}
// const path = 'info.value[0].item'
// const obj = { info: { value: [ { item: 'it works!' } ], randominfo: 3 } }
// getValue(path, obj)
export const getValue = ( path , obj) => {
const newPath = path.replace(/\]/g, "")
const arrayPath = newPath.split(/[\[\.]+/) || newPath;
const final = arrayPath.reduce( (obj, k) => obj ? obj[k] : obj, obj)
return final;
}
您可以使用语法jsonObject.key来访问该值。而且，如果要访问数组中的值，则可以使用语法jsonObjectArray[index].key。
下面是访问各种值的代码示例，供您理解。
var data = {
code: 42,
items: [{
id: 1,
name: 'foo'
}, {
id: 2,
name: 'bar'
}]
};
// if you want 'bar'
console.log(data.items[1].name);
// if you want array of item names
console.log(data.items.map(x => x.name));
// get the id of the item where name = 'bar'
console.log(data.items.filter(x => (x.name == "bar") ? x.id : null)[0].id);
在下面的deep(data,key)函数中，您可以使用任意key字符串-在您的情况下为items[1].name (您可以在任何级别使用数组表示法[i])-如果键无效，则返回undefined。
let deep = (o,k) => {
return k.split('.').reduce((a,c,i) => {
let m=c.match(/(.*?)\[(\d*)\]/);
if(m && a!=null && a[m[1]]!=null) return a[m[1]][+m[2]];
return a==null ? a: a[c];
},o)
}
// TEST
let key = 'items[1].name' // arbitrary deep-key
let data = {
code: 42,
items: [{ id: 11, name: 'foo'}, { id: 22, name: 'bar'},]
};
console.log( key,'=', deep(data,key) );
在2020年，您可以使用@ babel / plugin-proposal-optional-chaining，很容易访问对象中的嵌套值。
const obj = {
foo: {
bar: {
baz: class {
},
},
},
};
const baz = new obj?.foo?.bar?.baz(); // baz instance
const safe = new obj?.qux?.baz(); // undefined
const safe2 = new obj?.foo.bar.qux?.(); // undefined
https://babeljs.io/docs/zh/babel -plugin-proposal-optional-chaining
我的stringjson来自PHP文件，但是我还是在var中指出。当我直接将json放入obj时，不会显示出多数民众赞成将我的json文件作为
varobj=JSON.parse(stringjson);，所以在此之后，我得到message obj并显示在警报框中，然后得到data这是json数组，并存储在一个变量ArrObj中，然后我读取具有键值的数组的第一个对象，例如ArrObj[0].id
var stringjson={
"success": true,
"message": "working",
"data": [{
"id": 1,
"name": "foo"
}]
};
var obj=JSON.parse(stringjson);
var key = "message";
alert(obj[key]);
var keyobj = "data";
var ArrObj =obj[keyobj];
alert(ArrObj[0].id);
使用lodash将是一个很好的解决方案
例如：
var object = { 'a': { 'b': { 'c': 3 } } };
_.get(object, 'a.b.c');
// => 3