map array of objects using a dictionary

user_6474492 0
Viewed 1016

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' }
]
object dictionary arrays javascript
2 Answers

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)

user_80187160

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);

user_85104050
Related