freeCodeCamp Challenge Guide: Create Strings using Template Literals

Guide
1

Create Strings Using Template Literals

Problem Explanation

Instead of using string concatenation, ES6 offers template literals to create strings. In this challenge, you have to use template literals to create an array of text warnings.

It’s required to use template literals to return a list as every element in the array as the element will be wrapped in a <li></li> tag.

Hints

Hint 1

  • Iterate through each element of arr and add a new element consisting of a template literal using arr’s elements to create the array failureItems.

Solutions

Solution 1 (Click to Show/Hide) 
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) {
  "use strict";
  // change code below this line
  const failureItems = [];
  for (let i = 0; i < arr.length; i++) {
    failureItems.push(`<li class="text-warning">${arr[i]}</li>`);
  }
  // change code above this line
  return failureItems;
}

const failuresList = makeList(result.failure);
Solution 2 (Click to Show/Hide) 
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) {
  "use strict";
  // change code below this line
  const failureItems = arr.map(item => `<li class="text-warning">${item}</li>`);
  // change code above this line
  return failureItems;
}
const failuresList = makeList(result.failure);
160 Likes