如何在 JavaScript 中创建对象属性?
JavaScript 对象属性是 JavaScript 对象主体内的键。对象属性可以是三种原始数据类型中的任何一种，也可以是任何抽象数据类型，例如另一个对象。对象属性通常是对象方法内部使用的变量，但也可以是整个页面中使用的全局可见变量。这些属性可以由程序员在对象声明时静态输入，也可以根据需要在以后修改或创建。
有两种方法可以创建或向 JavaScript 对象添加属性 -
- 使用点符号
- 使用方括号符号
让我们通过代码示例逐一研究它们。
使用点符号
您可以使用点语法添加或创建 JavaScript 对象属性。要使用点语法，请在新属性或键名称与现有对象的名称之间使用点，并通过赋值运算符为其分配一个值，如下所示 -
语法
以下是使用点语法创建或向 JavaScript 对象添加新属性的语法 -
objectName.propertyName = propertyValue;
在上述语法中，objectName 是一个已声明的 JavaScript 对象，我们将向其添加名为 propertyName 的新属性或键，而在赋值运算符的右侧，propertyValue 是必须分配给该特定新创建或添加的属性或键的值。
算法
- 步骤 1 - 作为创建或向 JavaScript 对象添加新属性的第一步，您需要根据上面讨论的语法创建一个 JavaScript 对象。
- 步骤 2 - 在下一步中，您需要使用上面讨论的点语法添加或创建一个新的 JavaScript 对象属性或键。
- 步骤 3 - 在该过程的第三步或最后一步中，您需要在屏幕上显示带有新添加或创建的属性的对象它。
示例 1
下面的示例将说明如何使用点语法为具有多个属性的现有 JavaScript 对象创建或添加新属性 −
<!DOCTYPE html> <html> <body> <h3>Creating new object property using Dot Notation.</h3> <p>Create or add a new property named "title" to the existing object "obj"</p> <p id="result">Resultant object:<br></p> <script> let obj = { company: "tutorialspoint", article: 1 }; obj.title = "How to create object properties in JavaScript?"; console.log(obj); document.getElementById("result").innerHTML += JSON.stringify(obj); </script> </body> </html>
在上面的例子中，我们已经看到，一个已经存在的 JavaScript 对象名为"obj"，之前具有"company"和"article"属性，通过使用点语法向其添加名为"title"的新属性来扩展它。
使用方括号表示法
这是创建或向 JavaScript 对象添加属性的另一种方法。在此表示法中，对象名称后跟方括号，属性名称以字符串形式传递在方括号内，值将使用赋值运算符分配，就像在点表示法中分配的那样。
语法
以下是使用方括号语法添加或创建 JavaScript 对象的新属性的语法 -
objectName["propertyName"] = propertyValue;
在上述语法中，objectName 是一个已经存在的 JavaScript 对象，通过在方括号和双引号内添加名为 propertyName 的新属性，其属性增加了一个，而在赋值运算符的右侧，propertyValue 是将分配给新创建或添加的对象属性的实际值。
算法
- 步骤 1 - 在第一步中，您将创建一个具有多个属性的 JavaScript 对象，稍后您将向该对象添加属性。
- 步骤 2 - 该过程的第二步涉及使用方括号语法添加或创建 JavaScript 对象属性。
- 步骤 3 - 最后一步或第三步将在用户屏幕上显示对象。这样用户就可以清楚地看到在添加新属性之前和之后对象属性的变化。
示例 2
下面的示例将说明如何使用方括号语法为具有多个属性的现有 JavaScript 对象创建或添加新属性 −
<html> <body> <h3>Creating new object property using square brackets Notation.</h3> <p>Create or add a new property named "title" to the existing object "obj".</p> <p id="result">Resultant object:<br></p> <script> let obj = { company: "tutorialspoint", article: 1 }; obj["title"] = "How to create object properties in JavaScript?"; console.log(obj); document.getElementById("result").innerHTML += JSON.stringify(obj); </script> </body> </html>
在上面的例子中，我们已经看到，一个已经存在的 JavaScript 对象名为"obj"，该对象先前具有"company"和"article"属性，通过使用方括号语法向其添加名为"title"的新属性，对其进行了修改。
正如我们所见，在 JavaScript 中添加或创建对象属性的两种语法的输出是相似的。因此，上面讨论的两种语法都是有效的，可用于在 JavaScript 对象中创建新属性或添加属性。
注意
上面讨论的两种符号中的点符号是一种更方便和首选的向 JavaScript 对象添加或创建新属性的方法，因为它与方括号符号相比简单易用。
