Question

如果可以的话，请耐心等待，我只是想确切地了解此函数的功能，因此我可以更好地根据自己的用例对其进行调整，并在需要时编写更简洁的代码。该函数当然可以工作，我可以使用它，但是当我不完全理解所使用的代码时，它会使我感到烦恼。我想我大部分时候都了解，但是我很难把所有的部分放在一起。如果这是重复的话，那么所有的道歉都请注明出来，但是我找不到我想要理解的确切答案。从其他已回答的问题和外部文章中，我已经能够了解大部分情况，但是我仍然停留在几点上。

确切的代码是：

const userBy = id => u => u.id == id; 
const users = [{ id: 1, name: "Kaio" }, { id: 2, name: "Gabriella" }, { id: 3, name: "Enzo" }];
const id = 2;
const user = users.find(userBy(id));

我的主要问题集中在：

const userBy = id => u => u.id == id;

我从本文中获取了代码，以防万一需要更多的上下文，尽管上述代码应该足够了-https://medium.com/@kaiosilveira/mastering-javascript-arrays-beyond-for-and-foreach-loops-e2ecf9dfe3e

我了解到，在“ userBy”函数中，“ id”作为参数传递。我还理解，在简写语法中，隐含return语句，并且find（）方法具有其自身的三个参数（元素，索引，数组），就像我经常理解和使用的forEach（）函数一样。 / p>

总而言之-我知道'id'是作为参数传递的，但是如果我理解正确，则'u'作为最终函数的参数被返回和/或传递的，其中“ u”的指定属性“ id”等于传递给原始函数的参数“ id”。而且由于我知道find（）方法正在遍历数组，因此我可以合理地推断出'u'是该数组的当前元素/索引。

我很难理解的特定部分是'u'如何捕获元素/索引的值。同样，为什么'u'必须位于其自身的函数中，而不是作为启动函数的'id'参数旁边的另一个参数。

就像我说的那样，该功能可以正常工作，无论我是否理解。但是，我将不胜感激，如果有人能抽出宝贵的时间向我详细说明发生了什么。我已经研究并了解了自己所能做的一切，只需要一点点抓住我提到的最后几点。

[帖子回复编辑]它是在问我为什么解释这个问题与What do multiple arrow functions mean in javascript?不同。它们非常相似，但是我认为，根据我的特定情况，添加的Array.prototype.find方法足以区分它，足以保证它自己的解释。虽然在核心部分，我可以看到有人可能将其标记为相同，所以如果其他人有这种感觉，则一定要将其标记为重复。无论哪种对社区最有利的事情对我来说都是一件好事，我很感激社区花时间帮助我理解我的问题。

Answer 1

首先，让我们看看.find在做什么。 .find的实现如下所示：

Array.prototype.find = function (callback) {
  for (let i = 0; i < this.length; i++) {
    const match = callback(this[i], i, this);
    if (match) {
      return this[i];
    }
  }
}

Find希望您传递给它一个函数，该函数将被重复调用，一次传入一个数组的每个元素（加上索引和数组），直到其中一个通过测试。因此，通常使用这种方法来查找ID为2的用户：

users.find((user) => {
  if (user.id === 2) {
    return true;
  }
  return false;
});

或更短：

users.find(user => user.id === 2);

现在，您所显示的代码又前进了一步。可以预见到可能会找到user.id === 2，而且还会找到user.id === 1和user.id === 18273等的可能性。因此，他们创建了一个名为userBy的辅助函数，该函数可以产生其他函数。换句话说，这段代码：

const userBy = id => u => u.id == id;

...是一个工厂，用于生产看起来像user => user.id === 2的函数，除了它不仅可以创建与2比较的函数，还可以创建所需的任何ID。

因此，有了这样的代码行：

const user = users.find(userBy(2));

...基本上意味着“创建函数user => user.id === 2，然后将其传递到users.find”

Answer 2

这是因为userBy函数实际上并未在数组上进行迭代-Array.find接受了一个带有布尔返回值的函数，因此执行实际查找的函数是匿名子函数{{1 }}。这是在ES5中的外观：

u => u.id == id

此处，var userBy = function(id) { return function(u) { u.id == id; }; };函数正在返回一个回调/测试函数，该函数在userBy中使用。如果您不必传递Array.find作为参数，则可以只使用内部函数来简化它：

id

了解数组旁边的Javascript速记箭头语法find（）

2 个答案: