1
00:00:00,570 --> 00:00:04,710
Hi everyone you might have just noticed that the voice you're hearing is not close.

2
00:00:04,830 --> 00:00:06,460
So let me introduce myself.

3
00:00:06,540 --> 00:00:11,370
I'm Ali and I've worked with Colt for the past couple of years at a few coding tools in San Francisco

4
00:00:11,700 --> 00:00:17,550
and I'm really excited to teach you all some intermediate javascript in this video.

5
00:00:17,550 --> 00:00:20,160
We're going to be talking about the key word this.

6
00:00:20,250 --> 00:00:25,050
The key word this is a bit tricky to wrap your head around and learning intermediate javascript but

7
00:00:25,050 --> 00:00:30,390
it is the foundation for object oriented programming and other trickier concepts like call apply and

8
00:00:30,390 --> 00:00:34,640
bind which will cover in a later video to get started.

9
00:00:34,650 --> 00:00:37,800
We're going to try to understand what the key word this is.

10
00:00:38,040 --> 00:00:43,680
We're then going to analyze the four ways the key word this is determined so that we can always know

11
00:00:43,800 --> 00:00:46,020
what the value will be.

12
00:00:46,020 --> 00:00:51,210
Finally I'm going to try as hard as possible not to use the word this in a sentence.

13
00:00:51,210 --> 00:00:51,970
Here we go.

14
00:00:52,380 --> 00:00:54,550
So what is the key word this.

15
00:00:54,570 --> 00:01:01,140
First off it is a reserved keyword in javascript which means we can't set it as the value of any variable

16
00:01:01,140 --> 00:01:01,910
.

17
00:01:02,070 --> 00:01:06,910
More importantly the value of the keyword this is determined by how a function is called.

18
00:01:07,110 --> 00:01:10,170
We usually call this the function's execution context.

19
00:01:10,530 --> 00:01:16,230
But the most important thing about the keyword this is that if you understand the four rules of how

20
00:01:16,230 --> 00:01:24,060
the value of the keyword this can be determined global implicit explicit and new you will never have

21
00:01:24,060 --> 00:01:27,160
a problem with the keyword this.

22
00:01:27,240 --> 00:01:29,670
So let's get started with the most broad rule of them all.

23
00:01:29,670 --> 00:01:31,430
The global context.

24
00:01:31,580 --> 00:01:36,920
This rule applies when you see the keyword this outside of a declared object.

25
00:01:36,930 --> 00:01:38,590
What do I mean by declared object.

26
00:01:38,730 --> 00:01:39,960
Excellent question.

27
00:01:39,960 --> 00:01:46,280
What we mean here is that there has not been an object defined which contains the keyword this.

28
00:01:46,700 --> 00:01:48,390
You can also think of it as the keyword.

29
00:01:48,390 --> 00:01:52,700
This is in the wild when we see the keyword this in the global context.

30
00:01:52,920 --> 00:01:59,610
It's a value refers to the global object which in the browser is the window object.

31
00:01:59,640 --> 00:02:06,750
In fact every variable that you declare in the global scope is actually attached to the window object

32
00:02:06,750 --> 00:02:07,170
.

33
00:02:07,170 --> 00:02:10,130
Let's see what that looks like.

34
00:02:10,350 --> 00:02:16,260
I'm going to make a variable called person and also that equal to alley.

35
00:02:17,040 --> 00:02:24,750
Now this variable person is actually attached to the window object which means the window person is

36
00:02:24,750 --> 00:02:29,950
actually the same exact thing as this person variable that I need.

37
00:02:30,180 --> 00:02:36,540
Now that we have an idea of what the window object is let's come back to the keyword this on the first

38
00:02:36,540 --> 00:02:37,920
line we see the key word.

39
00:02:37,920 --> 00:02:39,360
This is in the wild.

40
00:02:39,360 --> 00:02:41,620
It is not inside of any object.

41
00:02:41,790 --> 00:02:42,990
So what's its value.

42
00:02:43,230 --> 00:02:43,920
You guessed it.

43
00:02:44,040 --> 00:02:46,960
Or maybe you just saw in the comment It's the window.

44
00:02:47,070 --> 00:02:54,510
Simple enough when the keyword this is outside of an object its value is the global object which in

45
00:02:54,510 --> 00:02:58,150
the case of the browser is the window object.

46
00:02:58,170 --> 00:02:59,840
So what have we learned so far.

47
00:02:59,880 --> 00:03:05,190
The key word this is a reserved keyword that can be determined using one of four rules.

48
00:03:05,190 --> 00:03:11,550
We saw a bit of the first rule which stated that when the keyword this is not inside of a declared object

49
00:03:11,940 --> 00:03:15,810
its value is the global object in the next video.

50
00:03:15,840 --> 00:03:19,780
We're going to see what happens when the keyword this is inside of a function.

51
00:03:19,940 --> 00:03:20,480
So either