如何基于带有数组的对象创建新对象

Question

我有一个带有目录的全局保存数组，以及用户为他保存的项目列表。 我需要创建一个新的对象数组（带有数组），其中仅包含客户端保存的项目。 我在 react-native 中使用 javascript，但我认为 javascript 将尽可能全球化。

我已经成功过滤了“类别”，还用array.map和array.filter过滤了图形，但我真的需要重新形成基本结构，所以我可以重用一个组件来渲染列表。

全局数组

const catalog = [
    {
        title: "Masculine T-Shirts 2017",
        code:"1101",
        page:"http://www.blablabla.com/catalog/1101/",
        data: [[
            {
                code:"1101-1",
                name:"Masculine T-Shirt product 1",
                page:"http://www.blablabla.com/catalog/1101/product/1101-1/",
                description:"description of product 1",
             },
             {
                code:"1101-2",
                name:"Masculine T-Shirt product 2",
                page:"http://www.blablabla.com/catalog/1101/product/1101-2/",
                description:"description of product 2",
             },
             {
                code:"1101-3",
                name:"Masculine T-Shirt product 3",
                page:"http://www.blablabla.com/catalog/1101/product/1101-3/",
                description:"description of product 3",
             }
        ]]
    },
    {
        title: "Masculine T-Shirts 2018",
        code:"1203",
        page:"http://www.blablabla.com/catalog/1203/",
        data: [[
            {
                code:"1203-1",
                name:"Masculine T-Shirt product 1",
                page:"http://www.blablabla.com/catalog/1203/product/1203-1/",
                description:"description of product 1",
             },
             {
                code:"1203-2",
                name:"Masculine T-Shirt product 2",
                page:"http://www.blablabla.com/catalog/1203/product/1203-2/",
                description:"description of product 2",
             },
             {
                code:"1203-3",
                name:"Masculine T-Shirt product 3",
                page:"http://www.blablabla.com/catalog/1203/product/1203-3/",
                description:"description of product 3",
             },
             {
                code:"1203-4",
                name:"Masculine T-Shirt product 4",
                page:"http://www.blablabla.com/catalog/1203/product/1203-4/",
                description:"description of product 4",
             }
        ]]
    },
    {
        title: "Masculine socks 2018",
        code:"1304",
        page:"http://www.blablabla.com/catalog/1304/",
        data: [[
            {
                code:"1304-1",
                name:"Masculine socks product 1",
                page:"http://www.blablabla.com/catalog/1304/product/1304-1/",
                description:"description of socks product 1",
             },
             {
                code:"1304-2",
                name:"Masculine socks product 2",
                page:"http://www.blablabla.com/catalog/1304/product/1304-2/",
                description:"description of socks product 2",
             }
        ]]
    },
]

用户保存列表：

SavedList = ["1304-2","1101-3","1304-2"];

我需要对返回的数组进行过滤，但与原始数组的形式相同，例如：

savedCatalog = [
    {
        title: "Masculine T-Shirts 2017",
        code:"1101",
        page:"http://www.blablabla.com/catalog/1101/",
        data: [[
             {
                code:"1101-3",
                name:"Masculine T-Shirt product 3",
                page:"http://www.blablabla.com/catalog/1101/product/1101-3/",
                description:"description of product 3",
             }
        ]]
    },
    {
        title: "Masculine socks 2018",
        code:"1304",
        page:"http://www.blablabla.com/catalog/1304/",
        data: [[
            {
                code:"1304-1",
                name:"Masculine socks product 1",
                page:"http://www.blablabla.com/catalog/1304/product/1304-1/",
                description:"description of socks product 1",
             },
             {
                code:"1304-2",
                name:"Masculine socks product 2",
                page:"http://www.blablabla.com/catalog/1304/product/1304-2/",
                description:"description of socks product 2",
             }
        ]]
    },
]

Answer 1

这是执行此操作的一种方法，您认为它使用映射和过滤器。使用 Object.assign 构造一个新目录项（因此我们不直接更改目录常量中的内容），该目录项仅包含搜索项，然后我们过滤新构造的目录项以查找搜索结果大于零的目录项。

const catalog = [
    {
        title: "Masculine T-Shirts 2017",
        code:"1101",
        page:"http://www.blablabla.com/catalog/1101/",
        data: [[
            {
                code:"1101-1",
                name:"Masculine T-Shirt product 1",
                page:"http://www.blablabla.com/catalog/1101/product/1101-1/",
                description:"description of product 1",
             },
             {
                code:"1101-2",
                name:"Masculine T-Shirt product 2",
                page:"http://www.blablabla.com/catalog/1101/product/1101-2/",
                description:"description of product 2",
             },
             {
                code:"1101-3",
                name:"Masculine T-Shirt product 3",
                page:"http://www.blablabla.com/catalog/1101/product/1101-3/",
                description:"description of product 3",
             }
        ]]
    },
    {
        title: "Masculine T-Shirts 2018",
        code:"1203",
        page:"http://www.blablabla.com/catalog/1203/",
        data: [[
            {
                code:"1203-1",
                name:"Masculine T-Shirt product 1",
                page:"http://www.blablabla.com/catalog/1203/product/1203-1/",
                description:"description of product 1",
             },
             {
                code:"1203-2",
                name:"Masculine T-Shirt product 2",
                page:"http://www.blablabla.com/catalog/1203/product/1203-2/",
                description:"description of product 2",
             },
             {
                code:"1203-3",
                name:"Masculine T-Shirt product 3",
                page:"http://www.blablabla.com/catalog/1203/product/1203-3/",
                description:"description of product 3",
             },
             {
                code:"1203-4",
                name:"Masculine T-Shirt product 4",
                page:"http://www.blablabla.com/catalog/1203/product/1203-4/",
                description:"description of product 4",
             }
        ]]
    },
    {
        title: "Masculine socks 2018",
        code:"1304",
        page:"http://www.blablabla.com/catalog/1304/",
        data: [[
            {
                code:"1304-1",
                name:"Masculine socks product 1",
                page:"http://www.blablabla.com/catalog/1304/product/1304-1/",
                description:"description of socks product 1",
             },
             {
                code:"1304-2",
                name:"Masculine socks product 2",
                page:"http://www.blablabla.com/catalog/1304/product/1304-2/",
                description:"description of socks product 2",
             }
        ]]
    },
]

let savedList = ["1304-2","1101-3","1304-1"];

let savedCatalog = catalog.map(item =>
  Object.assign({}, item, {data: [
    item.data[0].filter(dat => savedList.includes(dat.code))
  ]})
).filter(item => item.data[0].length);

console.log(savedCatalog);