Skip to content

Commit 0577748

Browse files
committed
replaced gists with inline code
1 parent f58c3d2 commit 0577748

1 file changed

Lines changed: 35 additions & 8 deletions

File tree

‎Week4/Closures (class 10).md‎

Lines changed: 35 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2,31 +2,58 @@
22

33
Below is a stripped down, simplified version of the closure example we used during the lecture.
44

5-
<script src="https://gist.github.com/remarcmij/e9d86314ccbe9089be3b1646171c3b02.js"></script>
5+
```js
6+
function greetPerson(name) {
7+
function innerFunction(greeting) {
8+
return greeting + ', ' + name;
9+
};
10+
return innerFunction;
11+
}
12+
13+
const greetTimir = greetPerson('Timir');
14+
const timirGreeting = greetTimir('Good morning');
15+
console.log(timirGreeting);
16+
```
617

718
The `greetPerson` function (the "outer" function) contains another function inside its function body, called `innerFunction`. This inner function has access to the `name` argument of `greetPerson`, as well as its own `greeting` argument.
819

9-
In line 8 we call `greetPerson('Timir')`. The `greetPerson` function sets its `name` argument to the string `'Timir'` and then returns its inner function. This inner function **retains access to the `name` argument** and its value `'Timir'`, even after `greetPerson` exits.
20+
When we call `greetPerson('Timir')`, the `greetPerson` function sets its `name` argument to the string `'Timir'` and then returns its inner function. This inner function **retains access to the `name` argument** and its value `'Timir'`, even after `greetPerson` exits.
1021

1122
> Returning an inner function that accesses arguments and/or variables of its outer function creates (what we call) a **closure**.
1223
13-
In line 8 the return value of `greetPerson` (i.e. the inner function) is assigned to the variable `greetTimir`.
24+
The return value of `greetPerson` (i.e. the inner function) is subsequently assigned to the variable `greetTimir`.
1425

15-
In line 9 we are now calling effectively calling the inner function, as assigned the variable `greetTimir`, and passing it the string `'Good morning'`. The end result in line 10 is that we print to the console the message:
26+
With `greetTimir('Good morning')` we are now calling effectively calling the inner function, and passing it the string `'Good morning'`. The end result is that we print to the console the message:
1627

1728
```
1829
Good morning, Timir
1930
```
2031

21-
We could obtain the same result by scrapping lines 1-8 and replace it with the code below. We wouldn't be able to tell the difference from just looking at the output produced.
32+
We could obtain the same result by scrapping all lines except the last two and replace them with the code below. We wouldn't be able to tell the difference from just looking at the output produced.
33+
34+
```js
35+
function greetTimir(greeting) {
36+
const name = 'Timir';
37+
return greeting + ', ' + name;
38+
}
2239

23-
<script src="https://gist.github.com/remarcmij/2327c1fe2fe85d587df610a7f28f436e.js"></script>
40+
const timirGreeting = greetTimir('Good morning');
41+
console.log(timirGreeting);
42+
```
2443

2544
But with that alternative `greetTimir` function we can only greet Timir. In contrast, with the `greetPerson` function we can easily produce functions to greet any person we like (or don't like :wink:), e.g.:
2645

27-
<script src="https://gist.github.com/remarcmij/eb3971a655f61ded7384e9f1892e8cf4.js"></script>
46+
```js
47+
const greetMaartje = greetPerson('Maartje');
48+
const maartjeGreeting = greetMaartje('Hi there');
49+
console.log(maartjeGreeting);
50+
51+
const greetHasan = greetPerson('Hasan');
52+
const hasanGreeting = greetHasan('Have a good day');
53+
console.log(hasanGreeting);
54+
```
2855

29-
### Recommended additional reading:
56+
### Recommended further reading
3057

3158
[Eloquent JavaScript - Chapter 3: Functions](http://eloquentjavascript.net/03_functions.html) (Press Ctrl+F in your browser and search for the word 'closure')
3259

0 commit comments

Comments
 (0)