Question

我有一个由对象组成的数组。每个对象都有名称和一个项目数组。我想根据ID进行过滤。

const list = [
 {name: "Bob",
  items: [
   {id: 1, color:"blue"},{id: 2, color:"green"}
  ]
 },
 {name: "Kate",
  items: [
   {id: 3, color:"yellow"},{id: 4, color:"pink"}
  ]
 }, 
 {name: "Fred",
  items: [
   {id: 5, color:"purple"}
  ]
 }
]

如果id === 1，我希望它返回该数组的名称和项目。 list.filter(listItems => listItems.items.filter(item => item.id === 1))之类的东西应该返回

name: "Bob",
  items: [
   {id: 1, color:"blue"},{id: 2, color:"green"}
  ]

已编辑：已修复的错误

Answer 1

Fred对象的item数组存在错误，应该是：

 {
   name: "Fred",
   items: [ {id: 5, color:"purple"} ]
 }

一旦您修复了该错误，我们就可以开始尝试过滤器语句。快速且肮脏的显示如下：

const list = [ {
  name: "Bob",
  items: [ {id: 1, color:"blue"}, {id: 2, color:"green"} ]
}, {
  name: "Kate",
  items: [ {id: 3, color:"yellow"}, {id: 4, color:"pink"} ]
}, {
  name: "Fred",
  items: [ {id: 5, color:"purple"} ]
} ];

const result = list.filter( obj => obj.items.some( item => item.id === 1 ) );
console.log( result );

在这里，我有两个箭头功能。最外面的一个在Array.prototype.filter上处理列表数组中的对象。内部的{@ 3}}适用于items数组中的某个项目。

如果可以找到至少1个匹配元素，则Array.prototype.some返回true。

Array.prototype.filter仅在过滤器函数返回true时才包含该对象。

Answer 2

如果我理解您的问题，则可以创建一个使用Array.prototype.find的函数，以返回回调函数为其返回true的数组中的第一个元素-在这种情况下，回调可以包含for -loop能够与id匹配时返回true，您可以将const list = [{ name: "Bob", items: [{ id: 1, color: "blue" }, { id: 2, color: "green" }] }, { name: "Kate", items: [{ id: 3, color: "yellow" }, { id: 4, color: "pink" }] }, { name: "Fred", items: [{ id: 5, color: "purple" }] } ]; const filterList = (arr, id) => { return arr.find(el => { for (let i = 0; i < el.items.length; i += 1) { if (el.items[i].id === id) { return true; } } }) }; console.log(filterList(list, 3))作为函数的另一个参数传入。例如：

document.querySelectorAll('.image_con').forEach(function(item){
  item.onclick = function(e){
    /* Your codes here... */
  }
})

Answer 3

在循环浏览列表时，可以使用filter方法过滤内部array（其中包含object和id和color）。

这是一个函数，它接受ID作为参数，如果找不到匹配项，则返回包含该ID或空array（[]）的项：

const list = [{
      name: "Bob",
      items: [{
        id: 1,
        color: "blue"
      }, {
        id: 2,
        color: "green"
      }]
    },
    {
      name: "Kate",
      items: [{
        id: 3,
        color: "yellow"
      }, {
        id: 4,
        color: "pink"
      }]
    },
    {
      name: "Fred",
      items: [{
        id: 5,
        color: "purple"
      }]
    }
  ],
  getItem = id => {
    const l = list.length;
    for (let i = 0; i < l; i++) {
      if (list[i].items.filter(el => {
          return id == el.id;
        }).length)
        return list[i]
    }
    return [];
  };

console.log(getItem(1)); /** Bob's entry **/

console.log(getItem(5)); /** Fred's entry **/

根据另一个数组中的值过滤数组

3 个答案: