极客教程JavaScript 如何访问和处理嵌套对象、数组或JSON
JavaScript 是一种脚本语言或编程语言，允许您在网页上实现复杂功能，使它们比静态网站更具动态性。许多时候，我们需要数据结构，如对象、数组或 JavaScript 对象表示法（JSON），以临时保存硬编码或从数据库接收的数据。有时，当数据变得更加复杂时，我们倾向于将其存储在嵌套的或级联的数据结构中，即一个容器嵌套到另一个容器中，以便更轻松地访问和检索数据。下面列出了访问此类嵌套或级联对象、数组和JSON的方法。在本文中，我们将看到如何访问嵌套的 JavaScript 对象、数组或 JavaScript 对象表示法（JSON）。
对象： JavaScript 对象是一个容器，以键值对的形式保存对象的属性。可以使用点符号或方括号符号访问对象的属性。包含在其他对象中的对象称为嵌套或级联对象。通过连续应用点号或方括号符号可以访问嵌套对象中的值。
方法1： 使用点符号访问属性
语法：
objectName.property1Name.propert2Name...
点符号方法会检查对象中的属性名，如果存在，则返回与该属性关联的值。如果返回的值是一个对象，则可以再次使用点符号访问该对象的子属性，直到达到所需的属性值为止。
例子： 考虑一个名为person的对象，它具有名为name和contact的属性，其中contact是一个包含电话、电子邮件和地址等属性的对象，而地址又是一个包含城市和国家等属性的对象。使用点符号访问城市属性可以进行如下操作： person.contact.address.city
Javascript
let person = {
name: "John",
contact: {
phone: "987-654-3210",
email: "john123@xyz.com",
address: {
city: "Berlin",
country: "Germany"
}
}
};
console.log(person.contact.email);
console.log(person.contact.address.city);
输出:
john123@xyz.com
Berlin
方法2： 通过方括号表示法访问属性
语法：
objectName[property1Name][propertyName2]...
方括号表示法方法通过将方括号符号中提供的字符串值与对象的属性进行比较来检查对象内部的属性名称，并且如果存在，则返回与该属性关联的值。如果返回的值是一个对象，则可以使用相同的方法再次访问该对象的子属性，直到达到所需的属性值。
示例： 考虑一个名为person的对象，其中包含名为name和contact的属性，其中contact是一个包含属性phone、email和address的对象，其中address是一个包含属性city和country的对象。使用方括号表示法访问city属性可以使用 person["contact"]["address"]["city"] 。
Javascript
let person = {
name: "Shaun",
contact: {
phone: "934-379-1420",
email: "shaun2000@abc.com",
address: {
city: "London",
country: "United Kingdom"
}
}
};
console.log(person["contact"]["email"]);
console.log(person["contact"]["address"]["country"]);
输出：
shaun2000@abc.com
United Kingdom
数组： JavaScript数组是一种特定类型的容器，可以容纳相同或不同数据类型的多个数据。可以使用索引（从0开始的索引）来访问数组中的值。包含其他数组的数组称为嵌套数组或级联数组。通过连续使用数组的索引可以访问嵌套数组内部的值。
语法：
arrayName[index1][index2]...
示例: 考虑一个数组数组，名为arr。要访问索引0处元素的值，并且在其中索引为1的元素，我们使用以下符号表示 arr[0][1] 。
考虑下面的代码来访问嵌套数组内的元素
Javascript
const arr = [
["Rohit Sharma",45],
["Virat Kohli",18],
["M S Dhoni",7]
];
console.log(arr[0][1]);
console.log(arr[2][0]);
输出
45
M S Dhoni
JavaScript对象标记（JSON）: JSON是一种轻量级数据交换格式，用于在计算机或服务器之间发送数据。JSON与JavaScript对象几乎相似，但JSON中的键应强制使用字符串，而值可以是除了函数、日期和未定义之外的任何数据类型。嵌套或级联的JSON与JavaScript对象的访问方式相同，除非包含空格、点或括号的键字符串只能使用JavaScript对象的方括号表示法进行访问。
方法1: 使用点符号访问JSON属性
语法:
jsonObject.property1Name.property2Name...
与JavaScript对象一样，JSON属性也可以使用点符号来访问。在此过程中，提供的属性名称与JSON的属性进行比较，如果匹配则返回相应的值。如果返回的值是另一个JSON对象，则可以以相同的方式访问其更多子属性。
示例： 考虑一个名为myJSON的JSON，它具有属性的Boss、Department、Department id以及employees的JSON数组，其中employees数组内的JSON包含name和age。要访问索引1处的员工姓名，可以使用点符号表示为 myJSON.employees[1].name ，使用方括号表示法为 myJSON["employees"][1]["name"] 。
Javascript
let myJSON = {
"Boss" : "John",
"Department" : "Finance",
"Department id": 3,
"employees":[
{
"name":"Shaun",
"age": 30
},
{
"name":"Paul",
"age" : 27
}
]
};
console.log(myJSON.employees[1].name);
console.log(myJSON["employees"][1]["name"]);
输出
Paul
Paul
方法2： 通过方括号表示法访问JSON属性
语法：
jsonObject["property1Name"]["property2Name"]...
就像JavaScript对象一样，JSON属性也可以使用方括号来访问。在这种情况下，提供的属性名称字符串将与JSON的属性进行比较，如果匹配，则返回相应的值。如果返回的值是另一个JSON对象，那么可以以相同的方式访问其进一步的子属性。
示例： 考虑一个名为 myJSON 的JSON，其中包含Boss、Department、Department id和employees数组，employees数组中的JSON包含name和age。要访问Department id属性，不能使用点表示法，因为它们之间有空格，因此必须使用方括号表示法以避免任何语法错误。可以这样做 myJSON[“Department id”]
JavaScript
let myJSON = {
"Boss" : "John",
"Department" : "Finance",
"Department id": 3,
"employees":[
{
"name":"Shaun",
"age": 30
},
{
"name":"Paul",
"age" : 27
}
]
};
console.log(myJSON["Department id"]);
输出
3