如何简化数组查找对象后向自定义对象赋值的代码实现

嘿，我完全懂你觉得原来的代码不够优雅、不想用多余中间变量的心情！其实咱们确实能把查找和赋值的逻辑合并得更简洁，同时还能处理找不到匹配项的边界情况（避免出现Cannot read properties of undefined的报错）。下面给你几种实用方案：

原生JavaScript方案 #

高效无冗余版（推荐） #

用立即执行函数（IIFE）包裹查找逻辑，只遍历数组一次，同时完成转换赋值：

this.myResult = (() => {
  // 只查找一次数组
  const matchedObj = this.myArray.find(obj => obj.b === 2);
  // 找到就转换结构，没找到就返回默认值
  return matchedObj ? { value1: matchedObj.a, value2: matchedObj.b } : { value1: null, value2: null };
})();

简洁版（注意：会遍历数组两次） #

如果数组规模很小，也可以用可选链直接简化，但这种写法会执行两次find，性能上略逊一筹：

this.myResult = this.myArray.find(obj => obj.b === 2) 
  ? { value1: this.myArray.find(obj => obj.b === 2).a, value2: this.myArray.find(obj => obj.b === 2).b }
  : { value1: null, value2: null };

Lodash方案（更优雅） #

如果项目里已经在用Lodash，那用它的链式调用能让代码更清爽：

// 链式调用写法，逻辑一目了然
this.myResult = _.chain(this.myArray)
  .find({ b: 2 }) // 按条件查找对象
  .thru(matchedObj => {
    // 把找到的对象转换为目标结构
    return matchedObj ? { value1: matchedObj.a, value2: matchedObj.b } : { value1: null, value2: null };
  })
  .value();

另外得提一句：你之前尝试的.then或者.map方法行不通，因为Array.find()返回的是单个匹配对象（或者undefined），不是数组，所以这些数组方法根本不存在。上面的方案既满足了你“不用额外局部变量”的需求，又能保证代码的可读性和健壮性。

备注：内容来源于stack exchange，提问作者rhavelka