JavaScript：如何提取数组对象中指定属性的所有值？

嘿，这个需求用JavaScript的Array.prototype.map()方法就能轻松搞定，这也是处理这类数组属性提取场景的最佳实践——代码简洁、可读性强，完全贴合现代JS的写法习惯。

基础实现 #

假设你的数组变量名为friendRelations，直接用map遍历每个对象，返回friend_id属性即可：

const friendRelations = [
  {
    "id": 23,
    "user_id": 2,
    "friend_id": 2,
    "created_at": "2018-05-23 21:00:07",
    "updated_at": "2018-05-23 21:00:07"
  },
  {
    "id": 31,
    "user_id": 2,
    "friend_id": 1,
    "created_at": "2018-05-23 21:00:07",
    "updated_at": "2018-05-23 21:00:07"
  },
  {
    "id": 32,
    "user_id": 2,
    "friend_id": 4,
    "created_at": "2018-05-23 21:00:07",
    "updated_at": "2018-05-23 21:00:07"
  }
];

// 提取所有friend_id到变量
const friendIds = friendRelations.map(item => item.friend_id);

console.log(friendIds); // 输出: [2, 1, 4]

处理边界情况（可选） #

如果你的数组里可能存在没有friend_id属性的对象，为了避免得到undefined，可以添加默认值或者过滤无效项：

// 给无friend_id的项设默认值（比如null）
const friendIdsWithDefault = friendRelations.map(item => item.friend_id ?? null);

// 或者直接过滤掉没有friend_id的项
const validFriendIds = friendRelations
  .filter(item => 'friend_id' in item)
  .map(item => item.friend_id);

为什么这是最佳实践？ #

• map是数组原生方法，无需额外引入库，性能优异；
• 代码语义清晰，一眼就能看出是“把数组里的每个元素映射成它的friend_id”；
• 链式调用可以轻松扩展逻辑（比如上面的过滤操作），维护性强。

内容的提问来源于stack exchange，提问作者Jone