Create Strings using Template Literals : map

JavaScript
1

Why we use this arr.map(element => <li class="text-warning">${element}</li>);
instead of this arr.failure.map(element => <li class="text-warning">${element}</li>);
How the computer gonna know that we wanna display the elements of failure not other elements in ${element}

Your code so far

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";

  // change code below this line
  const resultDisplayArray = arr.failure.map(element => `<li class="text-warning">${element}</li>`);
  // change code above this line

  return resultDisplayArray;
}

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36.

Link to the challenge:

2

Because when you are calling the function, you are already passing in the variable result.failure. That is what is referred to as arr inside the function - they point to the same data. If you had called the function with only result, then you would have had to call it arr.failure inside the funtion. But the first way is more flexible - all the function knows is that is getting an array. It doesn’t care what it is, it just knows what to do with it,

1 Like