Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript JavaScript Array Iteration Methods Combining Array Methods Combining filter() and map()

Rick S
Rick S
11,252 Points
Posted by Rick S
Rick S
11,252 Points

.map(name => ({ name: name}) ); In the arrow function body, how does it know which 'name' is the provided argument

What would code would be used to yield the Result : [{Samir: 'Samir'}, {Shaniqua: 'Shaniqua'}, {Sean:'Sean'}]; ?

Because I'm wondering how the code knows you are not trying to name the property the same as the argument.

5 Answers

Juan Luna Ramirez
Juan Luna Ramirez
9,038 Points
Juan Luna Ramirez
Juan Luna Ramirez
9,038 Points

To get the results you want you can use computed property names https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer#computed_property_names

So your map function would be name => ({ [name]: name }) to get the desired result.

Otherwise, the function from your original question is like doing name => ({ 'name': name }). The proof is that you can use another property key, like person, and it will still work because the program will not be looking for a variable called person; its just going to assign name to the person property of the object you are returning.

Peter Vann
Peter Vann
36,425 Points
Peter Vann
Peter Vann
36,425 Points

Hi Rick!

I'm not sure exactly what he was trying to do in the video, but this is what made sense to me:

const userNames = ['Samir', 'Angela', 'Beatrice', 'Shaniqua', 'Marvin', 'Sean'];

const users = userNames
    .filter(name => name[0] === 'S')
    .map(name => {
        return "name: " + name;
    });

console.log(users);

Which will log:

> (3) ["name: Samir", "name: Shaniqua", "name: Sean"]

I hope that helps.

Stay safe and happy coding!

Rick S
Rick S
11,252 Points
Rick S
Rick S
11,252 Points

Thanks, Peter

What I am seeking is the code that yields a different result than in the video-- code that yields a result of [{Samir: 'Samir'}, {Shaniqua: 'Shaniqua'}, {Sean:'Sean'}];

Because if I know the answer to this question, it may help me to understand more about the code he used in the video as well.

Peter Vann
Peter Vann
36,425 Points
Peter Vann
Peter Vann
36,425 Points

This is as close as I could get:

const userNames = ['Samir', 'Angela', 'Beatrice', 'Shaniqua', 'Marvin', 'Sean'];

const users = userNames
    .filter(name => name[0] === 'S')
    .map(name => {
         let jsonObj = JSON.parse('{"' + name + '": "' + name + '"}');
         return jsonObj;
    });

console.log(users);

JSON.parse turns the string into an actual JSON object.

I hope that helps.

Stay safe and happy coding!

Rick S
Rick S
11,252 Points
Rick S
Rick S
11,252 Points

Thanks guys for the responses.

I was thinking it might have something to do with square brackets. I've been so bogged down in another treehouse track that I haven't had to time to check into it.

This is a big help to me.