|
1 | 1 | { |
2 | 2 | "info": { |
3 | 3 | "title": "Functional School", |
4 | | - "description": "A trip through functional programming in Javascript using common built-in Javascript array methods such as `map` & `reduce`.\n\nBy the end, you should have an understanding of how to use array methods to manipulate semi-complex data.\n\nLevel: Intermediate\nKeywords: javascript, functional\nLength: 1-2 hours\n\n\n<!-- @import('08/challenge-1') -->\n<!-- @import('09/challenge-2') -->" |
| 4 | + "description": "A trip through functional programming in Javascript using common built-in Javascript array methods such as `map` & `reduce`.\n\nBy the end, you should have an understanding of how to use array methods to manipulate semi-complex data.\n\nLevel: Intermediate\nKeywords: javascript, functional\nLength: 1-2 hours" |
5 | 5 | }, |
6 | 6 | "pages": [ |
7 | 7 | { |
|
25 | 25 | ], |
26 | 26 | "actions": [ |
27 | 27 | "open('00-setup.js')", |
28 | | - "set('// Welcome to CodeRoad!\nimport students from './data/students';\n\nvar first = ::>\n')" |
| 28 | + "set('// Welcome to CodeRoad!\nconst students = require('./data/students').default;\n\nvar first = ::>\n')" |
29 | 29 | ], |
30 | 30 | "hints": [ |
31 | 31 | "Get the first item in students using the array index", |
|
64 | 64 | }, |
65 | 65 | { |
66 | 66 | "title": "Filter", |
67 | | - "description": "Array -> Array of items that match a condition\n\nYou've hacked into the school's computer system, and just in time. The grades are in, but you're not too proud of your performance. That's okay, you have a plan: you're going to create a fake report card.\n\nIt would be great if you could `filter` the scores that your parents will see.\n\n`filter` takes a matching condition function and only returns items that result in true. As an example, look at `isA` below:\n\n```\nfunction isA(x) {\n return x === 'a';\n}\n```\n\n\nLike all of the methods in this chapter, `filter` is already part of the `Array.prototype`, so you can run it following any array. Each item in the array is passed into the params of the condition function, one by one. [Learn more](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter).\n\n```\nconst list = ['a', 'b'];\nlist.filter(isA);\n\n// if isA(list[0]), add to output array\n// if isA(list[1]), add to output array\n//\n//> ['a']\n```\n\nIf your data was composed of objects, we could use dot notation to find matches. Checkout `isB` below.\n\n```\nfunction isB(x) {\n return x.item === 'b'\n}\n\nconst list = [{item: 'a'}, {item: 'b'}];\nlist.filter(isB);\n//> [{item: 'b'}]\n```\n\nWhere were we? Back to filtering our grades.\n\nThere's too much student data in the computer system. We'll have to sort through it. Have a look at an example below:\n\n```\nconsole.log(students[0]);\n//> { course: 'Web Security',\n// instructor: 'Sue Denim',\n// name: 'Rebecca Heineman',\n// score: 93,\n// grade: 'A' }\n```", |
| 67 | + "description": "Array -> Array of items that match a condition\n\nYou've hacked into the school's computer system, and just in time. The grades are in, but you're not too proud of your performance. That's okay, you have a plan: you're going to create a fake report card.\n\nIt would be great if you could `filter` the scores that your parents will see.\n\n`filter` takes a matching condition function and only returns items that result in true. As an example, look at `isA` below:\n\n```js\nfunction isA(x) {\n return x === 'a';\n}\n```\n\n\nLike all of the methods in this chapter, `filter` is already part of the `Array.prototype`, so you can run it following any array. Each item in the array is passed into the params of the condition function, one by one. [Learn more](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter).\n\n```js\nconst list = ['a', 'b'];\nlist.filter(isA);\n\n// if isA(list[0]), add to output array\n// if isA(list[1]), add to output array\n//\n//> ['a']\n```\n\nIf your data was composed of objects, we could use dot notation to find matches. Checkout `isB` below.\n\n```js\nfunction isB(x) {\n return x.item === 'b'\n}\n\nconst list = [{item: 'a'}, {item: 'b'}];\nlist.filter(isB);\n//> [{item: 'b'}]\n```\n\nWhere were we? Back to filtering our grades.\n\nThere's too much student data in the computer system. We'll have to sort through it. Have a look at an example below:\n\n```js\nconsole.log(students[0]);\n//> { course: 'Web Security',\n// instructor: 'Sue Denim',\n// name: 'Rebecca Heineman',\n// score: 93,\n// grade: 'A' }\n```", |
68 | 68 | "tasks": [ |
69 | 69 | { |
70 | 70 | "description": "Write a filter condition function called `isAda` that returns true only if the name matches your name: \"Ada Lovelace\".", |
|
73 | 73 | ], |
74 | 74 | "actions": [ |
75 | 75 | "open('01-filter.js')", |
76 | | - "set('import students from './data/students';\n// Array.filter(fn)\n\nfunction isAda(student) {\n // return true if student name\n // matches \"Ada Lovelace\"\n ::>\n}\n')" |
| 76 | + "set('const students = require('./data/students').default;\n// Array.filter(fn)\n\nfunction isAda(student) {\n // return true if student name\n // matches \"Ada Lovelace\"\n ::>\n}\n')" |
77 | 77 | ], |
78 | 78 | "hints": [ |
79 | 79 | "Some tasks have hints", |
|
141 | 141 | ], |
142 | 142 | "actions": [ |
143 | 143 | "open('02-sort.js')", |
144 | | - "set('import myBest from './data/myBest';\n// Array.sort(fn)\n\nfunction compareScore(a, b) {\n switch (true) {\n case b.score > a.score:\n // it should return 1 if b's score is more than a's\n return ::>\n case 'set condition here':\n // it should return -1 if b's score is less than a's\n\n default:\n // it should return 0 if b and a have the same score\n\n }\n}\n')" |
| 144 | + "set('const myBest = require('./data/myBest').default;\n// Array.sort(fn)\n\nfunction compareScore(a, b) {\n switch (true) {\n case b.score > a.score:\n // it should return 1 if b's score is more than a's\n return ::>\n case 'set condition here':\n // it should return -1 if b's score is less than a's\n\n default:\n // it should return 0 if b and a have the same score\n\n }\n}\n')" |
145 | 145 | ] |
146 | 146 | }, |
147 | 147 | { |
|
198 | 198 | ], |
199 | 199 | "actions": [ |
200 | 200 | "open('03-map.js')", |
201 | | - "set('import myCourses from './data/myCourses';\n// Array.map(fn)\n\n/*\n change any `course.grade`'s into an 'A'\n\n example:\n changeGrade({ grade: 'F' }) === { grade: 'A' };\n*/\nfunction changeGrade(course) {\n ::>\n}\n\n')" |
| 201 | + "set('const myCourses = require('./data/myCourses').default;\n// Array.map(fn)\n\n/*\n * change any the `course.grade` into an 'A'\n *\n * for example:\n * changeGrade({ grade: 'F' }) === { grade: 'A' };\n*/\n\nfunction changeGrade(course) {\n ::>\n}\n\n')" |
202 | 202 | ], |
203 | 203 | "hints": [ |
204 | 204 | "give `changeGrade` a parameter, call it \"course\"", |
|
294 | 294 | ], |
295 | 295 | "actions": [ |
296 | 296 | "open('04-forEach.js')", |
297 | | - "set('import myFixed from './data/myFixed';\n// Array.forEach(fn)\n\nfunction logCourse(course) {\n console.log(`${course.grade} ${course.score} ${course.title}`);\n}\n\n// log your grades to the console\nmyFixed.forEach(::>);\n')" |
| 297 | + "set('const myFixed = require('./data/myFixed').default;\n// Array.forEach(fn)\n\nfunction logCourse(course) {\n console.log(`${course.grade} ${course.score} ${course.title}`);\n}\n\n// log your grades to the console\nmyFixed.forEach(::>);\n')" |
298 | 298 | ], |
299 | 299 | "hints": [ |
300 | 300 | "call `forEach` with `logCourse`" |
|
340 | 340 | }, |
341 | 341 | { |
342 | 342 | "title": "find", |
343 | | - "description": "Array -> first element that matches a condition\n\nSomehow your name has disappeared from the computer system. We'll have to `find` a way to get it back.\n\nYou quickly put together a list of other students in class. If someone changed your name, it'll be the name that is not in that list.\n\n`find` works similar to `filter`, but returns only the first match.\n\n```\nconst data = [1, 2, 3, 4, 5, 6];\n\nfunction isEven(num) {\n return num % 2 === 0;\n}\n\n// returns all matching data to a condition\ndata.filter(isEven);\n//> [2, 4, 6]\n\n// returns the first match\ndata.find(isEven);\n//> [2]\n```\n\nFind is great for performantly matching unique values in data, such as an \"id\", or in our case: a name.", |
| 343 | + "description": "Array -> first element that matches a condition\n\nSomehow your name has disappeared from the computer system. We'll have to `find` a way to get it back.\n\nYou quickly put together a list of other students in class. If someone changed your name, it'll be the name that is not in that list.\n\n`find` works similar to `filter`, but returns only the first match.\n\n```js\nconst data = [1, 2, 3, 4, 5, 6];\n\nfunction isEven(num) {\n return num % 2 === 0;\n}\n\n// returns all matching data to a condition\ndata.filter(isEven);\n//> [2, 4, 6]\n\n// returns the first match\ndata.find(isEven);\n//> [2]\n```\n\nFind is great for performantly matching unique values in data, such as an \"id\", or in our case: a name.", |
344 | 344 | "tasks": [ |
345 | 345 | { |
346 | 346 | "description": "load \"students\" data", |
|
359 | 359 | ], |
360 | 360 | "actions": [ |
361 | 361 | "open('05-find.js')", |
362 | | - "set('import courses from './data/myCourses2';\n// Array.find(fn)\n\n// filter for the course title matching \"Web Security\"\nconst myClass = courses.filter(::>);\n')" |
| 362 | + "set('const courses = require('./data/myCourses2');\n// Array.find(fn)\n\n// filter for the course title matching \"Web Security\"\nconst myClass = courses.filter(::>);\n')" |
363 | 363 | ], |
364 | 364 | "hints": [ |
365 | 365 | "create a `filter` function that takes a param `course`", |
|
443 | 443 | ], |
444 | 444 | "actions": [ |
445 | 445 | "open('06-concat.js')", |
446 | | - "set('import courses from './data/courses2';\n// Array.concat(any)\n\n// Array.prototype can be used to create new Array methods\nArray.prototype.flatten = function() {\n return this.reduce((a, b) => a.concat(b), []);\n};\n')", |
| 446 | + "set('const courses = require('./data/courses2').default;\n// Array.concat(any)\n\n// Array.prototype can be used to create new Array methods\nArray.prototype.flatten = function() {\n return this.reduce((a, b) => a.concat(b), []);\n};\n')", |
447 | 447 | "insert('\nconst numberedList = [[1, 2], [3, 4]];\n\n// use `flatten` on `numberedList`\nconst flattenedArray = numberedList::>;\n')" |
448 | 448 | ], |
449 | 449 | "hints": [ |
|
517 | 517 | ], |
518 | 518 | "actions": [ |
519 | 519 | "open('07-reduce.js')", |
520 | | - "set('import courses from './data/courses2';\n// Array.reduce(fn(a, b), initialValue)\n\nconst practice = [1, 1, 2, 3, 5, 8, 13, 21];\n\nfunction add(a, b) {\n return a + b;\n}\n\n// total the numbers using a reduce function\nconst total = practice.reduce(::>);\n')" |
| 520 | + "set('const courses = require('./data/courses2');\n// Array.reduce(fn(a, b), initialValue)\n\nconst practice = [1, 1, 2, 3, 5, 8, 13, 21];\n\nfunction add(a, b) {\n return a + b;\n}\n\n// total the numbers using a reduce function\nconst total = practice.reduce(::>);\n')" |
521 | 521 | ], |
522 | 522 | "hints": [ |
523 | 523 | "with only numbers, the initialValue defaults to 0", |
|
0 commit comments