Home > OS >  Mapping array in javacript app in a react app
Mapping array in javacript app in a react app

Time:06-10

This is my array, I'm working on react app

const categoryObj = [
    {
        id: "463e989a-c4f2-4616-85c5-0cb610c5fff0",
        name: "Women",
        subCategory: [
            {
                id: "91ba7308-b68e-4d0c-85d8-0cc8272c6bc8",
                name: "All",
                icon: "AllIcon"
            },
            {
                id: "0e0712c5-0b5a-4d4e-acf5-3d7faf2caa2a",
                name: "Clothes",
                icon: "ClothesIcon",
                sections: [
                    {
                        id: "9b7a7a58-04a1-4aba-ba68-0e6b1390021e",
                        name: "All",
                        href: "Women/Clothes/All".split(' ').join('-').trim().toLowerCase()
                    }
                ]
            }
        ]
    }
]

how can I access "women" in this array ? (I have many items like "women" this is just a sample of a large array. if you can suggest a mapping method it's better.)

CodePudding user response:

You can map through it to get the name value in this way:

categoryObj.map((category) => category.name)

CodePudding user response:

const categoryObj = [
    {
        id: "463e989a-c4f2-4616-85c5-0cb610c5fff0",
        name: "Women",
        subCategory: [
            {
                id: "91ba7308-b68e-4d0c-85d8-0cc8272c6bc8",
                name: "All",
                icon: "AllIcon"
            },
            {
                id: "0e0712c5-0b5a-4d4e-acf5-3d7faf2caa2a",
                name: "Clothes",
                icon: "ClothesIcon",
                sections: [
                    {
                        id: "9b7a7a58-04a1-4aba-ba68-0e6b1390021e",
                        name: "All",
                        href: "Women/Clothes/All".split(' ').join('-').trim().toLowerCase()
                    }
                ]
            }
        ]
    },
    {
        id: "463e989a-c4f2-4616-85c5-0cb610c5fff0",
        name: "Men",
        subCategory: [
            {
                id: "91ba7308-b68e-4d0c-85d8-0cc8272c6bc8",
                name: "All",
                icon: "AllIcon"
            },
            {
                id: "0e0712c5-0b5a-4d4e-acf5-3d7faf2caa2a",
                name: "Clothes",
                icon: "ClothesIcon",
                sections: [
                    {
                        id: "9b7a7a58-04a1-4aba-ba68-0e6b1390021e",
                        name: "All",
                        href: "Women/Clothes/All".split(' ').join('-').trim().toLowerCase()
                    }
                ]
            }
        ]
    },
    {
        id: "463e989a-c4f2-4616-85c5-0cb610c5fff0",
        name: "Children",
        subCategory: [
            {
                id: "91ba7308-b68e-4d0c-85d8-0cc8272c6bc8",
                name: "All",
                icon: "AllIcon"
            },
            {
                id: "0e0712c5-0b5a-4d4e-acf5-3d7faf2caa2a",
                name: "Clothes",
                icon: "ClothesIcon",
                sections: [
                    {
                        id: "9b7a7a58-04a1-4aba-ba68-0e6b1390021e",
                        name: "All",
                        href: "Women/Clothes/All".split(' ').join('-').trim().toLowerCase()
                    }
                ]
            }
        ]
    }
]
const result = categoryObj.filter(obj => obj.name === 'Women')
console.log('multi objects :', result)
// if unique with name 
const resultUnique = categoryObj.find(obj => obj.name === 'Women')
console.log('unique object :', resultUnique)

CodePudding user response:

const res  =  categoryObj.filter(item=>item.name === 'Women');
  • Related