1
00:00:00,456 --> 00:00:02,560
What is a callback?

2
00:00:02,560 --> 00:00:08,980
A callback is function like any other, but
it's what you do with it that's different.

3
00:00:08,980 --> 00:00:11,650
Instead of calling the function manually,

4
00:00:11,650 --> 00:00:16,400
you're passing the name of the function
to another function to execute.

5
00:00:16,400 --> 00:00:18,680
Here, we have two functions.

6
00:00:18,680 --> 00:00:22,900
One called callbackFunction and
another called executeCallback.

7
00:00:22,900 --> 00:00:26,840
Both have the word callback in their
names, but they don't need to.

8
00:00:26,840 --> 00:00:30,300
They're just the names that describe
what the functions are or do.

9
00:00:30,300 --> 00:00:36,140
The callbackFunction is a regular function
that could have any functionality inside.

10
00:00:36,140 --> 00:00:38,600
The executeCallback function will,

11
00:00:38,600 --> 00:00:43,060
at some point in the future,
execute or call the callback.

12
00:00:43,060 --> 00:00:45,950
How do you pass in a parameter
into another function?

13
00:00:45,950 --> 00:00:50,830
Simply, pass in the name of the function
you want to use as a callback.

14
00:00:50,830 --> 00:00:53,060
Notice there's no parentheses.

15
00:00:53,060 --> 00:00:58,840
Remember, we are not calling the function,
we want the computer to.

16
00:00:58,840 --> 00:01:03,020
But we have to tell the computer the name
of the function it should execute.

17
00:01:03,020 --> 00:01:07,100
When you declare a function with a name,
like callbackFunction,

18
00:01:07,100 --> 00:01:10,510
you are giving it the variable
name of callbackFunction.

19
00:01:10,510 --> 00:01:12,890
Creating a callbackFunction variable and

20
00:01:12,890 --> 00:01:18,480
setting the same functionality to that
variable is functionally identical

21
00:01:18,480 --> 00:01:22,640
to declaring a function with
the callbackFunction name.

22
00:01:22,640 --> 00:01:24,280
If you're unfamiliar with this syntax,

23
00:01:24,280 --> 00:01:27,530
we'll be covering this
a lot more in depth later.

24
00:01:27,530 --> 00:01:31,500
The simple rule, when using
a function as a callbackFunction is

25
00:01:31,500 --> 00:01:36,330
don't use parentheses when passing in
the function into another function.

26
00:01:36,330 --> 00:01:40,440
It's often said that functions
are first class objects in JavaScript.

27
00:01:40,440 --> 00:01:44,159
This is a fancy way of saying functions
can be used like other variables.

28
00:01:44,159 --> 00:01:48,398
A function can be used as an argument,
just like a string,

29
00:01:48,398 --> 00:01:51,515
number, Boolean, or object.

30
00:01:51,515 --> 00:01:54,765
You wouldn’t put parenthesis
after a variable name.

31
00:01:54,765 --> 00:01:56,135
You don’t with a callback.

32
00:01:57,145 --> 00:02:00,245
Let’s look at some examples of callbacks.

33
00:02:00,245 --> 00:02:04,255
I've got some sample code that
shows some fictitious functions and

34
00:02:04,255 --> 00:02:06,980
callbacks for illustrative purposes.

35
00:02:06,980 --> 00:02:12,160
The first line of code will show a hint
when a user clicks on a text field.

36
00:02:12,160 --> 00:02:14,906
Can you see which function
would be a call back?

37
00:02:14,906 --> 00:02:19,864
showHint has no parentheses and
that's what you'd want to invoked or

38
00:02:19,864 --> 00:02:22,142
called when the click happens.

39
00:02:22,142 --> 00:02:24,996
The second line has similar functionality,
so

40
00:02:24,996 --> 00:02:29,130
what we'll be doing in one of
our projects, creating a clock.

41
00:02:29,130 --> 00:02:32,960
Every second,
the clock will update the hands and time.

42
00:02:32,960 --> 00:02:37,235
You should be getting a handle of
seeing what a callback function is now.

43
00:02:37,235 --> 00:02:41,620
tickClock is the callback function here,
it has no parentheses.

44
00:02:41,620 --> 00:02:44,320
The final line of code has two parameters.

45
00:02:44,320 --> 00:02:46,777
It's a function that reads a filename and

46
00:02:46,777 --> 00:02:49,895
then a callback will print
the contents of the file.

47
00:02:49,895 --> 00:02:53,610
Callbacks don't have to be
the first parameter of a function,

48
00:02:53,610 --> 00:02:56,080
it can be anywhere in the function call.

49
00:02:56,080 --> 00:02:58,926
In this case, it's the second parameter.

50
00:02:58,926 --> 00:03:01,890
Now that you've seen what
a callback function looks like,

51
00:03:01,890 --> 00:03:05,755
let's create our own callback and
a function that will invoke our callback.