Create Strings using Template Literals1

Hi there! I have reached this topic. I don’t understand how they do iteration. I googled and it says a loop. So, I used a loop for.

What I did on this code is I used Template strings and expression interpolation should be used. and failuresList should be an array containing result failure messages.

I don’t understand:

  1. how to initialize this
  2. what does an argument in the function passing into
  3. I don’t think that const failureItems require all three <li></li>. It will be only one since there will be loop.
  4. what does the return method mean to return a list or an element.
  5. Why do we call arr argument in a template strings.

const result = {
 success: ["max-length", "no-amd", "prefer-arrow-functions"],
 failure: ["no-var", "var-on-top", "linebreak"],
 skipped: ["no-extra-semi", "no-dup-keys"]
};
function makeList(arr) {
 // Only change code below this line
for (arr = 0, arr < result.failure.length, arr++) {

 const failureItems = [
   `<li class="text-warning">${result.failure[0]}</li>`,
 `<li class="text-warning">${result.failure[1]}</li>`,
 `<li class="text-warning">${result.failure[2]}</li>`
 ];
 // Only change code above this line
console.log(failureItems)}
 return failureItems;
}

const failuresList = makeList(result.failure);

Challenge: Create Strings using Template Literals

Link to the challenge:

  1. You are not using the arr parameter.

  2. Your for loop has syntax errors. You are using commas to separate the expressions, it should be semicolons. You are also missing the declaration for the initialization in the loop and I don’t understand why you have named it arr as it is the loop index.

for ([initialization]; [condition]; [final-expression])
   statement
  1. You have hardcoded the elements and indexes inside the loop. Which makes the loop pointless.

  2. You have scoped the variable failureItems to inside the loop but you are accessing it (returning it) outside the loop.


I would suggest you reset and start over. Try using map for this instead.

1 Like

As for your questions.

I don’t understand questions 1 and 2.

  1. Yes, you are supposed to “build” the array using some sort of loop construct. It can be an array method as well.

  2. The return is supposed to be an array of strings.

  3. Not sure what you mean. You loop the arr parameter. arr is the result.failure array being passed to the function parameter arr.

Ok, I did not understand, why I am not using arr parameter and what it is passed to arr.
So now, arr = result.failure from the variable const failuresList, which calls the function.
2. const failureItems will be my empty array, which holds strings made with template literals.
3. Thank you, the loop syntax is incorrect. there should be ; semi-colon. Next, we will loop through parameter arr, thus arr.length, and skip to the next index of the array failure. The initialization is i = 0, we’ll start from the first index.

for (let i = 0; i < arr.length; i++) {
    failureItems.push(`<li class="text-warning">${arr[i]}</li>`);
  }

${arr[i]} - every taken index will be added to the array.

Do I miss anything from this lesson? Is there anything that can help to practice it?
Thank you

2 Likes

You seem to have understood the challenge and have corrected the issues.

As for practice, I would suggest trying this again using map if you have not. It’s a very clean one-line solution.

2 Likes