js给对象动态添加、设置、删除属性名与属性值实例代码

让我们来详细讲解“js给对象动态添加、设置、删除属性名与属性值实例代码”的完整攻略。

添加属性名与属性值

我们可以使用点号（.）或者方括号[]的方式来向对象动态添加属性名和属性值。

点号添加

点号添加属性名和属性值的方式简单易懂，只需要在对象名后面接一个点号，再加上新的属性名，然后设置属性值即可。如下面这个例子：

let obj = {
  name: "Lucy",
  age: 18
};

obj.gender = "female";
console.log(obj); // { name: "Lucy", age: 18, gender: "female"}

方括号[]添加

方括号中可以直接输入新的属性名，然后再使用赋值操作符将属性值设置成想要的值。如下面这个例子：

let obj = {
  name: "Lucy",
  age: 18
};

obj["gender"] = "female";
console.log(obj); // { name: "Lucy", age: 18, gender: "female"}

需要注意的是，使用方括号添加属性时，属性名要用引号括起来，这是因为如果直接使用未被引号括起来的属性名，会被解释为一个变量名，而不是字符串。

设置属性名与属性值

我们可以对已有的属性重新设置属性值或者修改属性名。

修改属性值

要修改一个已有属性的值，只需要使用和添加属性时相同的语法。如下面这个例子：

let obj = {
  name: "Lucy",
  age: 18,
  gender: "female"
};

obj.gender = "male";
console.log(obj); // { name: "Lucy", age: 18, gender: "male"}

修改属性名

想要修改属性名，需要使用方括号和赋值操作符，并将旧的属性名作为字符串传入方括号中。如下面这个例子：

let obj = {
  name: "Lucy",
  age: 18,
  gender: "female"
};

obj["sex"] = obj["gender"];
delete obj["gender"];
console.log(obj); // { name: "Lucy", age: 18, sex: "female" }

这里我们先使用方括号的方式为对象添加一个新的属性名“sex”，并将原来的“gender”属性值赋给“sex”。然后使用delete来删除旧的属性名“gender”。最后我们可以发现，这个对象中已经没有“gender”属性了，而新添加的“sex”属性名称和属性值分别是“gender”和“female”。

删除属性

我们可以使用JavaScript中的delete操作符来删除对象中的属性。如下面的示例代码：

let obj = {
  name: "Lucy",
  age: 18
};

delete obj['age'];
console.log(obj); // { name: "Lucy" }

这里我们将对象中的“age”属性删除后，再次打印该对象，便可以发现对象中已经没有“age”属性了。

这就是关于“js给对象动态添加、设置、删除属性名与属性值实例代码”的详细攻略。