An iterator should be used <<< this requeirement

JavaScript
#1

https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/es6/create-strings-using-template-literals << this class

Tell us what’s happening:
An iterator should be used <<< this requeirement.
i didnt learn about this:

const resultDisplayArray = arr.map(item => <li class="text-warning">${item}</li>); // i dont seany iterator how its work?

i class i m not sure if i undertaded is confused.
thi did this core and works too but i dont think its ok.

for(let i = 0; i > result.failure.length; i++) {
return console.log(i);
}
const resultDisplayArray = [ <li class="text-warning">${result.failure[0]}</li>,
<li class="text-warning">${result.failure[1]}</li>,
<li class="text-warning">${result.failure[2]}</li> ]
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.map(item => `<li class="text-warning">${item}</li>`);

 // change code above this line

 return resultDisplayArray;
}
/**
* makeList(result.failure) should return:
* [ `<li class="text-warning">no-var</li>`,
*   `<li class="text-warning">var-on-top</li>`,
*   `<li class="text-warning">linebreak</li>` ]
**/
const resultDisplayArray = makeList(result.failure);

Your browser information:

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

Challenge: Create Strings using Template Literals

Link to the challenge:
https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/es6/create-strings-using-template-literals

#2

Your .map() works for me -

const resultDisplayArray = arr.map(e => `<li class="text-warning">${e}</li>`);

Maybe reset your challenge to clear out the code and try again.

#4

I think I misread your post… is this your current code?

for(let i = 0; i > result.failure.length; i++) {
    return console.log(i);
}
  const resultDisplayArray = [ `<li class="text-warning">${result.failure[0]}</li>`,
    `<li class="text-warning">${result.failure[1]}</li>`,
    `<li class="text-warning">${result.failure[2]}</li>` ]

"An iterator should be used" <<< this …

Yes, you did use an iterator above, the ‘for’ loop. Basically, an ‘iterator’ is a command to do something over and over. If you have 1,000 failures in the code above you would have to write that out 1000 times.

Instead, you can use an iterator like the for loop or map like @Manish-Giri posted above that will do all the work for you.

The code above technically passes all the tests, but isn’t really a good solution since you had to type out all of the result.failures

 // change code below this line
let resultDisplayArray =[] //Create an empty array to store each result.failure
for(let i = 0; i < result.failure.length; i++) { // i *<*
  resultDisplayArray.push(`<li class="text-warning">${result.failure[i]}</li>`) //PUSH the item (1) to the array.
//repeat 1000 times if needed 
}
 // change code above this line
#5

I think your other questions have been addressed, but re: how does Array.prototype.map work:

map calls a provided callback function once for each element in an array, in order, and constructs a new array from the results.

In other words it iterates over the array methods and applies a function to each element.

In your example, the callback could be extracted as

// define callback
const makeListElString = (item) => `<li class="text-warning">${item}</li>`;
// map with callback defined above
const resultDisplayArray = arr.map(makeListElString);
#6

map, filter, and reduce methods are not introduced until the Functional Programming section, so a user at this point in the curriculum may not know how to use map.

#7