Array concat is overwriting the values in for..each loop

Question

const states = ["BR", "UP"];
const template = [
    {
      "State": "",
      "allotment": 25622
    },
    {
      "State": "",
      "expenditure": 1254
    }
  ];

let totalRecords: any[] = [];
states.forEach(state=>{
  const cc = template.map(record=> {record.State = state; return record})
  console.log(state, cc);// here i get the indiviual record set.
  totalRecords = totalRecords.concat(cc);
})
console.log(totalRecords);

here i am trying to get a concatenated list of template with different states, but somehow it is overwriting the previous records. although as seen in the console after adding map to template, a proper record set is seen. still it is not concatenating properly.

how to do it properly as required result is

[{
  "State": "BR",
  "allotment": 25622
}, {
  "State": "BR",
  "expenditure": 1254
}, {
  "State": "UP",
  "allotment": 25622
}, {
  "State": "UP",
  "expenditure": 1254
}]

T.J. Crowder · Accepted Answer · 2022-06-17 06:43:23Z

3

The problem is that you're reusing the objects from template, just overwriting the properties of those objects. If you want to have multiple objects for each state, you'll need to create new objects instead:

const cc = template.map((record) => {
    record = { ...record, State: state }; // ***
    return record;
});

Live Example:

const states = ["BR", "UP"];
const template = [
    {
        State: "",
        allotment: 25622,
    },
    {
        State: "",
        expenditure: 1254,
    },
];

let totalRecords /*: any[]*/ = [];
states.forEach((state) => {
    const cc = template.map((record) => {
        record = { ...record, State: state };
        return record;
    });
    console.log(state, cc);
    totalRecords = totalRecords.concat(cc);
});
console.log(totalRecords);

.as-console-wrapper {
    max-height: 100% !important;
}

answered Jun 17, 2022 at 6:43

T.J. Crowder

1.1m201 gold badges2k silver badges2k bronze badges

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

Comments

R4ncid · Accepted Answer · 2022-06-17 06:57:42Z

1

you can use flatMap and map for that like this

const states = ["BR", "UP"];
const template = [
    {
      "State": "",
      "allotment": 25622
    },
    {
      "State": "",
      "expenditure": 1254
    }
  ];


const totalRecords =  states.flatMap(State=> template.map(record=> ({...record, State})))

console.log(totalRecords)

answered Jun 17, 2022 at 6:57

R4ncid

7,1651 gold badge8 silver badges21 bronze badges

Comments

Charchit Kapoor · Accepted Answer · 2022-06-17 07:28:18Z

0

The problem in your program lies here: template.map(record=> {record.State = state; return record})

You are not returning a new object, you are overwriting a previous one.

Try this:

const states = ["BR", "UP"];
const template = [
    {
      "State": "",
      "allotment": 25622
    },
    {
      "State": "",
      "expenditure": 1254
    }
  ];

let totalRecords: any[] = [];
states.forEach(state=>{
  const cc = template.map(record=> ({...record, 'State': state}))
  totalRecords = totalRecords.concat(cc);
})
console.log(totalRecords);

edited Jun 17, 2022 at 7:28

answered Jun 17, 2022 at 7:02

Charchit Kapoor

9,3242 gold badges11 silver badges26 bronze badges

Comments

Yosvel Quintero · Accepted Answer · 2022-06-17 08:47:50Z

0

You can use Array.prototype.reduce() combined with Array.prototype.concat(), Array.prototype.map() and Spread syntax (...)

Code:

const states = ['BR', 'UP']
const template = [{State:'',allotment: 25622,},{State:'',expenditure:1254}]

const totalRecords = states.reduce(
  (a, State) => a.concat(template.map((t) => ({ ...t, State }))), 
  []
)

console.log(totalRecords)

edited Jun 17, 2022 at 8:47

answered Jun 17, 2022 at 8:42

Yosvel Quintero

19.1k5 gold badges39 silver badges47 bronze badges

Collectives™ on Stack Overflow

Array concat is overwriting the values in for..each loop

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related