Skip to content
This repository has been archived by the owner on Sep 25, 2019. It is now read-only.

Commit

Permalink
fix(challenges): improve template literal challenge instructions
Browse files Browse the repository at this point in the history
  • Loading branch information
johnkennedy9147 authored and scissorsneedfoodtoo committed Jul 19, 2018
1 parent 59d98b8 commit 99f4b9f
Showing 1 changed file with 10 additions and 8 deletions.
18 changes: 10 additions & 8 deletions challenges/02-javascript-algorithms-and-data-structures/es6.json
Original file line number Diff line number Diff line change
Expand Up @@ -990,20 +990,22 @@
"id": "587d7b8a367417b2b2512b4e",
"title": "Create Strings using Template Literals",
"description": [
"A new feature of ES6 is the <dfn>template literal</dfn>. This is a special type of string that allows you to use string interpolation features to create strings.",
"A new feature of ES6 is the <dfn>template literal</dfn>. This is a special type of string that makes creating complex strings easier.",
"Template literals allow you to create multi-line strings and to use string interpolation features to create strings.",
"Consider the code below:",
"<blockquote>const person = {<br>&nbsp;&nbsp;name: \"Zodiac Hasbro\",<br>&nbsp;&nbsp;age: 56<br>};<br><br>// string interpolation<br>const greeting = `Hello, my name is ${person.name}!<br>I am ${person.age} years old.`;<br><br>console.log(greeting); // prints<br>// Hello, my name is Zodiac Hasbro!<br>// I am 56 years old.<br></blockquote>",
"<blockquote>const person = {<br>&nbsp;&nbsp;name: \"Zodiac Hasbro\",<br>&nbsp;&nbsp;age: 56<br>};<br><br>// Template literal with multi-line and string interpolation<br>const greeting = `Hello, my name is ${person.name}!<br>I am ${person.age} years old.`;<br><br>console.log(greeting); // prints<br>// Hello, my name is Zodiac Hasbro!<br>// I am 56 years old.<br></blockquote>",
"A lot of things happened there.",
"Firstly, the <code>${variable}</code> syntax used above is a place holder. Basically, you won't have to use concatenation with the <code>+</code> operator anymore. To add variables to strings, you just drop the variable in a template string and wrap it with <code>${</code> and <code>}</code>.",
"Secondly, the example uses backticks (<code>`</code>), not quotes (<code>'</code> or <code>\"</code>), to wrap the string. Notice that the string is multi-line.",
"Firstly, the example uses backticks (<code>`</code>), not quotes (<code>'</code> or <code>\"</code>), to wrap the string.",
"Secondly, notice that the string is multi-line, both in the code and the output. This saves inserting \n within strings.",
"The <code>${variable}</code> syntax used above is a placeholder. Basically, you won't have to use concatenation with the <code>+</code> operator anymore. To add variables to strings, you just drop the variable in a template string and wrap it with <code>${</code> and <code>}</code>. Similarly, you can include other expressions in your string literal, for example <code>${a + b}</code>.",
"This new way of creating strings gives you more flexibility to create robust strings.",
"<hr>",
"Use template literal syntax with backticks to display each entry of the <code>result</code> object's <code>failure</code> array. Each entry should be wrapped inside an <code>li</code> element with the class attribute <code>text-warning</code>, and listed within the <code>resultDisplayArray</code>."
],
"tests": [
{
"text":
"<code>resultDisplayArray</code> is a list containing <code>result failure</code> messages.",
"<code>resultDisplayArray</code> is an array containing <code>result failure</code> messages.",
"testString":
"assert(typeof makeList(result.failure) === 'object' && resultDisplayArray.length === 3, '<code>resultDisplayArray</code> is a list containing <code>result failure</code> messages.');"
},
Expand Down Expand Up @@ -1043,9 +1045,9 @@
"}",
"/**",
" * 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> ]",
" * [ `<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);"
],
Expand Down

0 comments on commit 99f4b9f

Please sign in to comment.