The dojo array implemented a new element, pushing out the old one

Question

The dojo array implemented a new element, pushing out the old one

The JavaScript code below is supposed to populate the array personNames with objects containing names from an array of persons. However, it incorrectly repeats the same name for each object instead of assigning different names:

[{"name":"smith"},{"name":"smith"},{"name":"smith"}]

Instead, it should be generating an array like this:

[{"name":"john"},{"name":"doug"},{"name":"smith"}]

var personNames = []; 
var personName = {}; 

var persons = [{"firstname": "john", "id": "111"}, {"firstname": "doug", "id": "777"}, {"firstname": "smith", "id": "888"}];

if(persons.length > 0){
    array.forEach(persons, function(person){
        personName.name = person.firstname;
        personNames.push(personName);
    });
}

javascript arrays dojo push

Answer 1

Answer №1

To extract names efficiently, consider using Array.prototype.map:

var persons = [{"firstname": "john", "id": "111"}, {"firstname": "doug", "id": "777"}, {"firstname": "smith", "id": "888"}];

var personNames = persons.map(p => ({ name: p.firstname }));

console.log(personNames);

However, the issue in your code arises from creating an object and repeatedly pushing the same object with altered values to the array.

You might have overlooked something regarding objects and referencing. Here is a corrected version of your implementation:

var persons = [{"firstname": "john", "id": "111"}, {"firstname": "doug", "id": "777"}, {"firstname": "smith", "id": "888"}];

var personNames = [];

persons.forEach(p => personNames.push({ name: p.firstname }));

console.log(personNames);

Additionally, there is no need to verify if there are any items in the persons array.

Answer 2

To extract names efficiently, consider using Array.prototype.map:

var persons = [{"firstname": "john", "id": "111"}, {"firstname": "doug", "id": "777"}, {"firstname": "smith", "id": "888"}];

var personNames = persons.map(p => ({ name: p.firstname }));

console.log(personNames);

However, the issue in your code arises from creating an object and repeatedly pushing the same object with altered values to the array.

You might have overlooked something regarding objects and referencing. Here is a corrected version of your implementation:

var persons = [{"firstname": "john", "id": "111"}, {"firstname": "doug", "id": "777"}, {"firstname": "smith", "id": "888"}];

var personNames = [];

persons.forEach(p => personNames.push({ name: p.firstname }));

console.log(personNames);

Additionally, there is no need to verify if there are any items in the persons array.

Answer 3

Answer №2

  iterate through an array of persons and assign their first names to a new object called personName before pushing it into another array called personNames.

personName points to the same object during each iteration due to JavaScript's memory reference behavior, causing updates to reflect everywhere.

To avoid this issue, reset personName for each iteration:

  iterate through an array of persons and assign their first names to a new object called personName before pushing it into another array called personNames.

(Should the initial line be changed to

persons.forEach(function(person){

?)

Answer 4

  iterate through an array of persons and assign their first names to a new object called personName before pushing it into another array called personNames.

personName points to the same object during each iteration due to JavaScript's memory reference behavior, causing updates to reflect everywhere.

To avoid this issue, reset personName for each iteration:

  iterate through an array of persons and assign their first names to a new object called personName before pushing it into another array called personNames.

(Should the initial line be changed to

persons.forEach(function(person){

?)

Answer 5

Answer №3

Here is a simple way to utilize the personName variable locally:

var individualNames = [];

var individuals = [{"firstname": "alice", "id": "222"}, {"firstname": "bob", "id": "555"}, {"firstname": "emily", "id": "999"}];

if(individuals.length > 0) {
    individuals.forEach(item => {
      var personName = {};
      personName.title = item.firstname;
      individualNames.push(personName);
    });
}
console.log(individualNames); // [ { title: 'alice' }, { title: 'bob' }, { title: 'emily' } ]

Answer 6

Here is a simple way to utilize the personName variable locally:

var individualNames = [];

var individuals = [{"firstname": "alice", "id": "222"}, {"firstname": "bob", "id": "555"}, {"firstname": "emily", "id": "999"}];

if(individuals.length > 0) {
    individuals.forEach(item => {
      var personName = {};
      personName.title = item.firstname;
      individualNames.push(personName);
    });
}
console.log(individualNames); // [ { title: 'alice' }, { title: 'bob' }, { title: 'emily' } ]

Answer 7

Answer №4

$array.forEach() will not work as a function if array is not defined. Make sure to use the correct array name, such as persons.forEach().
To avoid accessing the global instance of a variable and instead use it locally, ensure to use personName within the scope where it is declared. View code snippet on JS Bin

   

 var personNames = []; 

var persons = [{"firstname": "john", "id": "111"}, {"firstname": "doug", "id": "777"}, {"firstname": "smith", "id": "888"}];

if(persons.length > 0){
  persons.forEach(function(person){
    //use personName locally
    var personName = {};
    personName.name = person.firstname;

    personNames.push(personName);
  });
}

console.log(personNames);

Answer 8

$array.forEach() will not work as a function if array is not defined. Make sure to use the correct array name, such as persons.forEach().
To avoid accessing the global instance of a variable and instead use it locally, ensure to use personName within the scope where it is declared. View code snippet on JS Bin

   

 var personNames = []; 

var persons = [{"firstname": "john", "id": "111"}, {"firstname": "doug", "id": "777"}, {"firstname": "smith", "id": "888"}];

if(persons.length > 0){
  persons.forEach(function(person){
    //use personName locally
    var personName = {};
    personName.name = person.firstname;

    personNames.push(personName);
  });
}

console.log(personNames);

Answer 9

Answer №5

Give it a shot

var names = []; 

var people = [{"first": "mike", "id": "111"}, {"first": "dave", "id": "777"}, {"first": "jane", "id": "888"}];
for (i = 0; i < people.length; i++) {
   names.push({full: people[i].first});
}

Answer 10

Give it a shot

var names = []; 

var people = [{"first": "mike", "id": "111"}, {"first": "dave", "id": "777"}, {"first": "jane", "id": "888"}];
for (i = 0; i < people.length; i++) {
   names.push({full: people[i].first});
}

The dojo array implemented a new element, pushing out the old one

Answer №1

Answer №2

Answer №3

Answer №4

Answer №5

Similar questions

When a child component sends props to the parent's useState in React, it may result in the return value being undefined

Unable to save data in local storage

Validation issue with Reactive Forms not functioning as expected

Error rendering {message} object on the Chrome Console

Sorting a function with two parameters in descending order is possible even when dealing with an empty array and no initial value for reduction

Is it possible to assign functions to each keystroke that does not correspond to a specific keybinding in Angular?

Running pug directly from the local node_modules directory

Issue with Bootstrap alignment on the right side

Executing a function by click event using the onclick attribute from a file located in the public directory of my project (Next

What is the best way to load a database URL asynchronously and establish a database connection prior to the initialization of an Express

There is an issue with the JSON format being received by fetch in JS when using json_encode in php

Issue encountered during app creation using the command line interface

Issue with retrieving attributes in the directive

Incorporating jQuery Masonry for seamless overlapping effect while implementing infinite scroll

During the rendering process, a referenced computed property is not defined on the instance

I could really use some assistance right now. I'm in the midst of a project where I'm pulling data from web services in JSON format

Utilizing v-model for dynamic binding within a v-for iteration

Vue's beforeRouteEnter hook patiently awaits for the child component to complete its request

Error: AJAX response shows as NaN, indicating that the requested resource was not found

TypeORM Error: Trying to access property 'findOne' of an undefined object