Skip to content

Commit f1a268e

Browse files
committed
edits
1 parent e4a9206 commit f1a268e

File tree

8 files changed

+86
-55
lines changed

8 files changed

+86
-55
lines changed

README.md

Lines changed: 3 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,9 @@ Using common built-in Javascript array methods such as `map` & `reduce`.
2525

2626
By the end, you should have an understanding of how to use array methods to manipulate semi-complex data.
2727

28+
<!-- @import('./tutorial/1/08/challenge-1') -->
29+
<!-- @import('./tutorial/1/09/challenge-2') -->
30+
2831
##### Filter
2932

3033
Array -> Array of items that match a condition
@@ -48,11 +51,3 @@ Array -> find an item that matches a condition
4851
##### reduce
4952

5053
Array -> transform into anything
51-
52-
##### Challenge 1
53-
54-
coming soon
55-
56-
##### Challenge 2
57-
58-
coming soon

coderoad.json

Lines changed: 30 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
{
1111
"title": "Filter",
1212
"description": "Array -> Array of items that match a condition",
13-
"explanation": "You've hacked into the school's computer system, and just in time. The grades are in, aren't you're not too proud of your performance. But 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. A `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.\n\n```\nvar 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\nvar 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(data[0]);\n//> { course: 'Web Security',\n// instructor: 'Sue Denim',\n// name: 'Rebecca Heineman',\n// score: 93,\n// grade: 'A' }\n```",
13+
"explanation": "You'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```\nvar 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\nvar 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(data[0]);\n//> { course: 'Web Security',\n// instructor: 'Sue Denim',\n// name: 'Rebecca Heineman',\n// score: 93,\n// grade: 'A' }\n```",
1414
"tasks": [
1515
{
1616
"description": "Write a filter condition function called `isAda` that returns true only if the name matches your name: \"Ada Lovelace\".",
@@ -55,7 +55,7 @@
5555
{
5656
"title": "Sort",
5757
"description": "Array -> sorted Array",
58-
"explanation": "Your grades are filtered down to your name and good scores - but wouldn't it be better if your best grades were shown at the top? Besides, your parents rarely read all the way down to the bottom.\n\nWe can use the array method `sort` to arrange our data. Let's see how it works.\n\n```js\n['c', 'b', 'a'].sort();\n//> ['a', 'b', 'c']\n\n[3, 2, 1].sort();\n//> [1, 2, 3]\n```\n\nBut what about sorting the scores inside of an object? We can write a custom `compareScore` function.\n\nA sort function takes two params, and compares the first to the second. It should return values saying where the second value should go:\n\n * -1 : sort to a lower index\n * 1 : sort to a higher index\n * 0 : stay the same\n\nAlright, now time to sort your best grades to the top.",
58+
"explanation": "Your grades are filtered down to your name and good scores - but wouldn't it be better if your best grades were displayed first, at the top? Besides, your parents rarely read anything through.\n\nYou can use the array method `sort` to arrange your data. Let's see how it works.\n\n```js\n['c', 'b', 'a'].sort();\n//> ['a', 'b', 'c']\n\n[3, 2, 1].sort();\n//> [1, 2, 3]\n```\n\nBut what about sorting scores inside of an object?\n\n```js\n[{a: 3}, {a: 1}, {a: 2}].sort();\n//> [{a: 3}, {a: 1}, {a: 2}]\n```\n\nThat didn't work. Instead, you can write a custom `compareScore` function.\n\nA sort function takes two params, and compares the first to the second. It should return values saying where the second value should go in the array:\n\n * -1 : sort to a lower index (front)\n * 1 : sort to a higher index (back)\n * 0 : stay the same\n\nAlright, now time to sort your best grades to the top.",
5959
"tasks": [
6060
{
6161
"description": "Write a sort condition function called `compareScore` that can sort your data by score.",
@@ -68,7 +68,7 @@
6868
]
6969
},
7070
{
71-
"description": "Set `mySortedGrades` to `myBest` data sorted with `compareScore`",
71+
"description": "Set `mySortedGrades` to `myBest` data sorted by `compareScore`",
7272
"tests": [
7373
"1/02/01-sort"
7474
],
@@ -178,14 +178,14 @@
178178
"explanation": "Somehow 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```\nvar 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 \"id\"'s, or in our case, names.",
179179
"tasks": [
180180
{
181-
"description": "`filter` down students in the class titled Web Security (`{ title: \"Web Security\" }`)",
181+
"description": "`filter` to students in the class titled \"Web Security\"",
182182
"tests": [
183183
"1/05/01-find"
184184
],
185185
"actions": [
186186
"open('05-find.js')",
187-
"set('var otherStudents = [\"Albert Gonzalez\", \"Brian Kernaghan\", \"Danielle Bunten Berry\", \"Donald Knuth\", \"Grace Hopper\", \"Hack Kerr\", \"James Gosling\", \"Ken Thompson\", \"Kevin Mitnick\", \"Linus Torvalds\", \"Niklaus Wirth\", \"Rebecca Heineman\", \"Tim Berners-Lee\", \"Xiao Tian\", \"Ying Cracker\"];\n\nvar classTitle = \"Web Security\";\n')",
188-
"insert('var myClass\n')"
187+
"set('// search for a student with a name\n// not matching students in the list\nvar otherStudents = [\"Albert Gonzalez\", \"Brian Kernaghan\", \"Danielle Bunten Berry\", \"Donald Knuth\", \"Grace Hopper\", \"Hack Kerr\", \"James Gosling\", \"Ken Thompson\", \"Kevin Mitnick\", \"Linus Torvalds\", \"Niklaus Wirth\", \"Rebecca Heineman\", \"Tim Berners-Lee\", \"Xiao Tian\", \"Ying Cracker\"];\n')",
188+
"insert('\n// filter for students.title is \"Web Security\"\nvar myClass = students\n')"
189189
]
190190
},
191191
{
@@ -194,7 +194,7 @@
194194
"1/05/02-find"
195195
],
196196
"actions": [
197-
"insert('var unknownStudent \n')"
197+
"insert('\n// hint: use `indexOf` to find if an item is in the array\nvar unknownStudent \n')"
198198
]
199199
},
200200
{
@@ -280,47 +280,55 @@
280280
{
281281
"title": "reduce",
282282
"description": "Array -> transform into anything",
283-
"explanation": "",
283+
"explanation": "```js\nfunction add(prev, curr) {\n console.log(`add(${prev}, ${curr}) -> ${prev + curr}`)\n return prev + curr;\n}\n\n[1, 5, 10].reduce(add, 100); // initial value\n\n// add(100, 1) -> 101\n// add(101, 5) -> 106\n// add(106, 10) -> 116\n//> 116\n```",
284284
"tasks": [
285285
{
286-
"description": "Use `reduce` to calculate the class average",
286+
"description": "Use `reduce` to sum the numbers in the `practice` array",
287287
"tests": [
288288
"1/07/01-reduce"
289289
],
290290
"actions": [
291-
"open('07-reduce.js')"
291+
"open('07-reduce.js')",
292+
"set('var practice = [1, 1, 2, 3, 5, 8, 13, 21];\n\n// total the numbers using a reduce function\n// hint: start at 0\nvar total = practice.reduce();\n')"
292293
]
293294
},
294295
{
295-
"description": "`reduce` to suspect scores",
296+
"description": "`map` over each course and use `reduce` to calculate the class averages for each class. Set `averages` to the resulting array of all class averages.",
296297
"tests": [
297298
"1/07/02-reduce"
299+
],
300+
"actions": [
301+
"insert('// Remember, an average is the sum of all student scores divided by the number of students\n// set the result to an array, for example: [50, 65, 75, 85, ...];\nvar averages = courses.reduce();\n')"
298302
]
299303
},
300304
{
301-
"description": "`map` over suspect data to find the score differences",
305+
"description": "`reduce` to an array of suspect scores",
302306
"tests": [
303307
"1/07/03-reduce"
308+
],
309+
"actions": [
310+
"insert('\n// [{ name: 'suspectName', scores: [ 50, 65, 75, 85...] }, ... ]\nvar suspectScores = courses.reduce();\n')"
304311
]
305312
},
306313
{
307-
"description": "`reduce` down to likely suspect names",
314+
"description": "`map` over suspect data to find the `\"difference\"` from subtracting the students score from the average score. Add this to `suspectScores` using the key `difference`. The resulting array should look like this:\n```js\n[{\n name: 'suspectName',\n scores: [50, 65, 75, 85...],\n difference: 15\n}]\n```",
308315
"tests": [
309316
"1/07/04-reduce"
310317
]
318+
},
319+
{
320+
"description": "`reduce` down to any likely suspect names by filtering with the `isCheater` function",
321+
"tests": [
322+
"1/07/05-reduce"
323+
],
324+
"actions": [
325+
"insert('\nfunction isCheater(suspect) {\n return suspect.difference > 200;\n}\n\n// reduce down to a string of likely suspects\nvar likelySuspect = suspectScores.reduce().join(', ');\nconsole.log(likelySuspect);\n')"
326+
]
311327
}
312328
]
313-
},
314-
{
315-
"title": "Challenge 1",
316-
"description": "coming soon"
317-
},
318-
{
319-
"title": "Challenge 2",
320-
"description": "coming soon"
321329
}
322330
],
323-
"description": "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."
331+
"description": "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\n<!-- @import('./tutorial/1/08/challenge-1') -->\n<!-- @import('./tutorial/1/09/challenge-2') -->"
324332
}
325333
]
326334
}

package.json

Lines changed: 21 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,23 +2,38 @@
22
"name": "coderoad-functional-school",
33
"version": "0.1.0",
44
"description": "Coderoad tutorial",
5-
"author": "Shawn McKay <shawn.j.mckay@gmail.com>",
5+
"author": "Shawn McKay <shawn.j.mckay@gmail.com> (http://shmck.com)",
66
"contributers": [],
7-
"main": "coderoad.json",
87
"keywords": [
9-
"coderoad"
8+
"coderoad", "tutorial", "functional"
9+
],
10+
"main": "coderoad.json",
11+
"files": [
12+
"coderoad.json",
13+
"tutorial"
1014
],
15+
"repository": {
16+
"type": "git",
17+
"url": "https://github.com/coderoad/coderoad-functional-school.git"
18+
},
19+
"bugs": {
20+
"url": "https://github.com/coderoad/coderoad-functional-school/issues"
21+
},
22+
"engines": {
23+
"node" : ">=0.10.3"
24+
},
1125
"dependencies": {
1226
"chai": "3.5.0",
1327
"chai-spies": "0.7.1",
1428
"lodash": "4.3.0",
1529
"mocha": "2.4.5",
16-
"mocha-coderoad": "0.2.1"
30+
"mocha-coderoad": "^0.2.1"
1731
},
1832
"license": "MIT",
19-
"coderoad": {
33+
"config": {
2034
"testDir": "tutorial",
2135
"testSuffix": ".spec.js",
22-
"testRunner": "mocha-coderoad"
36+
"testRunner": "mocha-coderoad",
37+
"edit": true
2338
}
2439
}

tutorial/1/01/filter.md

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
11
### Filter
22
Array -> Array of items that match a condition
33

4-
You've hacked into the school's computer system, and just in time. The grades are in, aren't you're not too proud of your performance. But that's okay, you have a plan: you're going to create a fake report card.
4+
You'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.
55

6-
It would be great if you could `filter` the scores that your parents will see. A `filter` takes a matching condition function and only returns items that result in true. As an example, look at `isA` below:
6+
It would be great if you could `filter` the scores that your parents will see.
7+
8+
`filter` takes a matching condition function and only returns items that result in true. As an example, look at `isA` below:
79

810
```
911
function isA(x) {
@@ -12,7 +14,7 @@ function isA(x) {
1214
```
1315

1416

15-
Like 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.
17+
Like 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).
1618

1719
```
1820
var list = ['a', 'b'];

tutorial/1/02/sort.md

Lines changed: 14 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
### Sort
22
Array -> sorted Array
33

4-
Your grades are filtered down to your name and good scores - but wouldn't it be better if your best grades were shown at the top? Besides, your parents rarely read all the way down to the bottom.
4+
Your grades are filtered down to your name and good scores - but wouldn't it be better if your best grades were displayed first, at the top? Besides, your parents rarely read anything through.
55

6-
We can use the array method `sort` to arrange our data. Let's see how it works.
6+
You can use the array method `sort` to arrange your data. Let's see how it works.
77

88
```js
99
['c', 'b', 'a'].sort();
@@ -13,12 +13,19 @@ We can use the array method `sort` to arrange our data. Let's see how it works.
1313
//> [1, 2, 3]
1414
```
1515

16-
But what about sorting the scores inside of an object? We can write a custom `compareScore` function.
16+
But what about sorting scores inside of an object?
1717

18-
A sort function takes two params, and compares the first to the second. It should return values saying where the second value should go:
18+
```js
19+
[{a: 3}, {a: 1}, {a: 2}].sort();
20+
//> [{a: 3}, {a: 1}, {a: 2}]
21+
```
22+
23+
That didn't work. Instead, you can write a custom `compareScore` function.
24+
25+
A sort function takes two params, and compares the first to the second. It should return values saying where the second value should go in the array:
1926

20-
* -1 : sort to a lower index
21-
* 1 : sort to a higher index
27+
* -1 : sort to a lower index (front)
28+
* 1 : sort to a higher index (back)
2229
* 0 : stay the same
2330

2431
Alright, now time to sort your best grades to the top.
@@ -44,7 +51,7 @@ function compareScore(a, b) {
4451
```
4552
))
4653

