How to add to each element of an Array-CodePudding

I'm attempting to create a new array from an existing array and add "!" to each username from the old array. What i am getting is ['[object Object]!'].

// Complete the below questions using this array:
const array = [
  {
    username: "john",
    team: "red",
    score: 5,
    items: ["ball", "book", "pen"]
  },
  {
    username: "becky",
    team: "blue",
    score: 10,
    items: ["tape", "backpack", "pen"]
  },
  {
    username: "susy",
    team: "red",
    score: 55,
    items: ["ball", "eraser", "pen"]
  },
  {
    username: "tyson",
    team: "green",
    score: 1,
    items: ["book", "pen"]
  },

];

//Create an array using forEach that has all the usernames with a "!" to each of the usernames
const player = []
const newArray = array.forEach((username) => {
  player.push(username   '!');
})
console.log(player);

CodePudding user response：

The idiomatic way is to use Array.prototype.map to transform an array into another array.

const array=[{username:"john",team:"red",score:5,items:["ball","book","pen"]},{username:"becky",team:"blue",score:10,items:["tape","backpack","pen"]},{username:"susy",team:"red",score:55,items:["ball","eraser","pen"]},{username:"tyson",team:"green",score:1,items:["book","pen"]}];

// using each player, append "!" to the end to create a new array
const players = array.map((user) => user.username   "!");

console.log(players);

CodePudding user response：

You needed to add username.username in the player push because now you getting the object not the username.

// Complete the below questions using this array:
const array = [
    {
      username: "john",
      team: "red",
      score: 5,
      items: ["ball", "book", "pen"]
    },
    {
      username: "becky",
      team: "blue",
      score: 10,
      items: ["tape", "backpack", "pen"]
    },
    {
      username: "susy",
      team: "red",
      score: 55,
      items: ["ball", "eraser", "pen"]
    },
    {
      username: "tyson",
      team: "green",
      score: 1,
      items: ["book", "pen"]
    },
  
  ];
  
  //Create an array using forEach that has all the usernames with a "!" to each of the usernames
  const player = []
  const newArray = array.forEach((username) => {
    player.push(username.username   '!');
  })
  console.log(player);

The array.foreach is to make a "object" from your array so every {} will be an object. After that you need to call what you want from the object. So what is more readable is this.

const player = []
  const newArray = array.forEach((person) => {
    player.push(person.username   '!');
  })
  console.log(player);

CodePudding user response：

Here you go. You were trying to add a string to an object, where instead you want to add a the exclamation mark to the username property of the object

// Complete the below questions using this array:
const array = [
  {
    username: "john",
    team: "red",
    score: 5,
    items: ["ball", "book", "pen"]
  },
  {
    username: "becky",
    team: "blue",
    score: 10,
    items: ["tape", "backpack", "pen"]
  },
  {
    username: "susy",
    team: "red",
    score: 55,
    items: ["ball", "eraser", "pen"]
  },
  {
    username: "tyson",
    team: "green",
    score: 1,
    items: ["book", "pen"]
  },

];

//Create an array using forEach that has all the usernames with a "!" to each of the usernames
const player = []
const newArray = array.forEach(({ username }) => {
  player.push(`${username}!`);
})
console.log(player);

References:

Destructuring

Template strings (${})

CodePudding user response：

Destructure the forEach() input object:

// {username} wrapping curly brackets around an object key 
// pulls that value into the function assigning it to a variable with the same name

const newArray = array.forEach(({username}) => {
  player.push(username   '!');
})

player outputs:

[
  "john!",
  "becky!",
  "susy!",
  "tyson!"
]

forEach() actually returns undefined, so using:

const newArray = array.forEach((username) => {

...newArray is always undefined, therefore pointless. When using forEach() simply:

array.forEach(({ username }) => {
  player.push(`${username}!`);
})

Better yet, if you are creating a new array, use map():

const newArray = array.map(({username}) => {
  return `${username}!`;
})
console.log(newArray);

Also using template literals to interpolate the username variable into the return'ed string.

// Complete the below questions using this array:
const array = [
  {
    username: "john",
    team: "red",
    score: 5,
    items: ["ball", "book", "pen"]
  },
  {
    username: "becky",
    team: "blue",
    score: 10,
    items: ["tape", "backpack", "pen"]
  },
  {
    username: "susy",
    team: "red",
    score: 55,
    items: ["ball", "eraser", "pen"]
  },
  {
    username: "tyson",
    team: "green",
    score: 1,
    items: ["book", "pen"]
  },

];

//Create an array using forEach that has all the usernames with a "!" to each of the usernames
const newArray = array.map(({username}) => {
  return `${username}!`;
})
console.log(newArray);