JavaScript匿名对象访问方法及数组内对象属性获取问题

嘿，我明白你现在卡在哪了——你把数组和数组里的对象搞混啦！咱们一步步来拆解：

为什么你之前的尝试都失败了？ #

你定义的array是一个数组，它里面装着两个对象，但数组本身并没有username这个属性。你直接用array.username、array['username']去访问，本质是在问数组本身有没有这个属性，当然会返回undefined啦；而this.array.username如果this没指向正确的上下文，this.array可能都是undefined，自然会报错“无法读取未定义的属性”。

正确访问数组中对象属性的方式 #

1. 访问单个对象的属性 #

数组是按索引（从0开始）存储元素的，你得先通过索引拿到数组里的某个对象，再访问它的属性：

const array = [ 
  { username: "john", team: "red", score: 5, items: ["ball", "book", "pen"] }, 
  { username: "becky", team: "blue", score: 10, items: ["tape", "backpack", "pen"] }
];

// 访问第一个对象的username
console.log(array[0].username); // 输出 "john"
// 访问第二个对象的team
console.log(array[1].team); // 输出 "blue"
// 甚至可以嵌套访问，比如第一个对象的items数组的第一个元素
console.log(array[0].items[0]); // 输出 "ball"

2. 遍历所有对象的属性 #

如果要批量访问数组里所有对象的属性，可以用数组遍历方法，比如forEach：

array.forEach(user => {
  console.log(`用户名：${user.username}，队伍：${user.team}`);
});

或者用for...of循环：

for (const user of array) {
  console.log(`${user.username}的分数是${user.score}`);
}

关于JavaScript中匿名对象的访问 #

匿名对象就是没有被赋值给变量的对象（比如{ foo: "bar" }这种直接写的对象），访问它的属性其实和普通对象一样，只要能“触达”它就行：

1. 直接创建后立即访问 #

// 直接访问匿名对象的属性
console.log({ username: "amy", team: "green" }.username); // 输出 "amy"

2. 作为函数参数时访问 #

把匿名对象传给函数，在函数内部访问它的属性：

function printUserInfo(user) {
  console.log(`用户：${user.username}，所属队伍：${user.team}`);
}

// 直接把匿名对象作为参数传入
printUserInfo({ username: "amy", team: "green" });

3. 在嵌套结构中访问 #

比如在数组、对象嵌套里的匿名对象，同样通过索引/键来访问：

// 数组里的匿名对象，和你最开始的场景类似
const users = [
  { username: "lisa", score: 8 },
  { username: "tom", score: 7 }
];
console.log(users[0].score); // 输出 8

内容的提问来源于stack exchange，提问作者Codebebe