CODEWITHSUNDEEP
javascriptarrayslodash
Big Mike
Big Mike

Reputation: 37

Add key/value pair to object within array of arrays?

Given the following structure:

const data = {
  "show": "Family Guy",
  "characters": [
      [{name: 'Peter', age: 40, city: 'Quahog'}],
      [{name: 'Louis', age: 30}],
      [{name: 'Chris', age: 16}],
      [{name: 'Stewie', age: 1}]
    ]
 }

How can we add to each character the key/value pair of city: 'Quahog' so the output looks as follows:

const item = {
  "show": "Family Guy",
  "characters": [
      [{name: 'Peter', age: 40, city: 'Quahog'}],
      [{name: 'Louis', age: 30, city: 'Quahog'}], // city added
      [{name: 'Chris', age: 16, city: 'Quahog'}], // city added
      [{name: 'Stewie', age: 1, city: 'Quahog'}]  // city added
    ]
 }

We tried using:

let city = data.characters.[0][0].city;
costs = _.map(items, (itemArray) => {
            items = _.map(itemArray, (item) => {
              if(!item.city) {
                item.city = city;
              }
        });

But it's not working as intended and we can't get the desired output. Any idea how to accomplish this?

Upvotes: 0

Views: 533

Answers (5)

drent
drent

Reputation: 124

const { city } = data.characters.find(([item]) => !!item.city?.length)[0];

const newData = {
    ...data,
    characters: data.characters.map(([char]) => [{ ...char, city }])
};

Upvotes: 0

Carsten Massmann
Carsten Massmann

Reputation: 28196

Here is another way of doing it with .reduce():

const data = {
  "show": "Family Guy",
  "characters": [
  [{name: 'Peter', age: 40, city: 'Quahog'}],
  [{name: 'Louis', age: 30}],
  [{name: 'Chris', age: 16}],
  [{name: 'Stewie', age: 1}]
]
 };

data.characters.reduce((a,c)=>
 (c[0].city=a[0].city,a));

console.log(data);

When using .reduce() without a second argument it will pick up the first array element as the initial value which is then used as a template to copy the .city property to all the other elements. The actual return value of the .reduce() method is discarded but the input array itself (data) is modified in the process and is then shown in the console.log() expression.

Upvotes: 1

Toni Bardina Comas
Toni Bardina Comas

Reputation: 1798

Not sure about the reason for having these single item arrays but this solution will do the work (I'll recommend you take a look at the process that creates this data format which is a little weird)

const data = {
  "show": "Family Guy",
  "characters": [
      [{name: 'Peter', age: 40, city: 'Quahog'}],
      [{name: 'Louis', age: 30}],
      [{name: 'Chris', age: 16}],
      [{name: 'Stewie', age: 1}]
    ]
 }
 
 const city = data.characters.find(characters => characters.find(character => character.city))[0].city

const dataWithCities = {
 ...data,
 characters: data.characters.map(characters => characters.map(character => character.city ? character : {...character, city}))
 }
 
 console.log(dataWithCities)

Upvotes: 2

Faizal Hussain
Faizal Hussain

Reputation: 1581

You can do this without lodash

const data = {
  "show": "Family Guy",
  "characters": [
      [{name: 'Peter', age: 40, city: 'Quahog'}],
      [{name: 'Louis', age: 30}],
      [{name: 'Chris', age: 16}],
      [{name: 'Stewie', age: 1}]
    ]
 }

const chars = data.characters.map((x)=>{

    return {...x[0] , city : x[0].city ? x[0].city : city} 
})

const items = {...data , characters : chars};

Upvotes: 0

TappedAsh
TappedAsh

Reputation: 1

try this one

let city = data.characters.[0][0].city;
let newdata = [];
data.characters.map(items, (itemArray) => {
        items = _.map(itemArray, (item) => {
          if(item.city === undefined) {
              newdata.push({...item , city});
          } else { 
           newdata.push({...item});
           }

    })
    costs = {...newdata}

Upvotes: 0

Related Questions