Ich habe eine verschachtelte Datenstruktur, die Objekte und Arrays enthält. Wie kann ich Informationen extrahieren, also auf bestimmte oder mehrere Werte (oder Schlüssel) zugreifen?
Zum Beispiel:
var data = { code: 42, items: [{ id: 1, name: 'foo' }, { id: 2, name: 'bar' }] };
Wie greife ich zuitems
中第二项的name
?
您可以通过这种方式访问它
或
两种方式都是平等的。
预备知识
JavaScript 只有一种可以包含多个值的数据类型:对象。 数组是一种特殊形式的对象。
(普通)对象具有以下形式
数组的形式为
数组和对象都公开一个
key -> value
结构。数组中的键必须是数字,而任何字符串都可以用作对象中的键。键值对也称为“属性”。可以使用点符号访问属性
或括号表示法,如果属性名称不是有效的 JavaScript 标识符名称[spec],或者名称是变量的值:
因此,数组元素只能使用括号表示法访问:
等等...JSON 怎么样?
JSON 是数据的文本表示形式,就像 XML、YAML、CSV 等。要处理此类数据,首先必须将其转换为 JavaScript 数据类型,即数组和对象(刚刚解释了如何处理这些数据)。问题 在 JavaScript 中解析 JSON? 中解释了如何解析 JSON。
进一步阅读材料
如何访问数组和对象是 JavaScript 基础知识,因此建议阅读 MDN JavaScript 指南,尤其是各个部分
访问嵌套数据结构
嵌套数据结构是引用其他数组或对象的数组或对象,即它的值是数组或对象。可以通过连续应用点或括号表示法来访问此类结构。
这是一个例子:
假设我们想要访问第二个项目的
名称
。以下是我们如何逐步做到这一点:
正如我们所见,
data
是一个对象,因此我们可以使用点表示法访问其属性。items
属性的访问方式如下:该值是一个数组,要访问它的第二个元素,我们必须使用括号表示法:
这个值是一个对象,我们再次使用点表示法来访问
name
属性。所以我们最终得到:或者,我们可以对任何属性使用括号表示法,特别是如果名称包含使其对点表示法无效的字符:
我正在尝试访问某个属性,但只得到
undefined
信息?大多数情况下,当您遇到
未定义
时,对象/数组根本不具有具有该名称的属性。使用
console.log
或console.dir
和检查对象/数组的结构。您尝试访问的属性实际上可能是在嵌套对象/数组上定义的。如果属性名称是动态的并且我事先不知道它们怎么办?
如果属性名称未知或者我们想要访问对象/数组元素的所有属性,我们可以使用
for...in
[MDN] 循环对象和for
[MDN] 循环数组以迭代所有属性/元素。对象
要迭代
data
的所有属性,我们可以迭代对象,如下所示:根据对象的来源(以及您想要执行的操作),您可能必须在每次迭代中测试该属性是否确实是对象的属性,还是继承的属性。您可以使用
Object#hasOwnProperty代码> [MDN]
。作为
for...in
和hasOwnProperty
的替代方案,您可以使用Object.keys
[MDN] 获取属性名称数组:数组
要迭代
data.items
数组 的所有元素,我们使用for
循环: