Fill array of objects with multiple keys and values

Question

I have a method on @change which recieve these values.

 changeAttr(id, key, value) {
  const selections = [];
},

id could be any number, key could be: color, size, sex, etc..., value could be: red, 8, female, etc. In the first reception the values can be for example: id = 3, key = "color", value = "red" and they change when the user select another option. For example: id = 3, key = "sex", value = "female" or id = 5, key = "size", value = "50" ...etc

I want to dynamically fill an array of objects with the values this way for example.

selections = [{
              "3": { 
                  "color": "red",
                  "sex": "male",
                  "size": "40" 
              },
              {
              "5": { 
                  "color": "black",
                  "sex": "female",
                  "size": "36" 
              },
              {
              "8":{ 
                 "color": "black",
                 "sex": "female",
                 "size": "36" 
              ...
              },
              ...
              }];

I want to overwrite the values if the key already exists for the same id. If it does not exist, it must be added for its id.

I hope I have explained clearly. Thank you very much for your time

Esteban MANSART · Accepted Answer · 2020-11-03 14:05:57Z

1

You can simply use an array syntax :

Considering

let yourObject = {}

You can use [] to define a property

yourObject["color"] = "red"

So with your logic, you can do :

yourObject[key] = value

Tip : Using int strings as index is not really a good pratice because JS reindexes arrays, i advise you to construct your object like this :

[
  {
    id: 3
    color: "red",
    sex: "male",
    size: "40" 
  },
  {
    id: 5,
    color: "black",
    sex: "female",
    size: "36" 
  },
  {
    id: 8,
    color: "black",
    sex: "female",
    size: "36" 
  },
  ...
];

EDIT :

const selections = [];

function changeAttr(id, key, value) {
   
  // Get the index in selection by id
  let index = selections.map(t=>t.id).indexOf(id)
  
  
  if (index !== - 1) { // if the id have been found
  
      selections[index][key] = value // It create the index "key" if not found, and replace the value if found 
  
  } else { // if the id have not been found
    
    let tmp = {
      id: id
    }
    
    tmp[key] = value
    selections.push(tmp)
    
  } 
}

console.log(selections)
changeAttr(6, "color", "red")
console.log(selections)
changeAttr(3, "sex", "female")
console.log(selections)
changeAttr(6, "sex", "male")
console.log(selections)
changeAttr(6, "color", "yellow")
console.log(selections)

You can run snippet to see, I think that is what you are looking for

edited Nov 3, 2020 at 14:05

answered Nov 3, 2020 at 13:40

Esteban MANSART

5613 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Alberto Rhuertas Over a year ago

thanks for your contribution. I still have doubts how to build the array depending on the inputs and overwrite if the key already exists for the same id :(

Esteban MANSART Over a year ago

I've edited my answer, and i think this is more explicit

elad BA · Accepted Answer · 2020-11-03 13:33:41Z

0

newValue =  { 
  "color": "black",
  "sex": "female",
  "size": "36" 
 }


selections.forEach((oItem)=>{
  for(let key in oItem){
    if(oItem.hasOwnProterty(key)){
       // overwrite
    }else {
    // set the newValue 
    }

  }
  
})

answered Nov 3, 2020 at 13:33

elad BA

1,99814 silver badges22 bronze badges

3 Comments

Alberto Rhuertas Over a year ago

thanks! I need some help with the newValue setting too. I mean, I need to group the values by id too.

elad BA Over a year ago

if I helped you pls mark my answer as the correct one :)

Alberto Rhuertas Over a year ago

Of course, I will do it if a get this thing clear. I still have doubts to resolve. sorry :(

Collectives™ on Stack Overflow

Fill array of objects with multiple keys and values

2 Answers 2

2 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related