Why does map() work without curly brackets {} but gives me a blank output with them?

JavaScript
#1

So, here’s the code in question:

const result = {

success: ["max-length", "no-amd", "prefer-arrow-functions"],

failure: ["no-var", "var-on-top", "linebreak"],

skipped: ["id-blacklist", "no-dup-keys"]

};

function makeList(arr) {

"use strict";

const resultDisplayArray = arr.map( (list) =>

`<li class="text-warning">${list}</li>`

);

return resultDisplayArray;

}

const resultDisplayArray = makeList(result.failure);

console.log(resultDisplayArray);

console gives me the desired output.

If I add curly brackets to the fat arrow function, which I’ve seen in numerous examples and in the previous lessons, it gives me a blank, comma-separated list:

const resultDisplayArray = arr.map( (list) => {

`<li class="text-warning">${list}</li>`

}

);

console gives me:

, ,

Can anyone explain to me why this is happening? Thank you.

Jordan

#2

@Jord4nz Can you please post your code using 3 backticks on the line before and line after the code? It will make it more readable and not take up so much of the thread.

See this post to find the backtick on your keyboard. The “preformatted text” tool in the editor (</>) will also add backticks around text.

Note: Backticks are not single quotes.

markdown_Forums

Thank you.

#3

Done; thank you for your help.

#4

Take a look at the following challenge, to see if your question is answered.

https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/es6/use-arrow-functions-to-write-concise-anonymous-functions/

Basically, when you add the { }, you need to explicitly return something. In the first syntax, the return is implicit.

1 Like
#5