JavaScript 中访问和修改对象属性

Javascript教程 2025-10-21

JavaScript 对象在现代 Web 开发中无处不在。如果您曾经处理过用户信息、应用配置或 API 调用,那么您肯定接触过对象;它们是 JavaScript    开发的重要组成部分。为了无缝地使用对象,您应该知道如何访问它们所保存的数据,并在需要时对其进行修改。

但为什么这很重要?理解这些概念是 JavaScript 编程的基础。如果你能自信地读取和更新对象属性,就能动态管理数据,构建灵活的应用程序,并避免常见的错误。

在深入研究实际步骤之前,让我们先了解一下您将在本指南中学习到的内容。

您将学到什么

阅读完本文后,您将能够:

  • 了解 JavaScript 中的对象属性

  • 使用点符号括号符号访问对象属性

  • 通过更新、添加和删除来修改属性

  • 使用属性前检查其是否存在

  • 处理对象时应用最佳实践

听起来不错?太好了!让我们先了解一下对象属性到底是什么,然后逐步了解如何访问和修改它们。

JavaScript 中的对象属性是什么?

在 JavaScript 中,对象是键值对的集合。属性名称(或键)通常为字符串,其值可以包含任何数据类型:数字、文本、数组、函数或其他对象。

以下是一个例子:

const user = {name: "Wisdom",age: 30,isAdmin: true};

在此对象中:

nameage、    和isAdmin属性名称
"Wisdom"30、    和true是它们的

现在您已经了解了什么是属性,下一个问题是:我们如何访问它们?让我们来一探究竟。

如何在 JavaScript 中访问对象属性

访问属性意味着从对象中检索其值。JavaScript 提供了两种主要方法来实现这一点:点符号括号符号

让我们从最常见的开始:点符号。

点符号

点符号简单且使用广泛。只需输入对象名称,然后输入一个点,最后输入属性名称即可。

例子:

console.log(user.name); // Output: Wisdom
console.log(user.age); // Output: 30

在以下情况下使用点表示法:

  • 属性名称必须是有效的 JavaScript 标识符,这意味着它不能包含空格或特殊字符。

  • 您事先知道属性名称。

但是,如果属性名称来自变量或包含空格怎么办?在这种情况下,点符号不起作用。这时就需要使用括号符号了。

括号表示法

括号表示法允许您通过传递字符串或变量作为键来检索属性。

例子:

// Output: Wisdom// Using a variable as the key
console.log(user["name"]); 

const key = "age";
console.log(user[key]); // Output: 30

在以下情况下使用括号表示法:

  • 属性名称不是固定的,而是从变量动态生成的。

  • 属性名称包含空格或特殊字符。

到目前为止,您已经学习了如何读取属性。对象不仅仅是用来读取的;您经常需要更新它们或添加新属性。让我们看看如何做到这一点。

如何在 JavaScript 中修改对象属性

修改属性包括:

  • 更新现有属性。

  • 添加新属性。

  • 删除属性。

让我们逐一讨论一下。

更新现有属性

如果需要修改属性,请赋予它不同的值。

例子:

user.age = 30;console.log(user.age); // Output: 30

括号表示法也适用:

user["isAdmin"] = false;
console.log(user.isAdmin); // Output: false

现在,如果该属性尚不存在怎么办?这需要我们添加新的属性。

添加新属性

添加属性就像更新一样 - 如果它尚不存在,JavaScript 就会创建它。

例子:

user.country = "Nigeria";
console.log(user.country); // Output: Nigeria

太棒了!但有时你也需要删除某个属性。我们来看看怎么做。

删除属性

要从对象中删除属性,请使用delete运算符。

例子:

delete user.isAdmin;
console.log(user);// Output: { name: 'Wisdom', age: 30, country: 'Nigeria' }

现在您已经了解了如何读取、更新、添加和删除属性。在进行任何更改之前,最好先检查该属性是否已存在。让我们看看如何操作。

如何检查属性是否存在

JavaScript 提供了两种常用的方法:

console.log("name" in user); // true
console.log(user.hasOwnProperty("age")); // true

这在处理可选属性时很有用,例如从 API 获取数据时。

现在,让我们探索一些有效处理对象属性的最佳实践。

使用对象的最佳实践

  • 如果属性名称简单且已知,则坚持使用点符号。

  • 对于动态键或属性名称有空格时,请使用括号表示法。

  • 出于性能原因,避免频繁添加或删除属性。

  • 当您想使对象不可变时,请使用Object.freeze()Object.seal() 。

结论

对象是 JavaScript 中最强大的功能之一,了解如何访问和修改对象属性对于任何开发者来说都至关重要。您已经学习了如何:

  • 使用点括号符号访问属性。

  • 更新现有属性。

  • 添加新的。

  • 删除不需要的属性。

  • 检查属性是否存在。

掌握这些基础知识,您就可以在实际应用程序中使用复杂的数据结构。