Ways to set values for an array of objects containing identical key names

Question

Ways to set values for an array of objects containing identical key names

 let people = [ { firstName: 'Ben' }, {firstName : 'Bob' } ];
 let location =  { city: 'Dublin' , Country: 'Ireland' } ;
 let result = [];
 let tempObj = {};
 for(let person of people){
   tempObj = Object.assign({}, location);
   tempObj['fname'] = person.firstName;
   result.push(tempObj);
 }

expected output :

[ {fname:'Ben', city: 'Dublin' , Country: 'Ireland'}, {fname:'Bob',city: 
'Dublin' , Country: 'Ireland'}]

what I'm getting is:

[ {fname:'Ben', city: 'Dublin' , Country: 'Ireland'}, {fname:'Ben', city: 'Dublin' , Country: 'Ireland'}}]

What am I doing wrong here?

javascript typescript

Answer 1

Answer №1

By creating a new object inside the for loop each time, you can avoid pushing the same reference into the array multiple times. This way, each object in the array will have its own unique reference.


let personNames = [{ firstName: 'Alice' }, {firstName : 'Alex' }];
let nameList = [];

for(let name of personNames){
  let nameObj = {};
  nameObj['f_name'] = name.firstName;
  nameList.push(nameObj);
}

Answer 2

By creating a new object inside the for loop each time, you can avoid pushing the same reference into the array multiple times. This way, each object in the array will have its own unique reference.


let personNames = [{ firstName: 'Alice' }, {firstName : 'Alex' }];
let nameList = [];

for(let name of personNames){
  let nameObj = {};
  nameObj['f_name'] = name.firstName;
  nameList.push(nameObj);
}

Answer 3

Answer №2

To accomplish this task, you can utilize the Array.map method from ES6.

const people = [{
  name: 'Alice',
}, {
  name : 'Alex',
}];

const newNameList = people.map(person => ({
  n_name: person.name,
}));
 
console.log(newNameList);

In the code snippet above, we are iterating over each element in the array 'people' and creating a new object for each element with a key called 'n_name'.

Answer 4

To accomplish this task, you can utilize the Array.map method from ES6.

const people = [{
  name: 'Alice',
}, {
  name : 'Alex',
}];

const newNameList = people.map(person => ({
  n_name: person.name,
}));
 
console.log(newNameList);

In the code snippet above, we are iterating over each element in the array 'people' and creating a new object for each element with a key called 'n_name'.

Answer 5

Answer №3

The for loop needs to include the nameObj variable

Answer 6

The for loop needs to include the nameObj variable

Ways to set values for an array of objects containing identical key names

Answer №1

Answer №2

Answer №3

Similar questions

The onclick attribute on a button in HTML is not functioning properly following the inclusion of an Ajax load

Optimizing React components by efficiently updating props without triggering unnecessary renders

Form fields in Bootstrap 4 will consistently expand downward in the select dropdown menu

I keep encountering the following issue: "It seems that the file requested at /images/crown.png is not recognized as a valid image, as it was received as text/html; charset=utf-8."

Discovering the most recent Node.js version: A step-by-step guide

Is there a way to dynamically update the text in an HTML element with a randomly generated value using JavaScript?

"The Django querydict receives extra empty brackets '[]' when using jQuery ajax post to append items to a list in the app

Asynchronous loading of HTML templates using JQuery/JavaScript

The error message "Can't resolve all parameters for CustomerService" is preventing Angular from injecting HttpClient

Tips on dividing the information in AngularJS

Is it possible for me to convert my .ejs file to .html in order to make it compatible with Node.js and Express?

Encountering issue: Unrecognized parameter "id" in the "user" field of type "Query" [GraphQL, Relay, React]

Ionic 5 page div within ion-contents element is experiencing scrolling issues on iPhone devices

What is the best way to showcase a set of paired arrays as key-value pairs?

Error: Cannot use Object.fromEntries as a function

React.js - Add a new row div when reaching a limit of X items to keep the layout

Ways to modify, delete, or insert data elements within a collection of values using React

What is the method to determine the overall size of a webpage using the Google PageSpeed API?

What is the most reliable method for converting a 32-bit unsigned integer to a big endian byte array?

Using an array in jade rendering