Create Strings using Template Literals_2

Create Strings using Template Literals_2
0

#1

Tell us what’s happening:
I don’t know what this challenge wants. I followed the example, but the error states I’m not using template strings. I don’t know what else I could add to get the object values.

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

ERROR

// running tests
Template strings were used
// tests completed

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36.

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


#2

Why are you referencing the global object result, when an argument was passed to the function which you could be using instead? Try using what is passed into the function.


#3

Thanks again. I used arr[0], arr[1], etc. I neglected to consider the function parameter and what was actually being passed.


#4

FYI - Your solution does not scale at all. For example, what if the result.failure array had 10000 strings. Would you really write arr[0], arr[1], … arr[9999]. Think about how you could use a loop or better yet an array method such as map to create resultDisplayArray.


#5

I’m still confused about this. Since the map function works on each element in succession I thought this would work since I’m working on an array of strings. I’m not sure about the ${e}, but I couldn’t think of anything else although I did try arr{i] since the map function has the index as a parameter, but that didn’t work. In all cases I created an array of undefined values. I tried using the following code:

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

I received the following error, but the other two requirements were met.

// running tests
resultDisplayArray is the desired output.
// tests completed

OUTPUT

[ undefined, undefined, undefined ]

The requirements that were met were:

  1. resultDisplayArray is an array containing result failure messages.
  2. Template strings were used

#6

Your function does not have a return statement, so JavaScript returns the value undefined during each iteration.


#7

I put a return statement in and it worked, but I didn’t think the map function needed a return statement. I thought whatever was put inside the braces was automatically returned. Obviously I was wrong. Thanks.


#8

The callback function is just like any other function. You may be confusing using arrow function syntax with normal function syntax.

Normal Function Syntax

function timesTen(num) {
  return num * 10;
}

OR

const timesTen = function(num) {
  return num * 10;
}

Arrow Function Syntax

const timesTen = num => num * 10;

#9

Thanks, thanks, thanks.