Feeling lost on how to utilize .map, .reduce, or foreach in my code

Question

Feeling lost on how to utilize .map, .reduce, or foreach in my code

Recently delving into JavaScript, I find myself a bit perplexed despite scouring through various answers and resources on Mozilla.org. My struggle lies in seamlessly using .map and .filter on straightforward arrays, but feeling a bit lost when it comes to arrays containing objects.

For instance, I need to calculate the total sum of all ages in a given array.

I understand that .map creates a new array, which is not what I need in this scenario, .filter is used to return elements based on a specific condition, and forEach doesn't return any values.

Although I am restricted from using a for loop, it seems like the most practical solution in this case. (The code snippet below is accurate and functional).

Are there any alternative methods to approach this issue?

const users=[
  {firstName:"john",lastName:"Biden",age:26},
  {firstName:"jimmy",lastName:"cob",age:75},
  {firstName:"sam",lastName:"lewis",age:50},
  {firstName:"Ronald",lastName:"Mathew",age:26},  
];
var total=0
//console.log(users.length)
for(let i=0;i<users.length;i++){
    //console.log(users[i].age)
   total+=users[i].age
}

console.log(total)

javascript arrays object

Answer 1

Answer №1

Utilize the forEach method in place of a traditional for loop

Employ the map function to create an array of ages and then utilize reduce to calculate the sum

Use filter to specifically target individuals who are 50 years old or above

The ({age}) statement utilizes destructuring to extract only the age property from the array of objects, offering an alternative to

total=users.map(item => { return item.age })


            const users=[
            {firstName:"john",lastName:"Biden",age:26},
            {firstName:"jimmy",lastName:"cob",age:75},
            {firstName:"sam",lastName:"lewis",age:50},
            {firstName:"Ronald",lastName:"Mathew",age:26},  
            ];

            // Initializing total is required for forEach

            let total=0
            users.forEach(user => total+=user.age)
            console.log(total)

            // Map combined with reduce (for sum) does not require initialization

            total=users.map(({age}) => age)
            .reduce((a,b) => a+b)
            console.log(total)

            // Filter combined with reduce also does not require initializing the total

            let total50Plus=users.filter(({age}) => age>=50)
            .reduce((a,b) => a.age+b.age)   // No need for initializing an accumulator
            console.log(total50Plus)

            // The standard reduce initializes the accumulator at the end of the function

            total=users.reduce((acc,{age}) => acc+=age,0);  
            console.log(total)

            // Complete version 

            total=users.reduce((accumulator, current) => {
              accumulator += current.age;
              return accumulator;
            },0); // Initialize the accumulator 
            console.log(total)

Answer 2

Utilize the forEach method in place of a traditional for loop

Employ the map function to create an array of ages and then utilize reduce to calculate the sum

Use filter to specifically target individuals who are 50 years old or above

The ({age}) statement utilizes destructuring to extract only the age property from the array of objects, offering an alternative to

total=users.map(item => { return item.age })


            const users=[
            {firstName:"john",lastName:"Biden",age:26},
            {firstName:"jimmy",lastName:"cob",age:75},
            {firstName:"sam",lastName:"lewis",age:50},
            {firstName:"Ronald",lastName:"Mathew",age:26},  
            ];

            // Initializing total is required for forEach

            let total=0
            users.forEach(user => total+=user.age)
            console.log(total)

            // Map combined with reduce (for sum) does not require initialization

            total=users.map(({age}) => age)
            .reduce((a,b) => a+b)
            console.log(total)

            // Filter combined with reduce also does not require initializing the total

            let total50Plus=users.filter(({age}) => age>=50)
            .reduce((a,b) => a.age+b.age)   // No need for initializing an accumulator
            console.log(total50Plus)

            // The standard reduce initializes the accumulator at the end of the function

            total=users.reduce((acc,{age}) => acc+=age,0);  
            console.log(total)

            // Complete version 

            total=users.reduce((accumulator, current) => {
              accumulator += current.age;
              return accumulator;
            },0); // Initialize the accumulator 
            console.log(total)

Answer 3

Answer №2

Utilizing the ForEach method can greatly simplify the manipulation of your array of objects. It is important to grasp the parameters used in the forEach callback:

currentValue (user)

Refers to the current value of the element being processed in the array.

optional index

Represents the index of the current element being processed in the array.

optional array

Denotes the array to which forEach() is being applied.

Below is an example showcasing how to use forEach for achieving your desired outcome.

const users = [
  {firstName:"john",lastName:"Biden",age:26},
  {firstName:"jimmy",lastName:"cob",age:75},
  {firstName:"sam",lastName:"lewis",age:50},
  {firstName:"Ronald",lastName:"Mathew",age:26},  
];

let total = 0;

users.forEach(function(user, index, array) {
    total += user.age;
});

console.log(total);

Answer 4

Utilizing the ForEach method can greatly simplify the manipulation of your array of objects. It is important to grasp the parameters used in the forEach callback:

currentValue (user)

Refers to the current value of the element being processed in the array.

optional index

Represents the index of the current element being processed in the array.

optional array

Denotes the array to which forEach() is being applied.

Below is an example showcasing how to use forEach for achieving your desired outcome.

const users = [
  {firstName:"john",lastName:"Biden",age:26},
  {firstName:"jimmy",lastName:"cob",age:75},
  {firstName:"sam",lastName:"lewis",age:50},
  {firstName:"Ronald",lastName:"Mathew",age:26},  
];

let total = 0;

users.forEach(function(user, index, array) {
    total += user.age;
});

console.log(total);

Feeling lost on how to utilize .map, .reduce, or foreach in my code

Answer №1

Answer №2

Similar questions

Execute the command "prisma migrate dev" to update the existing database

jQuery: add to either element

Is there a way to transfer the data from a chosen row into a different table?

"Browser compatibility issues: 404 error on post request in Firefox, while request is

I'm having trouble locating the module "script!foundation-sites/dist/foundation.min.js on Heroic."

Creating dynamic elements in JavaScript and assigning them unique IDs

JQuery failing to trigger AJAX function

Are there any JavaScript libraries available that can mimic SQLite using localStorage?

What is the best way to incorporate multiple HTML buttons that utilize the same JavaScript function within looped results?

ng-repeat isn't displaying the data

"Encountering a Dojo error where the store is either null or not recognized

Scripts fail to load randomly due to RequireJs

Why is it that every time I press the play button, nothing happens?

The jQuery code functions properly only if it is inserted directly into the console

Attach an event listener to the HTML content

Deployment to Amazon Amplify encounters failure when using Next JS

Trouble with Component Lifecycle (ComponentDidMount) activation while switching tabs in TabBar?

Is it possible to receive live updates from a MySQL database on a webpage using node.js and socket.io?

What is the best way to create a page that moves on release using HTML/CSS?

Transforming a JSON into a JavaScript object using deserialization