对象数组的定义与用法

发布时间：2023-05-23

一、什么是对象数组

对象数组是指由多个对象组成的数组，每个对象包含不同的属性和方法，可以通过数组的下标来访问不同的对象和其对应的属性和方法。在实际应用中，对象数组经常用于存储和操作大量数据。

二、对象数组的基本定义方式

// 定义一个对象数组
let users = [
  { name: '小明', age: 18, gender: 'male' },
  { name: '小红', age: 20, gender: 'female' },
  { name: '小刚', age: 22, gender: 'male' }
];

对象数组的基本定义方式就是使用中括号包含多个对象，每个对象用花括号包含，用逗号分隔。对象的属性和属性值之间使用冒号分隔。

上述代码中定义了一个用户数组，数组中包含了三个用户对象，每个用户对象都有 name、age、gender 三个属性，可以通过 users[0]、users[1]、users[2] 来访问这三个对象。

三、对象数组的常用操作

1. 遍历对象数组

// 遍历对象数组
users.forEach(function(user) {
  console.log('姓名：' + user.name + '，年龄：' + user.age + '，性别：' + user.gender);
});

使用 forEach 方法可以遍历对象数组，访问对象数组中的每一个对象，并对每个对象的属性进行操作。

上述代码中遍历了用户数组，对于每个用户对象，打印了它的姓名、年龄和性别。

2. 对象数组的增删改查

操作对象数组中的某一个对象，需要先通过下标访问到该对象，然后再进行相应的操作。

（1）增加一个对象

// 新增一个用户对象
let newUser = { name: '小芳', age: 19, gender: 'female' };
users.push(newUser);

使用 push 方法可以在对象数组的末尾添加一个新的对象。

上述代码中新增了一个名叫小芳的用户对象，并使用 push 方法将其添加到用户数组的末尾。

（2）删除一个对象

// 删除一个用户对象
users.splice(1, 1);

使用 splice 方法可以删除对象数组中指定的对象。

上述代码中删除了用户数组中下标为1的用户对象，删除一个对象时需要指定该对象在数组中的下标和删除的数量。

（3）修改一个对象

// 修改一个用户对象的属性值
users[2].age = 23;

可以直接通过下标访问到对象数组中的某一个对象，并修改该对象的属性值。

上述代码中将用户数组中下标为 2 的对象的年龄修改为 23。

（4）查找一个对象

// 查找一个用户对象
let user = users.find(function(user) {
  return user.name === '小明';
});

使用 find 方法可以查找到符合条件的对象。

上述代码中查找到了用户名为小明的用户对象，并将其保存在变量 user 中。

四、对象数组的实际应用

对象数组在实际应用中有很广泛的用途，比如在前端开发中，常常用于存储从后端接口返回的数据，然后通过遍历来展示在页面上。

下面是一个使用对象数组定义购物车的示例：

let cart = [
  { name: '牛奶', price: 12, count: 2 },
  { name: '面包', price: 8, count: 1 },
  { name: '鸡蛋', price: 2, count: 6 }
];

// 计算购物车总价
let totalPrice = 0;
cart.forEach(function(item) {
  totalPrice += item.price * item.count;
});
console.log('购物车总价为：' + totalPrice);

上述代码中定义了一个购物车数组，数组中包含了三个商品对象，每个商品对象都有名称、价格和数量三个属性。

通过遍历购物车数组，可以计算出购物车中的商品总价，并打印出来。

五、总结

对象数组是由多个对象组成的数组，在实际应用中有非常广泛的用途。可以通过遍历对象数组来对数组中的对象进行操作，比如增删改查等。

推荐文章