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 Array Manipulation Transform Array Items with map()

Why my code return undefined

I tried it own my own, pretty much the same as answer but it returned 3 undefined. Following is my code

const fruits = ['apple', 'pear', 'cherry'];

const capitalizedFruits = fruits.map(fruit => { 
  fruit.toUpperCase();
});

The only change I see in Joel code is that he is condensing it to one line. Then why my code won't work?

2 Answers

Michael Hulet
Michael Hulet
47,912 Points

This is a little gotcha of JavaScript arrow functions. When you have one statement on one line without any brackets as the entire body of your function like Joel did, JavaScript understands that you mean to return that one statement. Instead, when you expand it into multiple lines like you did, you need to explicitly use the return keyword to have your arrow function return a value. Otherwise, a function that doesn't return anything returns undefined by default, and since your arrow function doesn't return anything, your capitalizedFruits gets filled with undefineds. To fix this, all you need to do is add a return statement to your arrow function, like this:

const capitalizedFruits = fruits.map(fruit => { 
  return fruit.toUpperCase();
});

Other than this, your code is awesome. Great job!

I WAS STUCK ON THIS PROBLEM DUE TO A STUPID KEYWORD 'return'. OooooFFf