How to create an array of objects using a loop (javascript)

Question

We're supposed to do this exercise for webdev class and I can't figure out how to solve it.

We have to create a 'person' object and fill it with random information using a method called randomPerson(). That part works fine so far.

let person = {
                fname: "",
                lname: "",
                city: "",
                street: "",
                hobbies: new Array(),
            }

After this, we're supposed to create another function that creates 10 of these random person objects and stores them in an array.

This is what I have so far:

let person = {
  fname: "",
  lname: "",
  city: "",
  street: "",
  hobbies: new Array(),
};

personsArr = new Array();

function persons10() {

  for (let i = 0; i < 10; i++) {
    // randomPerson() // makes it crash
    personsArr.fill(person)
  }
}
persons10()
console.log(personsArr)

When I try to run that, the page gets stuck loading and freezes.

You seem to misunderstand what [`fill`](//developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/fill) does; your use of it makes no sense. Please also see [Array.prototype.fill() with object passes reference and not new instance](/q/35578478/4642212). Where is `randomPerson` defined? — Sebastian Simon, Nov 08 '22 at 15:21

score 2 · Answer 1 · answered Nov 08 '22 at 15:30

Fill is the wrong function to use for this use case: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/fill

The proper function to use in this case would be push: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push

There are also a couple of mistakes in your code:

personsArr is never declared. It should be declared using either const or let. https://javascript.info/variables

// since you didnt share the randomPerson() function, I created a dummy function
function randomPerson() {
  let person = {
                fname: "",
                lname: "",
                city: "",
                street: "",
                hobbies: new Array(),
  }


  return person;
}


let personsArr = new Array();

function persons10() {
  for(let i = 0; i < 10; i++) {
    personsArr.push(randomPerson());
  }
  
  console.log(personsArr);
  
}

persons10();

score 1 · Answer 2 · answered Nov 08 '22 at 15:29

Assuming you have randomPerson() defined somewhere and it returns a person you need to assign it to I believe person. Then instead of fill you probably want push to add to the array not fill with the same person.

function randomPerson() {
  return { // TODO randomize data
    fname: "",
    lname: "",
    city: "",
    street: `${Math.floor(Math.random()*10+1)+1} Street`,
    hobbies: new Array(),
  }
}

let personsArr = new Array();

function persons10() {

  for (let i = 0; i < 10; i++) {
    let person = randomPerson()
    personsArr.push(person)
  }
}
persons10()
console.log(personsArr)

score 0 · Answer 3 · answered Nov 08 '22 at 15:25

0

First of all, the personsArr is never declared, you need to always have a variable initialized with a "let", "const" or "var" keyword. Same goes for the person variable which not only is not declared is not assigned anything either.

If you want to add a new element to an array you use the method .push() not .fill().

Also if your program "crashes" as you said it, please include the Error message that you received in the console.

answered Nov 08 '22 at 15:25

ncpa0cpl

192
1
13

`let person` is the object at the top. – Sebastian Simon Nov 08 '22 at 15:27

score 0 · Answer 4 · answered Nov 08 '22 at 15:47

The following example uses Array#map to create an array filled with random people.

[...Array(n)] is used to create an Array of length n to use as a basis for the map.

const random = Math.random, trunc = Math.trunc
const createPerson = (fname, lname) => ({ fname, lname })
const firstNames = ['Sally', 'Bob', 'Alice', 'Walter']
const lastNames = ['Smith', 'Bloggs', 'Black', 'White']
const createRandomPerson = () => 
  createPerson(firstNames[trunc(random() * firstNames.length)], 
               lastNames[trunc(random() * lastNames.length)])

const createNPeople = (n) => [...Array(n)].map(createRandomPerson)

console.log(createNPeople(10))

How to create an array of objects using a loop (javascript)

4 Answers4