Create Strings using Template Literals: is it JUST a bug?

Create Strings using Template Literals: is it JUST a bug?
0

#1

I don’t mean to add any fuel to the already hotly discussed challenge but I am seeing a couple things that make me think we, the students, are getting this question wrong.

/**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);

This is our the desired output. When you glance at it, it seems like you should be producing an array called resultDisplayArray, that is populated with template literal strings from makeList(result.failure). Upon closer examination, that’s not all these lines of code are saying.

When you really look at, it seems like the desired string being created from the makeList function should include:

  1. backtick-quoted template literal strings,
  2. template literal strings are separated by a line break ,
  3. have a comma separating each template literal string (before the line break and after the backtick) and,
  4. the entire output should be flanked by array ([]) brackets as part of the output.

I am aware of the bug associated with this particular challenge but can’t shake the fact that almost every thread I have looked at doesn’t include the syntax to address these criteria.

Here is my code for the makeList function:

function makeList(arr) {
  "use strict";

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

  return resultDisplayArray;
}

I really really want to be wrong about all of this and say it is because of a bug.

BUT, I also can’t rule out the possibility of the painfully obvious learning curve.

PLEASE HELP!!

Thanks!


#2

A template literal would start with a ` and end with a `. Also, why are you using \n in your solution?

The challenge example shows you the correct syntax of a template literal (see below).

const greeting = `Hello, my name is ${person.name}! I am ${person.age} years old.`;

Try again and see if you can write the correct syntax and pass this challenge.


#3

To satisfy the second condition, I needed to include a line break.
When I ran the code without the \n, all of the strings stayed in line. Placing the \n before the text, was my decision to ensure each variable of arr would be separated by a new line.

Based on what I learned from a previous challenge, small details, like the ones cited, seem to be part of the learning process.

But will give it another go!


#4

The map method creates an array. There are no lines in arrays. They only displayed elements on separate lines in the comments to make it more readable.

If you were using a template literal for a large string and not an array and you wanted to include line breaks, you could write the following:

var bigString = `Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 

Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. 

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.`;

In the above string, I create line breaks without having to write \n. That is just one of the reasons why template literals are useful.


#5

I am aware of the bug associated with this particular challenge but can’t shake the fact that almost every thread I have looked at doesn’t include the syntax to address these criteria.

So, I had run into this bug around the beginning of July when I was extremely new and skipped the problem. I had posted in a thread about the bug hoping to be notified when the bug was resolved.

When I saw your post just now, I went back and found the challenge (still incomplete) and easily completed it. I went back and checked the post I had posted in and confirmed that the solution that wasn’t working then is identical to the solution that just worked for me now. So there was a bug, but it has been fixed, and I can confirm there is at least one solution that works (using the map function to produce an array of strings using template literals just like what the tests ask for). I’m not sure if map is required, in fact it shouldn’t be, but I can confirm for sure that as of now there is no bug if you use map to generate the array and produce what is asked for.

Edit to add: The sample output is not asking for the criteria you mention. Recall that an array is of the format [item1, item2, item3, ...], or in plain English, “an arbitrary number of items separated by commas and the whole list contained within square brackets”. To be perfectly clear: This challenge is asking for an array of strings, and you want each element of the array to match the format '<li class="text-warning">(some item inserted with interpolation)</li>'. It’s not asking for a string, and the strings within the array do not include any kind of square brackets or line breaks.