[英]How to filter array of objects with nested arrays of objects based on other arrays
Sample code.示例代码。
const cards = [
{
id: "1",
name: "J",
tag: [
{
"colour": "red"
},
{
"colour": "yello"
},
{
"colour": "blue"
},
{
"colour": "white"
},
],
size: [
{
"name": "small"
},
{
"name": "medium"
},
],
},
{
id: "2",
name: "S",
tag: [
{
"colour": "red"
},
{
"colour": "green"
},
{
"colour": "black"
},
],
size: [
{
"name": "small"
},
{
"name": "medium"
},
],
},
{
id: "3",
name: "K",
tag: [
{
"colour": "green"
},
{
"colour": "purple"
},
{
"colour": "brown"
},
{
"colour": "white"
},
],
size: [
{
"name": "large"
},
],
}
];
Test arrays测试 arrays
const sizeArray = ["medium", "small"];
const tagArray = ["red", "black"];
I want the filtered array of objects to only include the second object in this example.在此示例中,我希望过滤后的对象数组仅包含第二个 object。 Filtering only those who match all criteria leaving me with a new array of objects.
只过滤那些符合所有条件的人,给我留下一个新的对象数组。
I've tried with.filter, .some, .includes and no luck looking over many other answers to similar questions.我已经尝试过使用 .filter、.some、.includes 并且没有运气查看类似问题的许多其他答案。
Thanks a lot.非常感谢。
You can use the filter with every and some .您可以将过滤器与every和some一起使用。
Since you need to filter the result which contains all sizeArray
and tagArray
in size
and tag
array respectively.由于您需要分别过滤包含
size
和tag
数组中的所有sizeArray
和tagArray
的结果。
const cards = [ { id: "1", name: "J", tag: [ { colour: "red", }, { colour: "yello", }, { colour: "blue", }, { colour: "white", }, ], size: [ { name: "small", }, { name: "medium", }, ], }, { id: "2", name: "S", tag: [ { colour: "red", }, { colour: "green", }, { colour: "black", }, ], size: [ { name: "small", }, { name: "medium", }, ], }, { id: "3", name: "K", tag: [ { colour: "green", }, { colour: "purple", }, { colour: "brown", }, { colour: "white", }, ], size: [ { name: "large", }, ], }, ]; const sizeArray = ["medium", "small"]; const tagArray = ["red", "black"]; const result = cards.filter(({ tag, size }) => sizeArray.every((s) => size.some((si) => si.name === s)) && tagArray.every((t) => tag.some((ta) => ta.colour === t)) ); console.log(result);
As you filter
the main array, you want to make sure at least one of the tag
values is in the tagArray
and at least one of the size
values is in the sizeArray
.在
filter
主数组时,您要确保至少一个tag
值在tagArray
中,并且至少一个size
值在sizeArray
中。 This can be achieved using includes
.这可以使用
includes
来实现。
const cards=[{id:"1",name:"J",tag:[{colour:"red"},{colour:"yello"},{colour:"blue"},{colour:"white"}],size:[{name:"small"},{name:"medium"}]},{id:"2",name:"S",tag:[{colour:"red"},{colour:"green"},{colour:"black"}],size:[{name:"small"},{name:"medium"}]},{id:"3",name:"K",tag:[{colour:"green"},{colour:"purple"},{colour:"brown"},{colour:"white"}],size:[{name:"large"}]}]; const sizeArray = ["medium", "small"]; const tagArray = ["red", "black"]; const filtered = cards.filter((card) => { return ( card.tag.some((tag) => tagArray.includes(tag.colour)) && card.size.some((size) => sizeArray.includes(size.name)) ); }); console.log(filtered);
Note that includes
isn't super efficient, but I'm assuming you're not working with tons of data here.请注意,
includes
不是超级有效,但我假设您在这里没有处理大量数据。 If your sizeArray
or tagArray
are especially large, you could look into something like the Set
object for hash table efficiency.如果您的
sizeArray
或tagArray
特别大,您可以查看类似Set
object for hash 表效率的内容。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.