|
193 | 193 | {
|
194 | 194 | "title": "find",
|
195 | 195 | "description": "Array -> first element that matches a condition",
|
196 |
| - "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.", |
| 196 | + "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 an \"id\", or in our case: a name.", |
197 | 197 | "tasks": [
|
198 | 198 | {
|
199 | 199 | "description": "`filter` to students in the class titled \"Web Security\"",
|
|
202 | 202 | ],
|
203 | 203 | "actions": [
|
204 | 204 | "open('05-find.js')",
|
205 |
| - "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')", |
206 |
| - "insert('\n// filter for students.title is \"Web Security\"\nvar myClass = students\n')" |
| 205 | + "set('// filter for students.title is \"Web Security\"\nvar myClass = students.filter();\n')" |
207 | 206 | ]
|
208 | 207 | },
|
209 | 208 | {
|
|
212 | 211 | "1/05/02-find"
|
213 | 212 | ],
|
214 | 213 | "actions": [
|
215 |
| - "insert('\n// hint: use `indexOf` to find if an item is in the array\nvar unknownStudent \n')" |
| 214 | + "insert('\n// 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\n')", |
| 215 | + "insert('// hint: use `indexOf` to find if an item is in the array\nfunction notInList() {\n\n}\n\n// find using `notInList`\nvar unknownStudent = myClass.find();\n')" |
216 | 216 | ]
|
217 | 217 | },
|
218 | 218 | {
|
|
221 | 221 | "1/05/03-find"
|
222 | 222 | ],
|
223 | 223 | "actions": [
|
224 |
| - "insert('var unknownStudentList\n')" |
| 224 | + "insert('\n// filter using `notInList`\nvar unknownStudentList = students.filter();\n')" |
225 | 225 | ]
|
226 | 226 | },
|
227 | 227 | {
|
|
230 | 230 | "1/05/04-find"
|
231 | 231 | ],
|
232 | 232 | "actions": [
|
233 |
| - "insert('var unknownStudentNames\n')" |
| 233 | + "insert('\n// use `map` to return only the `student.name`\nvar unknownStudentNames = unknownStudentList.map();\n')" |
234 | 234 | ]
|
235 | 235 | },
|
236 | 236 | {
|
237 |
| - "description": "`join('')` the array of names to output result\n\n# concat\nArray + Array -> Array\n\nBefore we've been working on a structured set of student data.\n\n```js\n// array of students\n[\n {\n \"title\": \"Relational Databases\",\n \"instructor\": \"Sean Quentin Lewis\",\n \"name\": \"Rebecca Heineman\",\n \"score\": 71,\n \"grade\": \"C\"\n }\n// students in courses...\n]\n```\n\nTo be safe, let's now work on the original data set. Notice how it is structured differently.\n\n```js\n// array of courses\n[\n {\n \"title\": \"Relational Databases\",\n \"instructor\": \"Sean Quentin Lewis\",\n \"students\": [\n {\n \"name\": \"Rebecca Heineman\",\n \"score\": 71,\n \"grade\": \"C\"\n }\n // students...\n ]\n }\n // courses...\n]\n```\n\nIn this data set, there is an array of students within an array of courses. So how can we recreate our original array of students from the courses? We can use `concat`.\n\nWeird things happen when you start combining arrays. `concat` brings sanity.\n\n```js\n[1, 2] + [3, 4];\n//> \"1, 23, 4\"\n\n[1, 2].push([3, 4]);\n//> 3\n\n[1, 2].join([3, 4]);\n//> \"13, 42\"\n\n[1, 2].concat([3, 4]);\n//> [1, 2, 3, 4]\n```\n\nUnfortunately, Javascript is missing a built in array method to concat multiple arrays together: let's call it `flatten` (often called `concatAll`). `flatten` should loop over an array and concat each element.\n\n```js\nvar start = [{\n a: 1,\n c: [\n { b: 1 }\n ]\n}, {\n a: 2,\n c: [\n { b: 2 }, { b: 3 }\n ]\n}];\n\nvar middle = start.map(function(outer) {\n return outer.c.map(function(inner) {\n return {\n a: outer.a,\n b: inner.b\n };\n });\n});\n//> [ [{ a: 1, b: 1 }], [{a: 2, b: 2}, {a: 2, b: 3}] ]\n\nvar end = pre.flatten();\n//> [{a: 1, b: 1}, {a: 2, b: 2}, {a: 2, b: 3}]\n```\n\nBack to business.\n\nWe have a suspect in mind: a classmate named \"Hack Kerr\". He's a nice guy, and he's always been friendly to you - but there's something suspicious about him: his name.\n\nFirst let's recreate our student array of data from the course data.", |
| 237 | + "description": "`join('')` the array of names to output the result as a string", |
238 | 238 | "tests": [
|
239 | 239 | "1/05/05-find"
|
240 | 240 | ],
|
241 | 241 | "actions": [
|
242 |
| - "insert('var decodedName\n')" |
| 242 | + "insert('\n// use `.join('')` to join the array of strings\nvar decodedName = unknownStudentNames;\nconsole.log(decodedName);\n')" |
243 | 243 | ]
|
244 | 244 | },
|
| 245 | + { |
| 246 | + "description": "Very strange. In the next step, let's find out who wants revenge, and give it to him!", |
| 247 | + "tests": [ |
| 248 | + "1/05/06-find" |
| 249 | + ] |
| 250 | + } |
| 251 | + ] |
| 252 | + }, |
| 253 | + { |
| 254 | + "title": "concat", |
| 255 | + "description": "Array + Array -> Array", |
| 256 | + "explanation": "Before we've been working on a structured set of student data.\n\n```js\n// array of students\n[\n {\n \"title\": \"Relational Databases\",\n \"instructor\": \"Sean Quentin Lewis\",\n \"name\": \"Rebecca Heineman\",\n \"score\": 71,\n \"grade\": \"C\"\n }\n// students in courses...\n]\n```\n\nTo be safe, let's now work on the original data set. Notice how it is structured differently.\n\n```js\n// array of courses\n[\n {\n \"title\": \"Relational Databases\",\n \"instructor\": \"Sean Quentin Lewis\",\n \"students\": [\n {\n \"name\": \"Rebecca Heineman\",\n \"score\": 71,\n \"grade\": \"C\"\n }\n // students...\n ]\n }\n // courses...\n]\n```\n\nIn this data set, there is an array of students within an array of courses. So how can we recreate our original array of students from the courses? We can use `concat`.\n\nWeird things happen when you start combining arrays. `concat` brings sanity.\n\n```js\n[1, 2] + [3, 4];\n//> \"1, 23, 4\"\n\n[1, 2].push([3, 4]);\n//> 3\n\n[1, 2].join([3, 4]);\n//> \"13, 42\"\n\n[1, 2].concat([3, 4]);\n//> [1, 2, 3, 4]\n```\n\nUnfortunately, Javascript is missing a built in array method to concat multiple arrays together: let's call it `flatten` (often called `concatAll`). `flatten` should loop over an array and concat each element.\n\n```js\nvar start = [{\n a: 1,\n c: [\n { b: 1 }\n ]\n}, {\n a: 2,\n c: [\n { b: 2 }, { b: 3 }\n ]\n}];\n\nvar middle = start.map(function(outer) {\n return outer.c.map(function(inner) {\n return {\n a: outer.a,\n b: inner.b\n };\n });\n});\n//> [ [{ a: 1, b: 1 }], [{a: 2, b: 2}, {a: 2, b: 3}] ]\n\nvar end = pre.flatten();\n//> [{a: 1, b: 1}, {a: 2, b: 2}, {a: 2, b: 3}]\n```\n\nBack to business.\n\nWe have a suspect in mind: a classmate named \"Hack Kerr\". He's a nice guy, and he's always been friendly to you - but there's something suspicious about him: his name.\n\nFirst let's recreate our student array of data from the course data.", |
| 257 | + "tasks": [ |
245 | 258 | {
|
246 | 259 | "description": "First, test out `flatten` on the `flattenedArray`\n@open('06-concat.js')",
|
247 | 260 | "tests": [
|
|
0 commit comments