@@ -16,32 +16,33 @@ Imagine an exercise routine: every morning, we run 5 miles. But afterwards —
16
16
depending on the day — we might lift weights, go for a swim, or run an extra 5
17
17
miles.
18
18
19
- In programming-speak, we could write out a function for every day (follow along!):
19
+ In programming-speak, we could write out a function for every day (follow along
20
+ by writing out these examples in a REPL, or in the ` index.js ` file!):
20
21
21
22
``` js
22
23
function Monday () {
23
- console .log (' Go for a five-mile run' );
24
- console .log (' Pump iron' );
24
+ console .log (" Go for a five-mile run" );
25
+ console .log (" Pump iron" );
25
26
}
26
27
27
28
function Tuesday () {
28
- console .log (' Go for a five-mile run' );
29
- console .log (' Swim 40 laps' );
29
+ console .log (" Go for a five-mile run" );
30
+ console .log (" Swim 40 laps" );
30
31
}
31
32
32
33
function Wednesday () {
33
- console .log (' Go for a five-mile run' );
34
- console .log (' Go for a five-mile run' );
34
+ console .log (" Go for a five-mile run" );
35
+ console .log (" Go for a five-mile run" );
35
36
}
36
37
37
38
function Thursday () {
38
- console .log (' Go for a five-mile run' );
39
- console .log (' Pump iron' );
39
+ console .log (" Go for a five-mile run" );
40
+ console .log (" Pump iron" );
40
41
}
41
42
42
43
function Friday () {
43
- console .log (' Go for a five-mile run' );
44
- console .log (' Swim 40 laps' );
44
+ console .log (" Go for a five-mile run" );
45
+ console .log (" Swim 40 laps" );
45
46
}
46
47
```
47
48
@@ -52,7 +53,7 @@ What if we pull all of our five-mile runs into their own function?
52
53
53
54
``` js
54
55
function runFiveMiles () {
55
- console .log (' Go for a five-mile run' );
56
+ console .log (" Go for a five-mile run" );
56
57
}
57
58
```
58
59
@@ -61,15 +62,15 @@ same thing for lifting weights and swimming:
61
62
62
63
``` js
63
64
function liftWeights () {
64
- console .log (' Pump iron' );
65
+ console .log (" Pump iron" );
65
66
}
66
67
67
68
function swimFortyLaps () {
68
- console .log (' Swim 40 laps' );
69
+ console .log (" Swim 40 laps" );
69
70
}
70
71
```
71
72
72
- Awesome! We've cut down a little bit more: ` Monday() ` could now look like
73
+ Awesome! We've cut down a little bit more: ` Monday() ` could now look like:
73
74
74
75
``` js
75
76
function Monday () {
@@ -99,12 +100,17 @@ to use this new function we created in our `Monday()` function:
99
100
function Monday () {
100
101
exerciseRoutine (liftWeights);
101
102
}
103
+
104
+ function exerciseRoutine (postRunActivity ) {
105
+ runFiveMiles ();
106
+ postRunActivity ();
107
+ }
102
108
```
103
109
104
- Note that we aren't _ calling_ ` liftWeights ` . When we want to pass a function
105
- as a value, we pass it by _ reference_ by omitting the parentheses. We're not
106
- running the function at this point. It's up to ` exerciseRoutine() ` to call the
107
- function when it is needed.
110
+ Note that we aren't _ calling_ ` liftWeights ` . When we want to pass a function as
111
+ a value, we pass it by _ reference_ by omitting the parentheses at the end of the
112
+ function. We're not running the function at this point. It's up to
113
+ ` exerciseRoutine() ` to call the function when it is needed.
108
114
109
115
If we call ` Monday() ` , we'll see that we run five miles, and then we lift
110
116
weights — awesome!
@@ -130,8 +136,8 @@ defined beforehand! We can pass an _anonymous function_ to `exerciseRoutine()`.
130
136
To start with, let's use the full function syntax we've come to know and love:
131
137
132
138
``` js
133
- exerciseRoutine (function () {
134
- console .log (' Stretch! Work that core!' );
139
+ exerciseRoutine (function () {
140
+ console .log (" Stretch! Work that core!" );
135
141
});
136
142
137
143
// "Go for a five-mile run"
@@ -142,11 +148,11 @@ We can rewrite this to be more concise by using an arrow function:
142
148
143
149
``` js
144
150
exerciseRoutine (() => {
145
- console .log (' Stretch! Work that core!' );
151
+ console .log (" Stretch! Work that core!" );
146
152
});
147
153
148
154
// Or even shorter:
149
- exerciseRoutine (() => console .log (' Stretch! Work that core!' ));
155
+ exerciseRoutine (() => console .log (" Stretch! Work that core!" ));
150
156
```
151
157
152
158
Because we only need to use our function this one time, there's no need to give
@@ -170,20 +176,20 @@ function morningRoutine(exercise) {
170
176
let breakfast;
171
177
172
178
if (exercise === liftWeights) {
173
- breakfast = ' protein bar' ;
179
+ breakfast = " protein bar" ;
174
180
} else if (exercise === swimFortyLaps) {
175
- breakfast = ' kale smoothie' ;
181
+ breakfast = " kale smoothie" ;
176
182
} else {
177
- breakfast = ' granola' ;
183
+ breakfast = " granola" ;
178
184
}
179
185
180
186
exerciseRoutine (exercise);
181
187
182
188
// we could give this function a name if we wanted to, but since
183
189
// it's only available _inside_ morningRoutine(), we don't need to
184
- return function () {
190
+ return function () {
185
191
console .log (` Nom nom nom, this ${ breakfast} is delicious!` );
186
- }
192
+ };
187
193
}
188
194
```
189
195
@@ -210,7 +216,29 @@ If you haven't been following along, it's vitally important that you go back and
210
216
do so. First-class functions are one of JavaScript's most powerful features, but
211
217
it takes some practice for them to sink in.
212
218
219
+ ## Instructions
220
+
221
+ To get more practice with first-class functions, this lesson has three tests to
222
+ pass that require you to write the following functions in the ` index.js ` file:
223
+
224
+ - The ` receivesAFunction ` function should:
225
+
226
+ - take a _ callback function_ as an argument
227
+ - call the callback function
228
+ - it doesn't matter what this function returns, so long as it calls the
229
+ callback function
230
+
231
+ - The ` returnsANamedFunction ` function should:
232
+
233
+ - take no arguments
234
+ - return a _ named function_
235
+
236
+ - The ` returnsAnAnonymousFunction ` function should:
237
+ - take no arguments
238
+ - return an _ anonymous function_
239
+
213
240
## Resources
214
241
215
- - [ Wikipedia] ( https://en.wikipedia.org/wiki/First-class_function ) : [ First-class function] ( https://en.wikipedia.org/wiki/First-class_function )
216
- - [ JavaScript is Sexy] ( http://javascriptissexy.com/understand-javascript-callback-functions-and-use-them/#more-1037 ) : [ Higher-order functions] ( http://javascriptissexy.com/understand-javascript-callback-functions-and-use-them/#more-1037 )
242
+ - [ Wikipedia: First-class function] ( https://en.wikipedia.org/wiki/First-class_function )
243
+ - [ JavaScript is Sexy: Higher-order functions] ( http://javascriptissexy.com/understand-javascript-callback-functions-and-use-them/#more-1037 )
244
+ - [ MDN Function Expression (named vs anonymous functions)] ( https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/function )
0 commit comments