You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: coderoad.json
+5-5Lines changed: 5 additions & 5 deletions
Original file line number
Diff line number
Diff line change
@@ -93,7 +93,7 @@
93
93
{
94
94
"title": "Map",
95
95
"description": "Array -> run a function over each item -> Array",
96
-
"explanation": "You've filtered and sorted our data, but neither of those actually change the data.\n\nWouldn't it be simpler if you could just change your grades? You can use the array method `map` to run a function that returns changes to your data.\n\nAs an example, let's look at how you would increment each number in an array.\n\n```js\nfunction addOne(num) {\n return num + 1;\n}\n\nfunction addTwo(num) {\n return num + 2;\n}\n\n[1, 2, 3].map(addOne);\n//> [2, 3, 4]\n\n[1, 2, 3].map(addOne).map(addTwo);\n//> [4, 5, 6]\n```\n\n`map` can change data, but it can also restrict the data you want to work with. See the example below to see another way scores could be sorted.\n\n```js\nmyBest\n .map(function(student) {\n return student.score;\n })\n .sort()\n .reverse()\n//> [93, 91, 88, 88, 82, 81, 73]\n```\n\nIn this example, `map` transformed an object with keys of 'title', 'instructor', 'name', 'score' and 'grade', to an array of scores only. Data wasn't changed, but it was limited to a smaller subset of scores.\n\n`map` is powerful. Let's see what you can do with it.\n\nThose D & F grades would look a lot better if they suddenly became A's.\n\nLet's go back to before we filtered out the bad grades, and instead change the grades to A's.",
96
+
"explanation": "You've filtered and sorted our data, but neither of those actually change the data.\n\nWouldn't it be simpler if you could just change your grades?\n\nYou can use the array method `map` to run a function that returns changes to your data.\n\nAs an example, let's look at how you would increment each number in an array.\n\n```js\nfunction addOne(num) {\n return num + 1;\n}\n\n[1, 2, 3].map(addOne);\n//> [2, 3, 4]\n\nfunction addToVal(obj) {\n obj.val += 1;\n return obj;\n}\n[{ val: 1}].map(addToVal);\n//> [{ val: 2 }]\n```\n\n`map` can change data, and it can also alter structure of the data you're working with.\n\n```js\nfunction makeObject(num) {\n return { val: num };\n}\n\n[1, 2].map(makeObject);\n//> [{ val: 1 }, { val: 2 }]\n```\n\nSimilarly, `map` can also restrict the data you want to work with. See the example below to see another way scores could be sorted.\n\n```js\nmyBest\n .map(function(student) {\n return student.score;\n })\n .sort()\n .reverse()\n//> [93, 91, 88, 88, 82, 81, 73]\n```\n\nIn this example, `map` transformed an object with keys of 'title', 'instructor', 'name', 'score' and 'grade', to an array of just scores. Values weren't changed, but rather limited to a smaller subset of scores.\n\n`map` is powerful. Let's see what you can do with it.\n\nThose D & F grades would look a lot better if they suddenly became A's.\n\nLet's go back to before we filtered out the bad grades, and instead change the grades to A's.",
97
97
"tasks": [
98
98
{
99
99
"description": "Make a function `changeGrades` that takes student data and changes all grades to \"A\"s.",
@@ -102,7 +102,7 @@
102
102
],
103
103
"actions": [
104
104
"open('03-map.js')",
105
-
"set('// change any `student.grade`'s into an 'A'\nfunction changeGrades(student) {\n\n}\n')"
105
+
"set('// change any `student.grade`'s into an 'A'\nfunction changeGrades() {\n\n}\n')"
106
106
]
107
107
},
108
108
{
@@ -120,7 +120,7 @@
120
120
"1/03/03-map"
121
121
],
122
122
"actions": [
123
-
"insert('// map over `mySlightlyChanged` with a function `increaseGrades` to increment each score by 12\nvar mySlightlyChanged = myData.map();\n')"
123
+
"insert('\nfunction increaseScores() {\n\n}\n\n// map over `mySlightlyChanged` with a function `increaseScores` to increment each score by 12\nvar mySlightlyChanged = myData;\n')"
124
124
]
125
125
},
126
126
{
@@ -129,7 +129,7 @@
129
129
"1/03/04-map"
130
130
],
131
131
"actions": [
132
-
"insert('// set `mySlightlyFixed` to change any scores over 100 to a score of 95\nvar mySlightlyFixed = mySlightlyChanged.map();\n')"
132
+
"insert('\nfunction capScores() {\n\n}\n\n// set `mySlightlyFixed` to change any scores over 100 to a score of 95\nvar mySlightlyFixed = mySlightlyChanged;\n')"
133
133
]
134
134
},
135
135
{
@@ -138,7 +138,7 @@
138
138
"1/03/05-map"
139
139
],
140
140
"actions": [
141
-
"insert('\nfunction getGrade(score) {\n switch (true) {\n case (score >= 90):\n return \"A\";\n case (score >= 80):\n return \"B\";\n case (score >= 70):\n return \"C\";\n case (score >= 60):\n return \"D\";\n default:\n return \"F\";\n }\n}\n// set `myFixed` to update grades to the new scores\nvar myFixed = mySlightlyChanged.map();\n')"
141
+
"insert('\nfunction getGrade(score) {\n switch (true) {\n case (score >= 90):\n return \"A\";\n case (score >= 80):\n return \"B\";\n case (score >= 70):\n return \"C\";\n case (score >= 60):\n return \"D\";\n default:\n return \"F\";\n }\n}\n\n// set `myFixed` to update grades to the new scores\nvar myFixed = mySlightlyChanged;\n')"
Copy file name to clipboardExpand all lines: tutorial/1/03/map.md
+38-14Lines changed: 38 additions & 14 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -3,7 +3,9 @@ Array -> run a function over each item -> Array
3
3
4
4
You've filtered and sorted our data, but neither of those actually change the data.
5
5
6
-
Wouldn't it be simpler if you could just change your grades? You can use the array method `map` to run a function that returns changes to your data.
6
+
Wouldn't it be simpler if you could just change your grades?
7
+
8
+
You can use the array method `map` to run a function that returns changes to your data.
7
9
8
10
As an example, let's look at how you would increment each number in an array.
9
11
@@ -12,18 +14,29 @@ function addOne(num) {
12
14
return num +1;
13
15
}
14
16
15
-
functionaddTwo(num) {
16
-
return num +2;
17
-
}
18
-
19
17
[1, 2, 3].map(addOne);
20
18
//> [2, 3, 4]
21
19
22
-
[1, 2, 3].map(addOne).map(addTwo);
23
-
//> [4, 5, 6]
20
+
functionaddToVal(obj) {
21
+
obj.val+=1;
22
+
return obj;
23
+
}
24
+
[{ val:1}].map(addToVal);
25
+
//> [{ val: 2 }]
26
+
```
27
+
28
+
`map` can change data, and it can also alter structure of the data you're working with.
29
+
30
+
```js
31
+
functionmakeObject(num) {
32
+
return { val: num };
33
+
}
34
+
35
+
[1, 2].map(makeObject);
36
+
//> [{ val: 1 }, { val: 2 }]
24
37
```
25
38
26
-
`map` can change data, but it can also restrict the data you want to work with. See the example below to see another way scores could be sorted.
39
+
Similarly, `map` can also restrict the data you want to work with. See the example below to see another way scores could be sorted.
27
40
28
41
```js
29
42
myBest
@@ -35,7 +48,7 @@ myBest
35
48
//> [93, 91, 88, 88, 82, 81, 73]
36
49
```
37
50
38
-
In this example, `map` transformed an object with keys of 'title', 'instructor', 'name', 'score' and 'grade', to an array of scores only. Data wasn't changed, but it was limited to a smaller subset of scores.
51
+
In this example, `map` transformed an object with keys of 'title', 'instructor', 'name', 'score' and 'grade', to an array of just scores. Values weren't changed, but rather limited to a smaller subset of scores.
39
52
40
53
`map` is powerful. Let's see what you can do with it.
41
54
@@ -49,7 +62,7 @@ Let's go back to before we filtered out the bad grades, and instead change the g
49
62
@action(set(
50
63
```
51
64
// change any `student.grade`'s into an 'A'
52
-
function changeGrades(student) {
65
+
function changeGrades() {
53
66
54
67
}
55
68
```
@@ -71,17 +84,27 @@ Let's go back to `myData` and instead increment each score by 12 points.
71
84
@test('1/03/03-map')
72
85
@action(insert(
73
86
```
74
-
// map over `mySlightlyChanged` with a function `increaseGrades` to increment each score by 12
75
-
var mySlightlyChanged = myData.map();
87
+
88
+
function increaseScores() {
89
+
90
+
}
91
+
92
+
// map over `mySlightlyChanged` with a function `increaseScores` to increment each score by 12
93
+
var mySlightlyChanged = myData;
76
94
```
77
95
))
78
96
79
97
+ Wait. Now you're getting 105 in "Algorithm Design" class. Set `mySlightlyFixed` to have a maximum score of 95. That should be less suspicious.
80
98
@test('1/03/04-map')
81
99
@action(insert(
82
100
```
101
+
102
+
function capScores() {
103
+
104
+
}
105
+
83
106
// set `mySlightlyFixed` to change any scores over 100 to a score of 95
84
-
var mySlightlyFixed = mySlightlyChanged.map();
107
+
var mySlightlyFixed = mySlightlyChanged;
85
108
```
86
109
))
87
110
@@ -104,8 +127,9 @@ function getGrade(score) {
104
127
return "F";
105
128
}
106
129
}
130
+
107
131
// set `myFixed` to update grades to the new scores
0 commit comments