I though .reduce(); made a new array, not a new object?

Question

In a previous video, he taught us that ".reduce();" uses two parameters, with the initial accumulator value defaulting to the first element in the array...

users.reduce((usersObject, user) => {});

...but he adds curly brackets to his code, and I'm not sure what it does.

const newUsersObject = users.reduce((usersObject, user) => {
  usersObject[user.name] = user.age;
}, {});

Does this create a new object? If so, how? I thought it just referenced the array?
And also, I'm not sure what's happening in the callback function. Why is "usersObject" next to "user.name" in brackets?

Dave StSomeWhere · Accepted Answer

Hey Scott, best first place to start is with the MDN reduce documentation (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce).
Please refer to the docs for the available (mandatory and optional parameters) - hopefully that and the description below will answer your question. It also provides a good walkthrough of what happens inside the reduce().
Let's look into why the curly braces at the end and the object/brackets question...
Here's basically the same code with some different names and also including the needed return. Hopefully the comments explain what you are asking. Just let me know if more detail is needed.
Hope this makes sense:
```javascript
const users = [
    {name: 'Samir', age: 22},
    {name: 'Angela', age: 32},
    {name: 'Beatrice', age: 42}
];
/*
    create a new variable called usersObject
    groupOfUsers is the accumulator
    groupOfUsers is initialized as an object (curly braces at end)
    userInstance is the individual entry in the users array that is looped through
    groupOfUsers[userInstance.name] is creating a new object key for each name
    userInstance.age is the value being assigned to the new object key each time
    return groupOfUsers puts each object entry (each time through the loop) into usersObject
*/
const usersObject = users.reduce((groupOfUsers, userInstance) => {
    groupOfUsers[userInstance.name] = userInstance.age;
    return groupOfUsers
}, {}); // the curly braces is the initial value of an empty object
console.log(usersObject); // show what we created in the console
// console output
{ Samir: 22, Angela: 32, Beatrice: 42 }
```

Welcome to the Treehouse Community

Looking to learn something new?

Scott Wells

Scott Wells

I though .reduce(); made a new array, not a new object?

1 Answer

Dave StSomeWhere

Dave StSomeWhere

Chris Adams

Chris Adams