47-
+ Set `mySortedGrades` to `myBest` data sorted with `compareScore`
54+
+ Set `mySortedGrades` to `myBest` data sorted by `compareScore`
4855
@test('1/02/01-sort')
4956
@action(insert(
5057
```

tutorial/1/05/01-find.spec.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,15 +5,15 @@ var path = require('path');
55
var loadJS = require('../../common/loadJS').default;
66

77

8-
if (!global.data) {
9-
global.data = JSON.parse(JSON.stringify(require('../../data/students2.json')));
8+
if (!global.students) {
9+
global.students = JSON.parse(JSON.stringify(require('../../data/students2.json')));
1010
}
1111
loadJS('05-find.js');
1212

1313
describe('var myClass', function() {
1414

1515
it('should filter to "Web Security" class data', function () {
16-
var result = global.data.filter(function (course) {
16+
var result = global.students.filter(function (course) {
1717
return course.title === 'Web Security';
1818
});
1919
expect(myClass).to.deep.equal(result);

tutorial/1/05/find.md

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -25,26 +25,30 @@ data.find(isEven);
2525

2626
Find is great for performantly matching unique values in data, such as "id"'s, or in our case, names.
2727

28-
+ `filter` down students in the class titled Web Security (`{ title: "Web Security" }`)
28+
+ `filter` to students in the class titled "Web Security"
2929
@test('1/05/01-find')
3030
@action(open('05-find.js'))
3131
@action(set(
3232
```
33+
// search for a student with a name
34+
// not matching students in the list
3335
var otherStudents = ["Albert Gonzalez", "Brian Kernaghan", "Danielle Bunten Berry", "Donald Knuth", "Grace Hopper", "Hack Kerr", "James Gosling", "Ken Thompson", "Kevin Mitnick", "Linus Torvalds", "Niklaus Wirth", "Rebecca Heineman", "Tim Berners-Lee", "Xiao Tian", "Ying Cracker"];
34-
35-
var classTitle = "Web Security";
3636
```
3737
))
3838
@action(insert(
3939
```
40-
var myClass
40+
41+
// filter for students.title is "Web Security"
42+
var myClass = students
4143
```
4244
))
4345

4446
+ `find` the name in `myClass` that isn't in the list of known students
4547
@test('1/05/02-find')
4648
@action(insert(
4749
```
50+
51+
// hint: use `indexOf` to find if an item is in the array
4852
var unknownStudent
4953
```
5054
))

tutorial/tutorial.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,5 +13,5 @@ By the end, you should have an understanding of how to use array methods to mani
1313
@import('./tutorial/1/05/find')
1414
@import('./tutorial/1/06/concat')
1515
@import('./tutorial/1/07/reduce')
16-
@import('./tutorial/1/08/challenge-1')
17-
@import('./tutorial/1/09/challenge-2')
16+
<!-- @import('./tutorial/1/08/challenge-1') -->
17+
<!-- @import('./tutorial/1/09/challenge-2') -->

0 commit comments

Comments
 (0)