将这些嵌套函数从箭头转换为旧样式以及变量会发生什么

Question

我正在尝试从一个列表中查找不在第二个列表中的项目。 几乎是运气不好，我让它工作了，但只有箭头功能。 对我来说，普通函数更容易阅读，所以我尝试转换它，但结果不是我所期望的。

数据：

const arr1 = [
    {
        "key": 1,
        "val": "one"
    },
    {
        "key": 2,
        "val": "two"
    },
    {
        "key": 3,
        "val": "three"
    }
]

const arr2 = [
    {
        "key": 3,
        "val": "three"
    },
    {
        "key": 4,
        "val": "four"
    },
    {
        "key": 1,
        "val": "one"
    }
]

版本 1

arr1.filter((element) => arr2.findIndex((innerElement) => element.key === innerElement.key) === -1); 
// produces object with key 2

版本 2

arr1.filter(function(element) { 
    return arr2.findIndex(function(innerElement) { 
      element.key === innerElement.key === -1
    })
}) // produces all three objects in arr1

为了使正确的更简洁，我删除了额外的括号，它仍然有效：

arr1.filter(element => arr2.findIndex(innerElement => element.key === innerElement.key) === -1);

我在这里遗漏了一个关键方面。 我知道 arr1 中的每个项目都传递给 function，而内部 function 又将其结果传递给另一个 function，表达式可以访问两组 arguments 并被执行。 但我想我对订单或其他东西有错误的心理 model。

有人可以解释每个步骤中发生的事情以及如何思考吗？ 我如何将它变成一个正常的 function？

我将处理很多嵌套结构，我觉得这是一个我想改进的薄弱环节。

谢谢

Answer 1

您需要返回比较的值。 === -1测试必须是findIndex()的结果，而不是在它的回调中。

arr1.filter(function(element) { 
    return arr2.findIndex(function(innerElement) { 
      return element.key === innerElement.key;
    }) === -1;
});

这可以用some()方法简化。

arr1.filter(function(element) {
  return !arr2.some(function(innerElement) {
    return element.key === innerElement.key
  })
})