Create Strings using Template Literals, help

JavaScript
1

Tell us what’s happening:
I’m being shown that my array contains the result failure messages, they have the desired output and the console displays that “Template strings were used” and yet, the “Template strings were used” test shows as failed. I’m confused.

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">${result.failure[0]}</li>`,
  `<li class="text-warning">${result.failure[1]}</li>`,
  `<li class="text-warning">${result.failure[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 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/11.1.2 Safari/605.1.15.

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

2

Let me tell you right off the bat that this challenge does have a bug in the test.

I don’t know if you’re correct or not, but just saying.

4

I’m not familiar with the map method, but a for loop yielded no results… :slightly_frowning_face:
Running it on VSCode, the code seems to be working just fine.

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 = [];

  for(let x = 0; x < result.failure.length; x++){
    resultDisplayArray.push(`<li class="text-warning">${result.failure[x]}</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);
5

Hi,

The map method is quite simple.

Array.map( elem => console.log(elem));

It is looping through the Array and logs to console every each element that is in the Array.

1 Like
6

So in your case the Array will be the failure array of the result object

I need to update because I did not read through the exercise.

@camperextraordinaire is right as you need to use the arr argument because the result.failure is passed into the function when it is called.

1 Like
7

Like I said before in my original reply, do not reference result.failure directly inside the makeList function. Instead use arr argument which IS result.failure.

1 Like
8

Thanks a lot, that solved it. I should learn to read properly :man_facepalming:.