从对象集合中的项目的 lodash.find 方法获取未定义

Posted 2023-03-13

【中文标题】从对象集合中的项目的 lodash.find 方法获取未定义

【英文标题】：Getting undefined from lodash.find method for an item in a collection of objects

【发布时间】：2018-09-27 06:18:36

【问题描述】：

我正在尝试使用 lodash.find 方法从基于数组的对象集合 values 中查找一个项目，但我得到的返回值是“未定义”。下面是我在 typescript 中使用的代码：

this.toFilterId = 2;
this.values = [];

//valueModel is a class with properties - id, code and description and I cant change its definition
export class valueModel 
constructor(
  public id: number,
  public code: string,
  public description: string
  )  


this.values.push(new valueModel(-1, 'TestAll', 'TestAllDesc'));
this.values.push(new valueModel(1, 'Test1', 'Test1Desc'));
this.values.push(new valueModel(2, 'Test2', 'Test2Desc'));
this.values.push(new valueModel(3, 'Test3', 'Test3Desc'));

const selectedValue = lodash.find(this.values, (filterItem: valueModel) => 
          return filterItem.id === this.toFilterId;
      );

//below console prints undefined instead of the valueModel object with id of 2
console.log('selectedValue:', selectedValue); 

我不确定为什么上述 selectedValue var 的控制台日志正在打印“未定义”。对于lodash.find() 方法，我在SO 上提到了lodash 文档和其他类似问题，但它没有返回正确的值。

有人可以帮忙找出我在使用lodash.find() 方法时哪里错了吗？

【问题讨论】：

我认为回调函数参数不正确（filterItem:valueModel）

显示您的valueModel 声明。

@alexmac 我已经添加了valueModel类的定义..

【参考方案1】：

除了回调中的:valueModel 之外，您的解决方案看起来不错。

删除它，除非您使用的是 flow 或 TypeScript（问题中没有说明）。

EDIT 更新的问题提到这是打字稿。无论如何，您的解决方案有效：

https://codepen.io/anon/pen/VxZPEb?editors=0011

这里唯一的例外或差异是：

a) 您对 valueModel 的实现。双重和三重检查，您可以通过 model.id 访问 id。

b) 您没有正确导入 lodash - console.log(lodash) 仔细检查它是否未定义。

【讨论】：

是的，我在代码中使用了打字稿..我已经添加了标签，即使我在回调中删除valueModel或使用any，它也不起作用..

我是否需要将 filterItem 对象转换为 valueModel 不确定？ lodash 虽然已正确导入..

不，您不需要投射。在您的 find 回调中，在返回之前，console.log(filterItem.id)

是的，console.log(filterItem.id) 正在返回 2

能不能做console.log(typeof filterItem.id) 和console.log(typeof this.toFilterId)

【参考方案2】：

问题是回调函数中的this引用了Window。试试这个：

const selectedValue = lodash.find(this.values, ((filterItem: valueModel) => 
    return filterItem.id === this.toFilterId;
).bind(this));

或

const self = this;
const selectedValue = lodash.find(this.values, (filterItem: valueModel) => 
    return filterItem.id === self.toFilterId;
);

显然，TypeScript 和 javascript 在 lambdas 中处理 this 的方式有所不同。

【讨论】：

你确定吗？ => 应该消除对绑定或 self/this/that 的任何需要

在 JS 中 - 是的。但它是 TypeScript，它显然将其转换为在这种情况下起作用¯\_(ツ)_/¯。我确定我用 jsfiddle 和 TypeScript 测试过它。

也许可以将 TS 配置为将 lambdas 转换为 ES6 lambdas ？

奇怪 - 我的 TS 会自动创建一个 _this 本身，所以你不必担心它。 typescriptlang.org/play/…

似乎 TS on fiddle 大大落后了：github.com/jsfiddle/jsfiddle-issues/issues/1079