Javascript用另一个元素数组过滤一个数组答案

【问题标题】：Javascript filter an array with another array of elementsJavascript用另一个元素数组过滤一个数组
【发布时间】：2018-06-13 09:39:04
【问题描述】：

我想为搜索实现一个标签过滤器，并获得一个包含许多条目的条目数组（变量：条目）：

"entries":[
      {
         "id":1,
         "details":"text",
         "tags":[
            {
               "id":9,
               "label":"Label9"
            },
            {
               "id":6,
               "label":"Label6"
            },
         ],
         "date":"Mar 8, 2018 2:45:30 PM"
      }]

我想用另一个标签数组（变量：标签）过滤这个数组，如下所示：

"tags":[
            {
               "id":6,
               "label":"Label6"
            }

最后，我需要一个包含标签数组中所有标签的条目数组。 ]

我写了这段代码，但出了点问题。它比较每个标签的id。

const entries = [{
  "id": 1,
  "details": "text",
  "tags": [{
      "id": 9,
      "label": "Label9"
    },
    {
      "id": 6,
      "label": "Label6"
    },
  ],
  "date": "Mar 8, 2018 2:45:30 PM"
}]



const tags = [{
  "id": 6,
  "label": "Label6"
}]


function containSearchTag(tags) {
  return entries.filter(function(el) {
    for (let i = 0; i < el.tags.length; i++) {
      for (let j = 0; j < tags.length; j++) {
        return el.tags[i].id === tags[j].id;
      }
    }
  });
}
console.log(containSearchTag(tags));

【问题讨论】：

因为过滤器在外部对象上，所以你并没有真正过滤任何东西
我给你写了一个sn-p - 请检查并在需要的地方修改

标签： javascript arrays filter

【解决方案1】：

您可以使用 Set 并通过使用集合检查 tags 数组来过滤数组。

var entries = [{ id: 1, details: "text", tags: [{ id: 9, label: "Label9" }, { id: 6, label: "Label6" }], date: "Mar 8, 2018 2:45:30 PM" }],
    tags = [{ id: 6, label: "Label6" }],
    ids = new Set(tags.map(({ id }) => id)),
    result = entries.filter(({ tags }) => tags.some(({ id }) => ids.has(id)));

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

【讨论】：

【解决方案2】：

您可以使用Array.some 使其更容易；喜欢：

const entries = [{
  id: 1,
  details: 'text',
  tags: [{
      id: 9,
      label: 'Label9'
    },
    {
      id: 6,
      label: 'Label6',
    },
  ],
  date: 'Mar 8, 2018 2:45:30 PM',
}, {
  id: 1,
  details: 'text',
  tags: [{
      id: 9,
      label: 'Label9',
    },
    {
      id: 12,
      label: 'Label12',
    },
  ],
  date: 'Mar 8, 2018 2:45:30 PM',
}];


function filterByTag(tags) {
  return entries.filter(x => x.tags.some(y => tags.some(z => z.id === y.id)));
}

console.log(filterByTag([{
  id: 6,
  label: 'Label6',
}]).length);

console.log(filterByTag([{
  id: 9,
  label: 'Label6',
}]).length);

console.log(filterByTag([{
  id: 17,
  label: 'Label6',
}]).length);

【讨论】：

【解决方案3】：

使用Array.filter、Array.every 和Array.some

let entries = [{"id":1,"details":"text","tags":[{"id":9,"label":"Label9"},{"id":6,"label":"Label6"},],"date":"Mar 8, 2018 2:45:30 PM"}];
let tag = [{"id":6,"label":"Label6"}];
         
// Create an array of unique id's
 let ids = tag.map(({id}) => id);
 // filter only those entries which have all the tag ids specified in tag array
 let result = entries.filter(({tags}) => ids.every((id) => tags.some((tag) => tag.id === id)));
console.log(result);

【讨论】：

【解决方案4】：

试试这个希望对你有帮助

var data = JSON.parse('{"entries":[{"id":1,"details":"text","tags":[{"id":9,"label":"Label9"},{"id":6,"label":"Label6"}],"date":"Mar 8, 2018 2:45:30 PM"}]}');

let tag = JSON.parse('[{"id":6,"label":"Label6"}]');

data.entries.forEach((element)=>{
    element.tags.forEach((value)=>{
            tag.forEach((find)=>{
              if(find.id === value.id)
              {
                console.log("tag is avaliable ");
                console.log(value);
              }
            });
    });
});

【讨论】：

【解决方案5】：

一种优化的解决方案可以是创建与每个条目对应的所有标签 ID 的映射，然后搜索标签数组的所有标签 ID。在地图中搜索可以在 O(1) 时间内完成。这有助于降低整体时间复杂度。

var entries = [{"id":1,"details":"text","tags":[{"id":9,"label":"Label9"},{"id":6,"label":"Label6"}],"date":"Mar 8, 2018 2:45:30 PM"}];
 var tags =[{"id":6, "label":"Label6"}];

 var result = entries.filter((obj) => {
    var tagMap = obj.tags.reduce((a, o) =>{ a[o.id] = true; return a;}, {});
    var bool = true;
    tags.forEach((o) => {var x = tagMap[o.id] ? true : false; bool = bool && x;})
    return bool;
 });
 console.log(result);

【讨论】：