Как я могу создать новый объект на основе объекта с массивами - PullRequest
0 голосов
/ 11 мая 2019

У меня есть один глобальный сохраненный массив с каталогом и списком элементов, которые пользователь сохранил для него.Мне нужно создать новый массив объектов (с массивами) только с элементами, сохраненными клиентом.Я использую javascript в реакции-нативной, но я думаю, что javascript будет настолько глобальным, насколько это возможно.

Я уже успешно отфильтровал «категории», а также отфильтровал фигуры с помощью array.map и array.фильтр, но мне действительно нужно, чтобы базовая структура была сформирована заново, чтобы я мог повторно использовать компонент для отображения списка.

Глобальный массив

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",
             }
        ]]
    },
]

1 Ответ

0 голосов
/ 11 мая 2019

Вот один из способов сделать это, который, как вы думали, использует карту и фильтр.Новый элемент каталога создается с использованием 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);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...