JavaScript中如何从对象数组根据ID筛选出单个对象

嘿，想要从你的对象数组里根据ID找出对应的单个对象？这事儿在JavaScript里有好几种简单的实现方式，我给你捋捋最常用的几个：

• 推荐用Array.find()方法
  这是ES6之后新增的方法，简直就是为你这个需求量身定做的——它会遍历数组，返回第一个满足条件的元素，找到后就立刻停止遍历，效率很高。

  代码示例：

  // 你的原始数组
  const objArray = [
    {id: 1, options: [{/* 你的选项内容 */}]},
    {id: 2, options: [{/* 你的选项内容 */}]},
    {id: 3, options: [{/* 你的选项内容 */}]}
  ];
  // 目标ID
  const targetId = 2;
  // 筛选出目标对象
  const singleObject = objArray.find(item => item.id === targetId);
  

  要是数组里没有匹配ID的对象，find()会返回undefined，你可以根据这个结果做后续的判断处理。

• 用Array.filter()方法兜底
  这个方法会返回所有符合条件的元素组成的新数组。如果你不确定数组里有没有多个匹配项，或者只是习惯用这个方法，可以取数组的第一个元素：

  const objArray = [
    {id: 1, options: [{/* 你的选项内容 */}]},
    {id: 2, options: [{/* 你的选项内容 */}]},
    {id: 3, options: [{/* 你的选项内容 */}]}
  ];
  const targetId = 2;
  const singleObject = objArray.filter(item => item.id === targetId)[0];
  

  注意哦，filter()会遍历完整个数组，哪怕中途已经找到匹配项了，所以如果只是找单个对象，find()的效率会更高一些。

• 传统for循环（兼容旧环境）
  要是你需要兼容ES6之前的老浏览器，或者更偏爱手动遍历的方式，传统for循环也是个稳当的选择：

  const objArray = [
    {id: 1, options: [{/* 你的选项内容 */}]},
    {id: 2, options: [{/* 你的选项内容 */}]},
    {id: 3, options: [{/* 你的选项内容 */}]}
  ];
  const targetId = 2;
  let singleObject = null;
  for (let i = 0; i < objArray.length; i++) {
    if (objArray[i].id === targetId) {
      singleObject = objArray[i];
      break; // 找到目标就跳出循环，不用继续遍历啦
    }
  }
  

  这种方法兼容性拉满，而且找到后立刻break，不会做无用功。

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