Home > Mobile >  map array of objects using a dictionary
map array of objects using a dictionary

Time:02-19

Parsing an array of objects to a new form using a dictionary as alias but i wonder if it can be done without the Object.keys

const mapper = {
    "card_title": "title", 
    "card_content": "content",  
    "card_subtitle": "subtitle" 
}

const data = [
    {
        card_title: "wowo1",
        card_content: "wowo1",
        card_subtitle: "wowo1",
    },
    {
        card_title: "wowo1",
        card_content: "wowo1",
        card_subtitle: "wowo1",
    },
    {
        card_title: "wowo1",
        card_content: "wowo1",
        card_subtitle: "wowo1",
    },
]

this is the part where i would like to change it maybe with the spread operator

let results = data.map((r) => {
    let obj = {};
    Object.keys(mapper).map(key => 
        obj[mapper[key]] = r[key]
    )
    return obj;
 })

Expected result that i achieved with the code above

[
  { title: 'wowo1', content: 'wowo1', subtitle: 'wowo1' },
  { title: 'wowo1', content: 'wowo1', subtitle: 'wowo1' },
  { title: 'wowo1', content: 'wowo1', subtitle: 'wowo1' }
]

CodePudding user response:

You should use Object.entries to get key, value pairs as an array, and then use Object.fromEntries to get the new object after mapping the key using mapper and keeping value as it is.

Try like below.

const mapper = {
    "card_title": "title", 
    "card_content": "content",  
    "card_subtitle": "subtitle" 
}

const data = [ { card_title: "wowo1", card_content: "wowo1", card_subtitle: "wowo1", }, { card_title: "wowo1", card_content: "wowo1", card_subtitle: "wowo1", }, { card_title: "wowo1", card_content: "wowo1", card_subtitle: "wowo1", }, ]

const output = data.map((item) =>
  Object.fromEntries(
    Object.entries(item).map(([key, value]) => [mapper[key], value])
  )
);

console.log(output);

CodePudding user response:

Without changing mapper you will either have to use Object.keys() on mapper OR on the data objects. Maybe you want to use a map ?

const mapper = new Map()
mapper.set('card_title', 'title')
mapper.set('card_content', 'content')
mapper.set('card_subtitle', 'subtitle')


const data = [
    {
        card_title: "wowo1",
        card_content: "wowo1",
        card_subtitle: "wowo1",
    },
    {
        card_title: "wowo1",
        card_content: "wowo1",
        card_subtitle: "wowo1",
    },
    {
        card_title: "wowo1",
        card_content: "wowo1",
        card_subtitle: "wowo1",
    },
]

const mapped = data.map(d => {
    const obj = {}
    mapper.forEach((val, key) => {
        obj[val] = d[key]
    })
    return obj
})


console.log(mapped)

using Map and reduce()

const mapper = new Map()
mapper.set('card_title', 'title')
mapper.set('card_content', 'content')
mapper.set('card_subtitle', 'subtitle')


const data = [{
        card_title: "wowo1",
        card_content: "wowo1",
        card_subtitle: "wowo1",
    },
    {
        card_title: "wowo1",
        card_content: "wowo1",
        card_subtitle: "wowo1",
    },
    {
        card_title: "wowo1",
        card_content: "wowo1",
        card_subtitle: "wowo1",
    },
]



const mapped = data.map(src => {
    return Array.from(mapper).reduce((obj, [from, dest]) => {
        obj[dest] = src[from]
        return obj
    }, {})
})

console.log(mapped)

  • Related