Create Strings using Template Literals Need Solution

Create Strings using Template Literals Need Solution
0

#1

Tell us what’s happening:
Hey guys, I cannot figure out what is wrong with my code. Thanks in advance!

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 = `[ \`<li class="text-warning">${arr[0]}</li>\`,  
  \`<li class="text-warning">${arr[1]}</li>\`,
  \`<li class="text-warning">${arr[2]}</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 6.3; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36.

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


#2

You’re hard coding it to only work with an array of length 3. What happens if someone passes in an object with many more failures in it? Or fewer? Your code needs to handle that.


#3

You want to return an array with the individual list elements, each of which will be a string. The back-tick character (`) is used instead of quotes when you want to interpolate (substitute into) variables in a string.

Recall that an entire block surrounded by the back-tick characters will result in it being a string only.


#4

As mentioned, you probably don’t want to hard code your function to only work with arrays which have three elements. Try Array.prototype.map :

return arr.map(function(el) {
  return `<li class="text-warning">${el}</li>`;
});

#5

@kvsm Your code has been blurred out to avoid spoiling a full working solution for other campers who may not yet want to see a complete solution. In the future, please give hints and suggestions instead of full working solutions.

Thank you.


#6

So the makeList function should return an array instead of string. Thank you very much!


#7

Ah I see. The problem is solved now. Thanks!


#8

Thanks for your hints. Really appreciate it!