Question

我有这个数组const idArray = ["12", "231", "73", "4"]和一个对象

const blueprints = {
  12: {color: red, views: [{name: "front}, {name: "back}, {name: "top}, {name: "bottom}]},
  231: {color: white, views: [{name: "front}, {name: "back}]},
  73: {color: black, views: [{name: "front}, {name: "back}, {name: "top}, {name: "bottom}]},
  4: {color: silver, views: [{name: "front}, {name: "back}, {name: "top}, {name: "bottom}]},
}

如何返回由以下所有对象组成的数组，这些对象具有正面，背面，顶部和底部 strong>使用ES6 map/filter/some等？

result =[
    {colorId: "12", views: [{name: "front}, {name: "back}, {name: "top}, {name: "bottom}]}
    {colorId: "73", views: [{name: "front}, {name: "back}, {name: "top}, {name: "bottom}]}
    {colorId: "4", views: [{name: "front}, {name: "back}, {name: "top}, {name: "bottom}]}
]

我在这里做过，但我觉得它太乱了，很难看懂。任何人都可以建议如何缩短它，并使其更易于使用ES6函数（地图，过滤器...）阅读？

 const result = idArray.map(id => {
      const bluePrint = bluePrints[id];
      const exists = blurPrint.views.some(view => view.name === 'top' || view.name === 'bottom');

      if (exists) {
        return {
          colorId: id,
          views: bluePrint.views
        }
      }
    }).filter(bluePrint => !bluePrint);

Answer 1

您可以filter个ID，以便目标颜色集中的every种颜色位于该ID的blueprint.views中，然后将map个ID放入您想要的结果对象中：< / p>

const idArray = ["12", "231", "73", "4"];
const blueprints = {
  12: {color: 'red', views: [{name: "front"}, {name: "back"}, {name: "top"}, {name: "bottom"}]},
  231: {color: 'white', views: [{name: "front"}, {name: "back"}]},
  73: {color: 'black', views: [{name: "front"}, {name: "back"}, {name: "top"}, {name: "bottom"}]},
  4: {color: 'silver', views: [{name: "front"}, {name: "back"}, {name: "top"}, {name: "bottom"}]},
};

const result = idArray
                .filter(id => {
                  const colors = blueprints[id].views.map(e => e.name);
                  return ['front', 'back', 'top', 'bottom'].every(s => colors.includes(s));
                })
                .map(id => ({colorId: id, views: blueprints[id].views}))

console.log(result);

Answer 2

您可以在map()上idArray以所需的格式创建数组，然后使用filter()测试视图数组和过滤器中是否包含every()所需的字符串找出不完整的项目：

const blueprints = {
    12: {color: "red", views: [{name: "front"}, {name: "back"}, {name: "top"}, {name: "bottom"}]},
    231: {color: "white", views: [{name: "front"}, {name: "back"}]},
    73: {color: "black", views: [{name: "front"}, {name: "back"}, {name: "top"}, {name: "bottom"}]},
    4: {color: "silver", views: [{name: "front"}, {name: "back"}, {name: "top"}, {name: "bottom"}]},
  }

const idArray = ["12", "231", "73", "4"] 
const required = ['front', 'back', 'top', 'bottom']

let newArry = idArray
        .map(colorID => ({colorID, views: blueprints[colorID].views }) )
        .filter(item => required.every(direction => item.views.some(v => v.name == direction) ))

console.log(newArry)

Answer 3

Object.keys(blueprints)
  .map(k => ({colorId:k, views:blueprints[k].views}))
  .filter(el =>
    ['front', 'back', 'top', 'bottom'].every(it => 
      el.views.some(s => s.name === it)
  )
)

在ES6中提取数据

3 个答案: