Arrays Javascript列出数组中包含嵌套数组中的值的对象

我有一个颜色数组和一个对象数组。每个对象都包含自己的颜色数组

颜色数组：

colors = [
  'yellow',
  'blue',
  'red',
  'green',
  'purple',
  'brown',
  'fuscia',
  'grey',
  'beige',
  'orange',
]

对象数组：

paintings = [{
    name: 'The Wind',
    rating: '25',
    colors: [
      'orange',
      'blue',
    ]
  },
  {
    name: 'The Sons',
    rating: '8',
    colors: [
      'red',
      'green',
      'yellow',
    ]
  },
  {
    name: 'Freedom',
    rating: '16',
    colors: [
      'grey',
      'yellow',
    ]
  },
  {
    name: 'Space',
    rating: '50',
    colors: [
      'purple',
      'green',
      'orange',
    ]
  }
]

我试图在这里实现的是使颜色数组中的每种颜色本身成为一个数组，并且每个新的颜色数组将包含在其自己的颜色数组中包含颜色的绘画对象。此外，这些对象中的每一个都将从最高等级到最低等级排序。我需要以这样的方式结束：

yellow = [{
    name: 'Freedom',
    rating: '16',
    colors: [
      'grey',
      'yellow',
    ]
  },
  {
    name: 'The Sons',
    rating: '8',
    colors: [
      'red',
      'green',
      'yellow',
    ]
  }
]

green = [{
  name: 'Space',
  rating: '50',
  colors: [
    'purple',
    'green',
    'orange',
  ]
} {
  name: 'The Sons',
  rating: '8',
  colors: [
    'red',
    'green',
    'yellow',
  ]
}]

orange = [{
  name: 'Space',
  rating: '50',
  colors: [
    'purple',
    'green',
    'orange',
  ]
} {
  name: 'The Wind',
  rating: '25',
  colors: [
    'orange',
    'blue',
  ]
}]

等等

上述数据显然是虚拟数据。我实际上在一个非常大的数组中循环。我通过循环对象提取了颜色数组，使用

flat（）

将数组展平，并使用

Set（）

创建了一个新的颜色数组，这样我就可以在每个对象中查找颜色列表

那么，如何以最有效的方式实现上述目标呢

解决方案的其他信息：

在以folliwng方式对原始数据进行排序后，我最终对数组进行了分组：

paintings.forEach((i) => {
    paintings.sort((a, b) => b.rating - a.rating)
})

const colorGroup = colors.map((color) => ({
    [color]: paintings
    .filter((painting) => painting.colors.includes(color))
}));

然后，我将限制为仅显示我的

vue中的25个循环：

<div v-for="painting in colorGroup.slice(0, 25)">
    {{ painting }}
</div>


{{绘画}

谢谢你的帮助
 试试这个


var=[{
名字：'风'，
评级:"25",，
颜色：[
“橙色”，
“蓝色”，
]
},
{
名字：'儿子'，
评级:"8",，
颜色：[
“红色”，
“绿色”，
“黄色”，
]
},
{
名称:"自由",，
评级:"16",，
颜色：[
“灰色”，
“黄色”，
]
},
{
名称：'空格'，
评级：‘50’，
颜色：[
“紫色”，
“绿色”，
“橙色”，
]
}
];
变量颜色=[
“黄色”，
“蓝色”，
“红色”，
“绿色”，
“紫色”，
“棕色”，
"fuscia",，
“灰色”，
“米色”，
“橙色”，
];
const colorObj=colors.map（（颜色）=>({
[颜色]：paints.filter（（painting）=>painting.colors.includes（color））.sort（（a，b）=>b.rating-a.rating）
}));
console.log（colorObj）您可以使用此。。。我只是把它拼凑起来

const colors = [
    'yellow',
    'blue',
    'red',
    'green',
    'purple',
    'brown',
    'fuscia',
    'grey',
    'beige',
    'orange',
]

const paintings = [
    {
        name: 'The Wind',
        rating: '25',
        colors: [
            'orange',
            'blue',
        ]
    },
    {
        name: 'The Sons',
        rating: '8',
        colors: [
            'red',
            'green',
            'yellow',
        ]
    },
    {
        name: 'Freedom',
        rating: '16',
        colors: [
            'grey',
            'yellow',
        ]
    },
    {
        name: 'Space',
        rating: '50',
        colors: [
            'purple',
            'green',
            'orange',
        ]
    }
]

const resultObject = {}

colors.forEach(color => {
  paintings.forEach(painting => {
    if (painting.colors.includes(color)){
      if(!resultObject[color])
        resultObject[color] = []
      resultObject[color].push(painting)
    }
  })
})

console.log(resultObject)


你可以在这里测试。。。如果你想…这非常有用，它确实有用！非常感谢。虽然我确实认为map、filter和include的组合可能更有效。你怎么认为？再次感谢你的帮助！是的，有很多方法可以编写这个片段。这就是我不用很多脑细胞就能快速完成的事情。希望你能用它作为灵感。你是对的，有很多方法！再次感谢！！：）还有一个问题，我可以在这个组合中添加什么来按评级对绘画进行排序，从最高到最低？我试图将.sort（）放入其中，但我无法获得正确的语法来比较评级。还有一个问题，我可以在这个组合中添加什么来按评级对绘画进行排序，从最高到最低？我正在尝试获取其中的.sort（），但是我无法获得比较评级的正确语法。希望您只对颜色的内部数组进行排序，对吗？找到编辑后的答案。