JS object添加元素|极客笔记

JS object添加元素

在JavaScript中，对象是一种非常常见和重要的数据类型。对象由一组键值对组成，可以存储各种类型的数据。有时候我们需要向对象中动态添加新的属性或方法，这就涉及到了对象添加元素的操作。

对象添加属性

我们可以通过两种方式向对象添加新的属性：点号语法和方括号语法。

点号语法

使用点号语法，我们可以直接在对象名后面加上一个点号，再接上新属性的名字和赋值即可。

let person = {
  name: "Alice",
  age: 25
};

person.gender = "female";
console.log(person);

// 输出
// { name: 'Alice', age: 25, gender: 'female' }

在上面的示例中，我们先定义了一个名为person的对象，然后使用点号语法向该对象添加了一个名为gender的属性，并赋值为female。

方括号语法

除了点号语法，我们还可以使用方括号语法来添加新的属性。这种语法比较灵活，可以直接将属性名作为变量使用。

let person = {
  name: "Alice",
  age: 25
};

let key = "gender";
person[key] = "female";
console.log(person);

// 输出
// { name: 'Alice', age: 25, gender: 'female' }

在这个示例中，我们定义了一个变量key，然后使用方括号语法将这个变量的值作为属性名添加到person对象中。

使用Object.defineProperty方法

除了上述两种常见的方式，我们还可以使用Object.defineProperty方法来添加属性。这种方式可以设置属性的一些特性，比如是否可枚举、是否可配置等。

let person = {
  name: "Alice",
  age: 25
};

Object.defineProperty(person, 'gender', {
  value: 'female',
  writable: true,
  enumerable: true,
  configurable: true
});

console.log(person);

// 输出
// { name: 'Alice', age: 25, gender: 'female' }

在这个示例中，我们使用Object.defineProperty方法向person对象添加了一个名为gender的属性，并设置了属性值为female，以及可写、可枚举和可配置等特性。

对象添加方法

除了属性，我们还可以向对象中添加方法。方法就是对象中的函数，可以在调用时执行某些逻辑操作。

let person = {
  name: "Alice",
  age: 25,
  sayHello: function() {
    console.log(`Hello, my name is ${this.name}`);
  }
};

person.sayHello();

// 输出
// Hello, my name is Alice

在上面的示例中，我们向person对象中添加了一个名为sayHello的方法，然后在调用时输出一段打招呼的消息。