Lodash过滤器搜索数组中的几个元素（Vue）答案

【问题标题】：Lodash filter search in few element from array (Vue)Lodash过滤器搜索数组中的几个元素（Vue）
【发布时间】：2019-07-22 07:20:29
【问题描述】：

我有一个对象：

{
   1: {
         name: 'Adam',
         age: 12,
      },
   2: {
         name: 'Michal',
         age: 14,
      },
   3: {
         name: 'Jozef',
         age: 12,
      }
}

我尝试使用来自 lodash 的函数 filter：

this.knowledges = _.filter(this.knowledges, function (item) {
    if (item.category[1] !== undefined) {
        return arrayOfNumbers.indexOf(item.category[1].category_id) >= 0
    }
})

变量arrayOfNumbers 返回数组：[1,3] 所以函数过滤器应该返回：

{
   1: {
         name: 'Adam',
         age: 12,
      },
   3: {
         name: 'Jozef',
         age: 12,
      }
}

但它只返回第一个索引：

{
   1: {
         name: 'Adam',
         age: 12,
      }
}

我该如何解决？

【问题讨论】：

您似乎正在用您的过滤器覆盖this.knowledges，这可能是个坏主意。您的过滤器回调也可能不会返回值
那么this.knowledges 是什么样的？你的对象代表什么？
嗨，this.knowledges 我的所有对象（首先来自我的查询）

标签： javascript vue.js lodash

【解决方案1】：

使用 lodash，您可以使用 _.pick()。 Pick 接受一个对象和一个属性数组，并使用选定的属性生成一个新对象：

const knowledges = {1:{name:"Adam",age:12,},2:{name:"Michal",age:14,},3:{name:"Jozef",age:12,}}
const arrayOfNumbers = [1,3]

const result = _.pick(knowledges, arrayOfNumbers)

console.log(result)

&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.15/lodash.js"&gt;&lt;/script&gt;

_.pickBy() 方法的工作原理与过滤对象相同，因此您可以在决定保留什么时查询对象值。

在这个例子中，我使用_.pickBy() 来保留所有带有age === 12 的项目：

const knowledges = {1:{name:"Adam",age:12,},2:{name:"Michal",age:14,},3:{name:"Jozef",age:12,}}

const result = _.pickBy(knowledges, o => o.age === 12)

console.log(result)

&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.15/lodash.js"&gt;&lt;/script&gt;

【讨论】：

谢谢，如果我想按年龄搜索怎么办？

【解决方案2】：

你可以像这样使用pickBy：

const knowledges = {1:{name:"Adam",age:12,},2:{name:"Michal",age:14,},3:{name:"Jozef",age:12,}},
      arrayOfNumbers = [1,3],
      result = _.pickBy(knowledges, (v, k) => arrayOfNumbers.includes(+k));

console.log(result)

&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.15/lodash.js"&gt;&lt;/script&gt;

在 vanilla JS 中，您可以过滤对象的entries 并使用Object.fromEntires() 创建一个对象，如下所示：

const knowledges={1:{name:"Adam",age:12,},2:{name:"Michal",age:14,},3:{name:"Jozef",age:12,}},
      arrayOfNumbers=[1,3];

const newObject = Object.fromEntries(
    Object.entries(knowledges).filter(([k, v]) => arrayOfNumbers.includes(+k))
)

console.log(newObject)

【讨论】：

..请记住 fromEntries 不适用于通常的 IE 和 Edge 浏览器（它们已死，但您可能仍想知道）。
@a.barbieri IE 不支持const、Object.entries、fromEntries、箭头函数或includes。这本来是一个普通的 JS 替代方案。我正在使用 pickBy 添加一个 lodash 答案，但 Ori Drori 提供了更好的答案。