1
00:00:01,283 --> 00:00:04,372
What exactly is a prototype? The answer to

2
00:00:04,372 --> 00:00:06,055
that question isn't exactly simple. For

3
00:00:06,055 --> 00:00:08,236
starters, a prototype is an object that

4
00:00:08,236 --> 00:00:11,791
exists on every function in JavaScript. So

5
00:00:11,791 --> 00:00:15,474
notice if I create a function like this,

6
00:00:15,474 --> 00:00:19,629
then notice that is has a prototype

7
00:00:19,629 --> 00:00:20,970
property. So I'll save that, and you can

8
00:00:20,970 --> 00:00:23,597
see in our display in our browser that it

9
00:00:23,597 --> 00:00:25,394
displayed an empty object. So every

10
00:00:25,394 --> 00:00:27,945
function in JavaScript has a prototype

11
00:00:27,945 --> 00:00:29,600
property. And objects, while they do have

12
00:00:29,600 --> 00:00:33,126
a prototype, they do not have a prototype

13
00:00:33,126 --> 00:00:35,615
property. So if I create a new person

14
00:00:35,615 --> 00:00:39,656
object and try to display its prototype,

15
00:00:39,656 --> 00:00:42,921
then notice that's undefined. You can see

16
00:00:42,921 --> 00:00:46,108
an object's prototype, however, by looking

17
00:00:46,108 --> 00:00:50,157
at the __proto property. So if I save

18
00:00:50,157 --> 00:00:52,094
that, notice that it is also an empty

19
00:00:52,094 --> 00:00:54,228
object. But an object's prototype and a

20
00:00:54,228 --> 00:00:55,796
function prototype are used differently,

21
00:00:55,796 --> 00:00:58,136
so let's provide a couple of definitions

22
00:00:58,136 --> 00:01:00,779
that we can work with going forward. These

23
00:01:00,779 --> 00:01:02,302
might not make a lot of sense now, but

24
00:01:02,302 --> 00:01:05,898
they will once we provide a few examples.

25
00:01:05,898 --> 00:01:07,877
A functions prototype is the object

26
00:01:07,877 --> 00:01:09,495
instance that will become the prototype

27
00:01:09,495 --> 00:01:11,551
for all objects created using this

28
00:01:11,551 --> 00:01:14,136
function as a constructor. An object's

29
00:01:14,136 --> 00:01:16,755
prototype, however, is the object instance

30
00:01:16,755 --> 00:01:19,417
from which the object is inherited. It's

31
00:01:19,417 --> 00:01:20,838
important to take note of the word

32
00:01:20,838 --> 00:01:23,709
instance in those definitions. A

33
00:01:23,709 --> 00:01:24,428
prototype, whether it's a functions

34
00:01:24,428 --> 00:01:27,319
prototype or an object's prototype, is

35
00:01:27,319 --> 00:01:29,245
actually an instance of an object in

36
00:01:29,245 --> 00:01:32,281
memory. So when a function is created, a

37
00:01:32,281 --> 00:01:33,964
new prototype object is created in memory

38
00:01:33,964 --> 00:01:35,927
an attached to the function behind the

39
00:01:35,927 --> 00:01:37,914
scenes. If that function is then used as a

40
00:01:37,914 --> 00:01:40,549
constructor function with the new keyword,

41
00:01:40,549 --> 00:01:43,649
the new object that is created has a proto

42
00:01:43,649 --> 00:01:45,779
property that is pointing to the same

43
00:01:45,779 --> 00:01:48,079
object in memory that is the function's

44
00:01:48,079 --> 00:01:49,761
prototype. This is much easier to

45
00:01:49,761 --> 00:01:52,695
understand in code, so let's take a look

46
00:01:52,695 --> 00:01:57,604
at an example. So let's create a Person

47
00:01:57,604 --> 00:01:59,559
constructor function. And to start with,

48
00:01:59,559 --> 00:02:04,317
let's look at this function's prototype.

49
00:02:04,317 --> 00:02:06,277
Okay, you can see that it is a person

50
00:02:06,277 --> 00:02:08,486
object, or in other words, it's just an

51
00:02:08,486 --> 00:02:11,657
empty object right now, and it's type is

52
00:02:11,657 --> 00:02:14,041
person. Now let's create a new person from

53
00:02:14,041 --> 00:02:19,012
that constructor function. Now let's look

54
00:02:19,012 --> 00:02:22,532
at Jim's prototype. It is also an empty

55
00:02:22,532 --> 00:02:24,833
object of type person. And notice if we

56
00:02:24,833 --> 00:02:26,662
compare them, they're actually the same

57
00:02:26,662 --> 00:02:29,331
instance. So if I save this, they are

58
00:02:29,331 --> 00:02:30,713
equal, and if you remember from our

59
00:02:30,713 --> 00:02:32,605
earlier discussion about equality, if two

60
00:02:32,605 --> 00:02:34,741
objects are equal, they are actually the

61
00:02:34,741 --> 00:02:37,652
exact same object instance in memory. You

62
00:02:37,652 --> 00:02:39,825
can actually see that if I change one of

63
00:02:39,825 --> 00:02:42,147
them. So let's change the person

64
00:02:42,147 --> 00:02:44,286
function's prototype. So we'll add an age

65
00:02:44,286 --> 00:02:46,905
property to the prototype, and if I save

66
00:02:46,905 --> 00:02:50,329
that, you can see that while I only change

67
00:02:50,329 --> 00:02:52,308
the prototype for the person function, it

68
00:02:52,308 --> 00:02:53,855
is also reflected in Jim's prototypes,

69
00:02:53,855 --> 00:02:56,138
since they are the same object. And the

70
00:02:56,138 --> 00:02:58,685
same holds true if I create another

71
00:02:58,685 --> 00:03:02,152
instance of person. So let's create a

72
00:03:02,152 --> 00:03:05,457
Sofia person, and if we display Sofia's

73
00:03:05,457 --> 00:03:08,980
prototype, they all look the same. And

74
00:03:08,980 --> 00:03:11,779
just to demonstrate this a little further,

75
00:03:11,779 --> 00:03:16,696
let's actually change the age of Sofia's

76
00:03:16,696 --> 00:03:18,945
proto object. There, notice that in our

77
00:03:18,945 --> 00:03:21,175
display, the ages of all of these objects

78
00:03:21,175 --> 00:03:24,990
changed to 19, so they are truly the same

79
00:03:24,990 --> 00:03:26,983
object in memory. So the object instance

80
00:03:26,983 --> 00:03:29,173
that is the function's prototype becomes

81
00:03:29,173 --> 00:03:34,000
the prototype for all objects created from that prototype.

