| 
									
										
										
										
											2018-09-30 23:01:58 +01:00
										 |  |  | --- | 
					
						
							|  |  |  | id: 587d7b8b367417b2b2512b50 | 
					
						
							|  |  |  | title: Write Concise Declarative Functions with ES6 | 
					
						
							|  |  |  | challengeType: 1 | 
					
						
							| 
									
										
										
										
											2019-08-05 09:17:33 -07:00
										 |  |  | forumTopicId: 301224 | 
					
						
							| 
									
										
										
										
											2021-01-13 03:31:00 +01:00
										 |  |  | dashedName: write-concise-declarative-functions-with-es6 | 
					
						
							| 
									
										
										
										
											2018-09-30 23:01:58 +01:00
										 |  |  | --- | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2020-11-27 19:02:05 +01:00
										 |  |  | # --description--
 | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | When defining functions within objects in ES5, we have to use the keyword `function` as follows: | 
					
						
							| 
									
										
										
										
											2019-05-17 06:20:30 -07:00
										 |  |  | 
 | 
					
						
							|  |  |  | ```js | 
					
						
							|  |  |  | const person = { | 
					
						
							|  |  |  |   name: "Taylor", | 
					
						
							|  |  |  |   sayHello: function() { | 
					
						
							|  |  |  |     return `Hello! My name is ${this.name}.`; | 
					
						
							|  |  |  |   } | 
					
						
							|  |  |  | }; | 
					
						
							|  |  |  | ``` | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2020-11-27 19:02:05 +01:00
										 |  |  | With ES6, You can remove the `function` keyword and colon altogether when defining functions in objects. Here's an example of this syntax: | 
					
						
							| 
									
										
										
										
											2019-05-17 06:20:30 -07:00
										 |  |  | 
 | 
					
						
							|  |  |  | ```js | 
					
						
							|  |  |  | const person = { | 
					
						
							|  |  |  |   name: "Taylor", | 
					
						
							|  |  |  |   sayHello() { | 
					
						
							|  |  |  |     return `Hello! My name is ${this.name}.`; | 
					
						
							|  |  |  |   } | 
					
						
							|  |  |  | }; | 
					
						
							|  |  |  | ``` | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2020-11-27 19:02:05 +01:00
										 |  |  | # --instructions--
 | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | Refactor the function `setGear` inside the object `bicycle` to use the shorthand syntax described above. | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | # --hints--
 | 
					
						
							| 
									
										
										
										
											2018-09-30 23:01:58 +01:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2020-11-27 19:02:05 +01:00
										 |  |  | Traditional function expression should not be used. | 
					
						
							| 
									
										
										
										
											2018-09-30 23:01:58 +01:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2020-11-27 19:02:05 +01:00
										 |  |  | ```js | 
					
						
							|  |  |  | (getUserInput) => assert(!__helpers.removeJSComments(code).match(/function/)); | 
					
						
							|  |  |  | ``` | 
					
						
							| 
									
										
										
										
											2018-09-30 23:01:58 +01:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2020-11-27 19:02:05 +01:00
										 |  |  | `setGear` should be a declarative function. | 
					
						
							| 
									
										
										
										
											2018-09-30 23:01:58 +01:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2020-11-27 19:02:05 +01:00
										 |  |  | ```js | 
					
						
							|  |  |  | assert( | 
					
						
							|  |  |  |   typeof bicycle.setGear === 'function' && code.match(/setGear\s*\(.+\)\s*\{/) | 
					
						
							|  |  |  | ); | 
					
						
							| 
									
										
										
										
											2018-09-30 23:01:58 +01:00
										 |  |  | ``` | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2020-11-27 19:02:05 +01:00
										 |  |  | `bicycle.setGear(48)` should change the `gear` value to 48. | 
					
						
							| 
									
										
										
										
											2018-09-30 23:01:58 +01:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2020-11-27 19:02:05 +01:00
										 |  |  | ```js | 
					
						
							|  |  |  | assert(new bicycle.setGear(48).gear === 48); | 
					
						
							|  |  |  | ``` | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | # --seed--
 | 
					
						
							| 
									
										
										
										
											2018-09-30 23:01:58 +01:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2020-11-27 19:02:05 +01:00
										 |  |  | ## --seed-contents--
 | 
					
						
							| 
									
										
										
										
											2018-09-30 23:01:58 +01:00
										 |  |  | 
 | 
					
						
							|  |  |  | ```js | 
					
						
							| 
									
										
										
										
											2020-03-04 13:08:54 -06:00
										 |  |  | // Only change code below this line | 
					
						
							| 
									
										
										
										
											2018-09-30 23:01:58 +01:00
										 |  |  | const bicycle = { | 
					
						
							|  |  |  |   gear: 2, | 
					
						
							|  |  |  |   setGear: function(newGear) { | 
					
						
							|  |  |  |     this.gear = newGear; | 
					
						
							|  |  |  |   } | 
					
						
							|  |  |  | }; | 
					
						
							| 
									
										
										
										
											2020-03-04 13:08:54 -06:00
										 |  |  | // Only change code above this line | 
					
						
							| 
									
										
										
										
											2018-09-30 23:01:58 +01:00
										 |  |  | bicycle.setGear(3); | 
					
						
							|  |  |  | console.log(bicycle.gear); | 
					
						
							|  |  |  | ``` | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2020-11-27 19:02:05 +01:00
										 |  |  | # --solutions--
 | 
					
						
							| 
									
										
										
										
											2018-09-30 23:01:58 +01:00
										 |  |  | 
 | 
					
						
							|  |  |  | ```js | 
					
						
							| 
									
										
										
										
											2019-02-13 22:11:56 +03:00
										 |  |  | const bicycle = { | 
					
						
							|  |  |  |   gear: 2, | 
					
						
							|  |  |  |   setGear(newGear) { | 
					
						
							|  |  |  |     this.gear = newGear; | 
					
						
							|  |  |  |   } | 
					
						
							|  |  |  | }; | 
					
						
							|  |  |  | bicycle.setGear(3); | 
					
						
							| 
									
										
										
										
											2018-09-30 23:01:58 +01:00
										 |  |  | ``` |