JavaScript实现获取数组对象指定值的方法

数组对象是一个很常见的数据类型，常常用来存储一组相关的数据。在某些情况下，我们想要从一个包含多个对象的数组中，获取其中每个对象的一个指定属性的值。本文将介绍如何使用JavaScript来实现获取数组对象指定值的方法。

一、使用循环遍历数组对象

我们可以使用循环遍历数组对象，通过对象属性名来获取对应的属性值。具体的代码演示如下：

function getPropertyValue(arr, propName) {
  let result = []; // 定义一个空数组，用于存储获取到的属性值
  for (let i = 0; i < arr.length; i++) {
    result.push(arr[i][propName]); // 将获取到的属性值添加到result数组中
  }
  return result;
}

let arr = [{
    name: "Tom",
    age: 18,
    gender: "male"
  },
  {
    name: "Lily",
    age: 20,
    gender: "female"
  },
  {
    name: "Jack",
    age: 22,
    gender: "male"
  }
];

console.log(getPropertyValue(arr, "name")); // ["Tom", "Lily", "Jack"]
console.log(getPropertyValue(arr, "age")); // [18, 20, 22]
console.log(getPropertyValue(arr, "gender")); // ["male", "female", "male"]

上述代码中，我们定义了一个函数getPropertyValue，该函数接收两个参数，第一个参数为数组对象arr，第二个参数为属性名propName。在函数内部，我们通过循环遍历数组对象，使用方括号语法获取每个对象的指定属性值，将这些值依次添加到一个空数组result中，并返回result数组。

二、使用ES6中的map方法

ES6中引入了一种新的遍历数组的方法——map。使用map方法可以更简单地获取数组对象中的指定属性值。具体的代码演示如下：

function getPropertyValue(arr, propName) {
  return arr.map(obj => obj[propName]);
}

let arr = [{
    name: "Tom",
    age: 18,
    gender: "male"
  },
  {
    name: "Lily",
    age: 20,
    gender: "female"
  },
  {
    name: "Jack",
    age: 22,
    gender: "male"
  }
];

console.log(getPropertyValue(arr, "name")); // ["Tom", "Lily", "Jack"]
console.log(getPropertyValue(arr, "age")); // [18, 20, 22]
console.log(getPropertyValue(arr, "gender")); // ["male", "female", "male"]

上述代码中，我们定义了一个函数getPropertyValue，该函数接收两个参数，第一个参数为数组对象arr，第二个参数为属性名propName。在函数内部，我们使用ES6中的map方法，遍历数组对象，针对每个对象直接返回其指定属性的值。

三、使用reduce方法实现一次循环

上述两种方法都需要循环遍历数组对象，但是使用reduce方法可以只遍历一次实现从对象中获取指定值的操作。具体的代码演示如下：

function getPropertyValue(arr, propName) {
  return arr.reduce((result, obj) => {
    result.push(obj[propName]);
    return result;
  }, []);
}

let arr = [{
    name: "Tom",
    age: 18,
    gender: "male"
  },
  {
    name: "Lily",
    age: 20,
    gender: "female"
  },
  {
    name: "Jack",
    age: 22,
    gender: "male"
  }
];

console.log(getPropertyValue(arr, "name")); // ["Tom", "Lily", "Jack"]
console.log(getPropertyValue(arr, "age")); // [18, 20, 22]
console.log(getPropertyValue(arr, "gender")); // ["male", "female", "male"]

上述代码中，我们定义了一个函数getPropertyValue，该函数接收两个参数，第一个参数为数组对象arr，第二个参数为属性名propName。在函数内部，我们使用ES6中的reduce方法，遍历数组对象，针对每个对象将其指定属性的值添加到一个初始为空的数组result中，并返回result数组。

四、使用lodash库的pluck方法

如果你使用的是lodash库，那么获取数组对象中的指定属性值就更加简单了。lodash库中提供了一个pluck方法，可以轻松地抽取数组对象中的指定属性值。具体的代码演示如下：

let _ = require("lodash");

let arr = [{
    name: "Tom",
    age: 18,
    gender: "male"
  },
  {
    name: "Lily",
    age: 20,
    gender: "female"
  },
  {
    name: "Jack",
    age: 22,
    gender: "male"
  }
];

console.log(_.pluck(arr, "name")); // ["Tom", "Lily", "Jack"]
console.log(_.pluck(arr, "age")); // [18, 20, 22]
console.log(_.pluck(arr, "gender")); // ["male", "female", "male"]

上述代码中，我们使用require函数引入了lodash库，然后分别使用lodash的pluck方法来获取数组对象中的指定属性值。相比之前的三种方法，使用lodash库的pluck方法更加简单快捷。