[Fix] Removed unnecessary IIFEs from ES6 challenges (#34538)
* feat: removed IIFE and added solution * feat: updated challenges seed, test and solution * style: removed semicolon * feat: updated seed and solution * feat: updated challenges seed and solution * feat: updated test, seed and solution * fix: added seed code to solution * fix: removed function and added solution * fix: removed makeClass function and fixed solution * style: removed excessive semicolons * Fixed spacing for note in instructions section * fix: removed assert messages and used const * fix: regex fails correctly now
This commit is contained in:
		| @@ -23,11 +23,11 @@ Modify the function <code>increment</code> by adding default parameters so that | ||||
| ```yml | ||||
| tests: | ||||
|   - text: The result of <code>increment(5, 2)</code> should be <code>7</code>. | ||||
|     testString: assert(increment(5, 2) === 7, 'The result of <code>increment(5, 2)</code> should be <code>7</code>.'); | ||||
|     testString: assert(increment(5, 2) === 7); | ||||
|   - text: The result of <code>increment(5)</code> should be <code>6</code>. | ||||
|     testString: assert(increment(5) === 6, 'The result of <code>increment(5)</code> should be <code>6</code>.'); | ||||
|   - text: default parameter <code>1</code> was used for <code>value</code>. | ||||
|     testString: getUserInput => assert(getUserInput('index').match(/value\s*=\s*1/g), 'default parameter <code>1</code> was used for <code>value</code>.'); | ||||
|     testString: assert(increment(5) === 6); | ||||
|   - text: Default parameter <code>1</code> was used for <code>value</code>. | ||||
|     testString: assert(code.match(/value\s*=\s*1/g)); | ||||
|  | ||||
| ``` | ||||
|  | ||||
| @@ -39,12 +39,8 @@ tests: | ||||
| <div id='js-seed'> | ||||
|  | ||||
| ```js | ||||
| const increment = (function() { | ||||
|   "use strict"; | ||||
|   return function increment(number, value) { | ||||
|     return number + value; | ||||
|   }; | ||||
| })(); | ||||
| const increment = (number, value) => number + value; | ||||
|  | ||||
| console.log(increment(5, 2)); // returns 7 | ||||
| console.log(increment(5)); // returns 6 | ||||
| ``` | ||||
| @@ -59,6 +55,6 @@ console.log(increment(5)); // returns 6 | ||||
| <section id='solution'> | ||||
|  | ||||
| ```js | ||||
| // solution required | ||||
| const increment = (number, value = 1) => number + value; | ||||
| ``` | ||||
| </section> | ||||
|   | ||||
| @@ -29,13 +29,13 @@ The <code>Vegetable</code> lets you create a vegetable object, with a property < | ||||
| ```yml | ||||
| tests: | ||||
|   - text: <code>Vegetable</code> should be a <code>class</code> with a defined <code>constructor</code> method. | ||||
|     testString: assert(typeof Vegetable === 'function' && typeof Vegetable.constructor === 'function', '<code>Vegetable</code> should be a <code>class</code> with a defined <code>constructor</code> method.'); | ||||
|   - text: <code>class</code> keyword was used. | ||||
|     testString: getUserInput => assert(getUserInput('index').match(/class/g),'<code>class</code> keyword was used.'); | ||||
|   - text: <code>Vegetable</code> can be instantiated. | ||||
|     testString: assert(() => {const a = new Vegetable("apple"); return typeof a === 'object';},'<code>Vegetable</code> can be instantiated.'); | ||||
|     testString: assert(typeof Vegetable === 'function' && typeof Vegetable.constructor === 'function'); | ||||
|   - text: <code>class</code> keyword should be used. | ||||
|     testString: assert(code.match(/class/g)); | ||||
|   - text: <code>Vegetable</code> should be able to be instantiated. | ||||
|     testString: assert(() => {const a = new Vegetable("apple"); return typeof a === 'object';}); | ||||
|   - text: <code>carrot.name</code> should return <code>carrot</code>. | ||||
|     testString: assert(carrot.name=='carrot','<code>carrot.name</code> should return <code>carrot</code>.'); | ||||
|     testString: assert(carrot.name=='carrot'); | ||||
|  | ||||
| ``` | ||||
|  | ||||
| @@ -47,14 +47,10 @@ tests: | ||||
| <div id='js-seed'> | ||||
|  | ||||
| ```js | ||||
| function makeClass() { | ||||
|   "use strict"; | ||||
|   /* Alter code below this line */ | ||||
| /* Alter code below this line */ | ||||
|  | ||||
| /* Alter code above this line */ | ||||
|  | ||||
|   /* Alter code above this line */ | ||||
|   return Vegetable; | ||||
| } | ||||
| const Vegetable = makeClass(); | ||||
| const carrot = new Vegetable('carrot'); | ||||
| console.log(carrot.name); // => should be 'carrot' | ||||
| ``` | ||||
| @@ -69,19 +65,11 @@ console.log(carrot.name); // => should be 'carrot' | ||||
| <section id='solution'> | ||||
|  | ||||
| ```js | ||||
| function makeClass() { | ||||
|   "use strict"; | ||||
|   /* Alter code below this line */ | ||||
|   class Vegetable { | ||||
|     constructor(name){ | ||||
|       this.name = name; | ||||
|     } | ||||
| class Vegetable { | ||||
|   constructor(name) { | ||||
|     this.name = name; | ||||
|   } | ||||
|   /* Alter code above this line */ | ||||
|   return Vegetable; | ||||
| } | ||||
| const Vegetable = makeClass(); | ||||
| const carrot = new Vegetable('carrot'); | ||||
| console.log(carrot.name); // => should be 'carrot' | ||||
| ``` | ||||
| </section> | ||||
|   | ||||
| @@ -26,11 +26,11 @@ Use destructuring assignment to swap the values of <code>a</code> and <code>b</c | ||||
| ```yml | ||||
| tests: | ||||
|   - text: Value of <code>a</code> should be 6, after swapping. | ||||
|     testString: assert(a === 6, 'Value of <code>a</code> should be 6, after swapping.'); | ||||
|     testString: assert(a === 6); | ||||
|   - text: Value of <code>b</code> should be 8, after swapping. | ||||
|     testString: assert(b === 8, 'Value of <code>b</code> should be 8, after swapping.'); | ||||
|   - text: Use array destructuring to swap a and b. | ||||
|     testString: 'assert(/\[\s*(\w)\s*,\s*(\w)\s*\]\s*=\s*\[\s*\2\s*,\s*\1\s*\]/g.test(code), "Use array destructuring to swap a and b.");' | ||||
|     testString: assert(b === 8); | ||||
|   - text: Should use array destructuring to swap a and b. | ||||
|     testString: assert(/\[\s*(\w)\s*,\s*(\w)\s*\]\s*=\s*\[\s*\2\s*,\s*\1\s*\]/g.test(code)); | ||||
|  | ||||
| ``` | ||||
|  | ||||
| @@ -43,12 +43,9 @@ tests: | ||||
|  | ||||
| ```js | ||||
| let a = 8, b = 6; | ||||
| (() => { | ||||
|   "use strict"; | ||||
|   // change code below this line | ||||
| // change code below this line | ||||
|  | ||||
|   // change code above this line | ||||
| })(); | ||||
| // change code above this line | ||||
| console.log(a); // should be 6 | ||||
| console.log(b); // should be 8 | ||||
| ``` | ||||
| @@ -64,13 +61,6 @@ console.log(b); // should be 8 | ||||
|  | ||||
| ```js | ||||
| let a = 8, b = 6; | ||||
| (() => { | ||||
|   "use strict"; | ||||
|   // change code below this line | ||||
|   [a, b] = [b, a]; | ||||
|   // change code above this line | ||||
| })(); | ||||
| console.log(a); // should be 6 | ||||
| console.log(b); // should be 8 | ||||
| [a, b] = [b, a]; | ||||
| ``` | ||||
| </section> | ||||
|   | ||||
| @@ -26,11 +26,13 @@ Use destructuring assignment within the argument to the function <code>half</cod | ||||
| ```yml | ||||
| tests: | ||||
|   - text: <code>stats</code> should be an <code>object</code>. | ||||
|     testString: assert(typeof stats === 'object', '<code>stats</code> should be an <code>object</code>.'); | ||||
|     testString: assert(typeof stats === 'object'); | ||||
|   - text: <code>half(stats)</code> should be <code>28.015</code> | ||||
|     testString: assert(half(stats) === 28.015, '<code>half(stats)</code> should be <code>28.015</code>'); | ||||
|   - text: Destructuring was used. | ||||
|     testString: getUserInput => assert(getUserInput('index').match(/\(\s*\{\s*\w+\s*,\s*\w+\s*\}\s*\)/g), 'Destructuring was used.'); | ||||
|     testString: assert(half(stats) === 28.015); | ||||
|   - text: Destructuring should be used. | ||||
|     testString: assert(code.replace(/\s/g, '').match(/half=\({\w+,\w+}\)/)); | ||||
|   - text: Destructured parameter should be used. | ||||
|     testString: assert(!code.match(/stats\.max|stats\.min/)); | ||||
|  | ||||
| ``` | ||||
|  | ||||
| @@ -50,17 +52,11 @@ const stats = { | ||||
|   min: -0.75, | ||||
|   average: 35.85 | ||||
| }; | ||||
| const half = (function() { | ||||
|   "use strict"; // do not change this line | ||||
|  | ||||
|   // change code below this line | ||||
|   return function half(stats) { | ||||
|     // use function argument destructuring | ||||
|     return (stats.max + stats.min) / 2.0; | ||||
|   }; | ||||
|   // change code above this line | ||||
| // change code below this line | ||||
| const half = (stats) => (stats.max + stats.min) / 2.0; // use function argument destructuring | ||||
| // change code above this line | ||||
|  | ||||
| })(); | ||||
| console.log(stats); // should be object | ||||
| console.log(half(stats)); // should be 28.015 | ||||
| ``` | ||||
| @@ -75,6 +71,15 @@ console.log(half(stats)); // should be 28.015 | ||||
| <section id='solution'> | ||||
|  | ||||
| ```js | ||||
| // solution required | ||||
| const stats = { | ||||
|   max: 56.78, | ||||
|   standard_deviation: 4.34, | ||||
|   median: 34.54, | ||||
|   mode: 23.87, | ||||
|   min: -0.75, | ||||
|   average: 35.85 | ||||
| }; | ||||
|  | ||||
| const half = ( {max, min} ) => (max + min) / 2.0; | ||||
| ``` | ||||
| </section> | ||||
|   | ||||
| @@ -13,8 +13,7 @@ Setter functions are meant to modify (set) the value of an object's private vari | ||||
| <blockquote>class Book {<br>  constructor(author) {<br>    this._author = author;<br>  }<br>  // getter<br>  get writer(){<br>    return this._author;<br>  }<br>  // setter<br>  set writer(updatedAuthor){<br>    this._author = updatedAuthor;<br>  }<br>}<br>const lol = new Book('anonymous');<br>console.log(lol.writer);  // anonymous<br>lol.writer = 'wut';<br>console.log(lol.writer);  // wut</blockquote> | ||||
| Notice the syntax we are using to invoke the getter and setter - as if they are not even functions. | ||||
| Getters and setters are important, because they hide internal implementation details. | ||||
| <br><br> | ||||
| <strong>Note:</strong><br>It is a convention to precede the name of a private variable with an underscore (<code>_</code>). The practice itself does not make a variable private. | ||||
| <strong>Note:</strong> It is a convention to precede the name of a private variable with an underscore (<code>_</code>). The practice itself does not make a variable private. | ||||
| </section> | ||||
|  | ||||
| ## Instructions | ||||
| @@ -22,8 +21,7 @@ Getters and setters are important, because they hide internal implementation det | ||||
| Use <code>class</code> keyword to create a Thermostat class. The constructor accepts Fahrenheit temperature. | ||||
| Now create <code>getter</code> and <code>setter</code> in the class, to obtain the temperature in Celsius scale. | ||||
| Remember that <code>C = 5/9 * (F - 32)</code> and <code>F = C * 9.0 / 5 + 32</code>, where F is the value of temperature in Fahrenheit scale, and C is the value of the same temperature in Celsius scale | ||||
| Note | ||||
| When you implement this, you would be tracking the temperature inside the class in one scale - either Fahrenheit or Celsius. | ||||
| <strong>Note:</strong><br>When you implement this, you would be tracking the temperature inside the class in one scale - either Fahrenheit or Celsius. | ||||
| This is the power of getter or setter - you are creating an API for another user, who would get the correct result, no matter which one you track. | ||||
| In other words, you are abstracting implementation details from the consumer. | ||||
| </section> | ||||
| @@ -34,11 +32,11 @@ In other words, you are abstracting implementation details from the consumer. | ||||
| ```yml | ||||
| tests: | ||||
|   - text: <code>Thermostat</code> should be a <code>class</code> with a defined <code>constructor</code> method. | ||||
|     testString: assert(typeof Thermostat === 'function' && typeof Thermostat.constructor === 'function','<code>Thermostat</code> should be a <code>class</code> with a defined <code>constructor</code> method.'); | ||||
|   - text: <code>class</code> keyword was used. | ||||
|     testString: getUserInput => assert(getUserInput('index').match(/class/g),'<code>class</code> keyword was used.'); | ||||
|   - text: <code>Thermostat</code> can be instantiated. | ||||
|     testString: assert((() => {const t = new Thermostat(32);return typeof t === 'object' && t.temperature === 0;})(), '<code>Thermostat</code> can be instantiated.'); | ||||
|     testString: assert(typeof Thermostat === 'function' && typeof Thermostat.constructor === 'function'); | ||||
|   - text: <code>class</code> keyword should be used. | ||||
|     testString: assert(code.match(/class/g)); | ||||
|   - text: <code>Thermostat</code> should be able to be instantiated. | ||||
|     testString: assert((() => {const t = new Thermostat(32);return typeof t === 'object' && t.temperature === 0;})()); | ||||
|  | ||||
| ``` | ||||
|  | ||||
| @@ -50,14 +48,10 @@ tests: | ||||
| <div id='js-seed'> | ||||
|  | ||||
| ```js | ||||
| function makeClass() { | ||||
|   "use strict"; | ||||
|   /* Alter code below this line */ | ||||
| /* Alter code below this line */ | ||||
|  | ||||
| /* Alter code above this line */ | ||||
|  | ||||
|   /* Alter code above this line */ | ||||
|   return Thermostat; | ||||
| } | ||||
| const Thermostat = makeClass(); | ||||
| const thermos = new Thermostat(76); // setting in Fahrenheit scale | ||||
| let temp = thermos.temperature; // 24.44 in C | ||||
| thermos.temperature = 26; | ||||
| @@ -74,24 +68,21 @@ temp = thermos.temperature; // 26 in C | ||||
| <section id='solution'> | ||||
|  | ||||
| ```js | ||||
| function makeClass() { | ||||
|   'use strict'; | ||||
|   /* Alter code below this line */ | ||||
|   class Thermostat { | ||||
|     constructor(temperature) { | ||||
|      this._temperature = (5 / 9) * (temperature - 32); | ||||
|     } | ||||
|     get temperature() { | ||||
|      return this._temperature; | ||||
|     } | ||||
|     set temperature(temperature) { | ||||
|      this._temperature = temperature; | ||||
|     } | ||||
|  | ||||
| /* Alter code below this line */ | ||||
| class Thermostat { | ||||
|   constructor(fahrenheit) { | ||||
|     this._tempInCelsius = 5/9 * (fahrenheit - 32); | ||||
|   } | ||||
|   get temperature(){ | ||||
|     return this._tempInCelsius; | ||||
|   } | ||||
|   set temperature(newTemp){ | ||||
|     this._tempInCelsius = newTemp; | ||||
|   } | ||||
|   /* Alter code above this line */ | ||||
|   return Thermostat; | ||||
| } | ||||
| const Thermostat = makeClass(); | ||||
| /* Alter code above this line */ | ||||
|  | ||||
| const thermos = new Thermostat(76); // setting in Fahrenheit scale | ||||
| let temp = thermos.temperature; // 24.44 in C | ||||
| thermos.temperature = 26; | ||||
|   | ||||
| @@ -23,15 +23,15 @@ Modify the function <code>sum</code> using the rest parameter in such a way that | ||||
| ```yml | ||||
| tests: | ||||
|   - text: The result of <code>sum(0,1,2)</code> should be 3 | ||||
|     testString: assert(sum(0,1,2) === 3, 'The result of <code>sum(0,1,2)</code> should be 3'); | ||||
|     testString: assert(sum(0,1,2) === 3); | ||||
|   - text: The result of <code>sum(1,2,3,4)</code> should be 10 | ||||
|     testString: assert(sum(1,2,3,4) === 10, 'The result of <code>sum(1,2,3,4)</code> should be 10'); | ||||
|     testString: assert(sum(1,2,3,4) === 10); | ||||
|   - text: The result of <code>sum(5)</code> should be 5 | ||||
|     testString: assert(sum(5) === 5, 'The result of <code>sum(5)</code> should be 5'); | ||||
|     testString: assert(sum(5) === 5); | ||||
|   - text: The result of <code>sum()</code> should be 0 | ||||
|     testString: assert(sum() === 0, 'The result of <code>sum()</code> should be 0'); | ||||
|   - text: The <code>sum</code> function uses the <code>...</code> spread operator on the <code>args</code> parameter. | ||||
|     testString: getUserInput => assert(getUserInput('index').match(/function\s+sum\s*\(\s*...args\s*\)\s*{/g), 'The <code>sum</code> function uses the <code>...</code> spread operator on the <code>args</code> parameter.'); | ||||
|     testString: assert(sum() === 0); | ||||
|   - text: The <code>sum</code> function should use the <code>...</code> rest parameter on the <code>args</code> parameter. | ||||
|     testString: assert(code.replace(/\s/g,'').match(/sum=\(\.\.\.args\)=>/)); | ||||
|  | ||||
| ``` | ||||
|  | ||||
| @@ -43,13 +43,10 @@ tests: | ||||
| <div id='js-seed'> | ||||
|  | ||||
| ```js | ||||
| const sum = (function() { | ||||
|   "use strict"; | ||||
|   return function sum(x, y, z) { | ||||
|     const args = [ x, y, z ]; | ||||
|     return args.reduce((a, b) => a + b, 0); | ||||
|   }; | ||||
| })(); | ||||
| const sum = (x, y, z) => { | ||||
|   const args = [ x, y, z ]; | ||||
|   return args.reduce((a, b) => a + b, 0); | ||||
| } | ||||
| console.log(sum(1, 2, 3)); // 6 | ||||
| ``` | ||||
|  | ||||
| @@ -63,6 +60,8 @@ console.log(sum(1, 2, 3)); // 6 | ||||
| <section id='solution'> | ||||
|  | ||||
| ```js | ||||
| // solution required | ||||
| const sum = (...args) => { | ||||
|   return args.reduce((a, b) => a + b, 0); | ||||
| } | ||||
| ``` | ||||
| </section> | ||||
|   | ||||
| @@ -27,12 +27,12 @@ Copy all contents of <code>arr1</code> into another array <code>arr2</code> usin | ||||
|  | ||||
| ```yml | ||||
| tests: | ||||
|   - text: <code>arr2</code> is correct copy of <code>arr1</code>. | ||||
|     testString: assert(arr2.every((v, i) => v === arr1[i]), '<code>arr2</code> is correct copy of <code>arr1</code>.'); | ||||
|   - text: <code>arr2</code> should be correct copy of <code>arr1</code>. | ||||
|     testString: assert(arr2.every((v, i) => v === arr1[i])); | ||||
|   - text: <code>...</code> spread operator was used to duplicate <code>arr1</code>. | ||||
|     testString: getUserInput => assert(getUserInput('index').match(/\[\s*...arr1\s*\]/g),'<code>...</code> spread operator was used to duplicate <code>arr1</code>.'); | ||||
|   - text: <code>arr2</code> remains unchanged when <code>arr1</code> is changed. | ||||
|     testString: assert((arr1, arr2) => {arr1.push('JUN'); return arr2.length < arr1.length},'<code>arr2</code> remains unchanged when <code>arr1</code> is changed.'); | ||||
|     testString: assert(code.match(/\[\s*...arr1\s*\]/g)); | ||||
|   - text: <code>arr2</code> should remain unchanged when <code>arr1</code> is changed. | ||||
|     testString: assert((arr1, arr2) => {arr1.push('JUN'); return arr2.length < arr1.length}); | ||||
|  | ||||
| ``` | ||||
|  | ||||
| @@ -46,10 +46,9 @@ tests: | ||||
| ```js | ||||
| const arr1 = ['JAN', 'FEB', 'MAR', 'APR', 'MAY']; | ||||
| let arr2; | ||||
| (function() { | ||||
|   "use strict"; | ||||
|   arr2 = []; // change this line | ||||
| })(); | ||||
|  | ||||
| arr2 = [];  // change this line | ||||
|  | ||||
| console.log(arr2); | ||||
| ``` | ||||
|  | ||||
| @@ -65,10 +64,7 @@ console.log(arr2); | ||||
| ```js | ||||
| const arr1 = ['JAN', 'FEB', 'MAR', 'APR', 'MAY']; | ||||
| let arr2; | ||||
| (function() { | ||||
|   "use strict"; | ||||
|   arr2 = [...arr1]; // change this line | ||||
| })(); | ||||
| console.log(arr2); | ||||
|  | ||||
| arr2 = [...arr1]; | ||||
| ``` | ||||
| </section> | ||||
|   | ||||
		Reference in New Issue
	
	Block a user