在这一章节中，我们将深入探讨如何在 JavaScript 中访问和修改对象的属性。理解这些概念对于任何前端开发人员来说都是至关重要的，因为它们是处理数据结构的核心。
对象基础知识
在深入讨论之前，我们先回顾一下 JavaScript 中对象的基础知识。一个对象是一个无序的键值对集合。每个键都与一个值相关联，这些键称为属性名，而值称为属性值。例如：
const person = {
firstName: "John",
lastName: "Doe",
age: 30,
isMarried: false
};在这个例子中，person 是一个对象，它有四个属性：firstName, lastName, age 和 isMarried。
访问对象属性
使用点符号
访问对象属性最简单的方式是使用点符号 (.)。例如，要访问 person 对象的 firstName 属性，可以这样写：
console.log(person.firstName); // 输出 "John"
使用方括号符号
当你需要使用变量或字符串表达式来访问属性时，方括号符号 ([]) 就非常有用。例如：
const propertyName = 'firstName'; console.log(person[propertyName]); // 输出 "John" console.log(person['lastName']); // 输出 "Doe"
访问嵌套对象属性
如果对象包含其他对象作为其属性值，你可以通过连续使用点符号或方括号来访问嵌套的对象属性。例如：
// www.javascriptcn.com code example
const user = {
name: 'Alice',
profile: {
email: 'alice@example.com',
bio: 'A passionate developer.'
}
};
console.log(user.profile.email); // 输出 "alice@example.com"
console.log(user['profile']['email']); // 输出 "alice@example.com"修改对象属性
直接赋值
修改对象属性同样简单，只需直接为该属性分配一个新的值即可。例如：
person.age = 31; console.log(person.age); // 输出 31
添加新属性
除了修改现有属性外，你还可以向对象添加新的属性。例如：
person.email = 'john.doe@example.com'; console.log(person.email); // 输出 "john.doe@example.com"
使用方括号动态添加属性
如果你不知道属性名称，或者需要根据条件动态添加属性，可以使用方括号符号。例如：
const newProperty = 'email'; person[newProperty] = 'john.doe@example.com'; console.log(person.email); // 输出 "john.doe@example.com"
删除对象属性
使用 delete 关键字
要从对象中删除属性，可以使用 delete 关键字。例如：
delete person.isMarried;
console.log('isMarried' in person); // 输出 false检查属性是否存在
在删除或修改属性之前，通常需要检查属性是否存在于对象中。你可以使用 in 操作符来完成这个任务。例如：
if ('age' in person) {
console.log("Age exists in the person object.");
}遍历对象属性
for-in 循环
遍历对象的所有可枚举属性可以使用 for...in 循环。例如：
for (let key in person) {
if (person.hasOwnProperty(key)) {
console.log(`${key}: ${person[key]}`);
}
}Object.keys()
另一种遍历对象属性的方法是使用 Object.keys() 方法，它返回一个包含对象所有可枚举属性名的数组。例如：
const keys = Object.keys(person);
keys.forEach(key => {
console.log(`${key}: ${person[key]}`);
});总结
通过这一章的学习，你应该掌握了如何在 JavaScript 中访问、修改和遍历对象的属性。这些基本技能对于构建复杂的数据驱动应用至关重要。接下来，我们将继续探索更多关于对象和数据操作的知识。