0
1
00:00:00,240 --> 00:00:06,450
Now what about methods? Let's say that our bellboy is able to do something called moveSsuitcase.
1

2
00:00:06,450 --> 00:00:11,370
Now, I've kind of simplified it here, but it's effectively, he creates an alert saying "May I take your
2

3
00:00:11,370 --> 00:00:11,990
suitcase?",
3

4
00:00:12,030 --> 00:00:15,630
and then he picks up the suitcase and then he moves with the suitcase.
4

5
00:00:15,630 --> 00:00:21,690
Now this is a function because at the moment it's not attached to an object but in our previous syntax
5

6
00:00:21,990 --> 00:00:29,850
if we wanted our object to also have an associated function, then all we have to do is provide the name
6

7
00:00:30,180 --> 00:00:33,250
of the function as a new parameter,
7

8
00:00:33,390 --> 00:00:38,460
and then colon, and then after the colon we just put in the anonymous function.
8

9
00:00:38,550 --> 00:00:46,980
And now our bellBoy1 has a method, which remember is just a function that's associated with an object.
9

10
00:00:46,980 --> 00:00:52,890
And if we had a suitcase in the lobby then we can simply call the method and say bellBoy1.moveSuitcase(),
10

11
00:00:52,890 --> 00:00:56,010
and perform that method.
11

12
00:00:56,250 --> 00:01:02,970
So remember that when we're using the properties or calling a method we're always using the dot notation.
12

13
00:01:03,300 --> 00:01:08,470
And the only difference that you see between the method and the property are those parentheses,
13

14
00:01:08,520 --> 00:01:09,990
so keep an eye out for those.
14

15
00:01:09,990 --> 00:01:15,510
Now if we wanted to incorporate this method into our constructor function then all we have to write
15

16
00:01:15,540 --> 00:01:16,260
is 
16

17
00:01:16,320 --> 00:01:21,710
this.moveSuitcase is equal to a function that does these and these things.
17

18
00:01:21,750 --> 00:01:27,750
And now when we create any object using this constructor function, then all of those objects will have
18

19
00:01:27,750 --> 00:01:31,640
that function of moveSuitcase, and they'll all be able to do that.
19

20
00:01:31,770 --> 00:01:37,240
So as a challenge I want you to add a method to our HouseKeeper constructor function,
20

21
00:01:37,320 --> 00:01:43,290
and this method is just called clean, so that we can get the housekeeper to perform the clean function.
21

22
00:01:43,620 --> 00:01:49,320
And we're going to do it in a simplified way so that our method of what it does is sends an alert that
22

23
00:01:49,320 --> 00:01:51,630
says "Cleaning in progress".
23

24
00:01:51,660 --> 00:01:54,240
So add that to the constructor function,
24

25
00:01:54,240 --> 00:02:01,200
create a new housekeeper from that constructor function, and call the cleaning method associated with
25

26
00:02:01,200 --> 00:02:02,340
that new object.
26

27
00:02:02,340 --> 00:02:05,750
So pause the video now and see if you can complete this challenge.
27

28
00:02:07,480 --> 00:02:07,770
All right.
28

29
00:02:07,780 --> 00:02:14,470
So as we said before to create a new method or a new property, we first have to start with this.the name
29

30
00:02:14,470 --> 00:02:15,880
of the property or method.
30

31
00:02:15,910 --> 00:02:22,990
So our method is called clean and it's not equal to just any value but it's equal to a function and
31

32
00:02:22,990 --> 00:02:29,550
this function, as we said before, has to send an alert that says "Cleaning in progress".
32

33
00:02:29,560 --> 00:02:35,680
So now that we've got our method associated with our HouseKeeper constructor function, then we need to
33

34
00:02:35,680 --> 00:02:38,270
create new objects that have this method.
34

35
00:02:38,410 --> 00:02:45,370
So let's go ahead and again empty cache and hard reload, and let's run our new code, and then let's create
35

36
00:02:45,400 --> 00:02:54,520
a new object called houseKeeper1, which is equal to a new HouseKeeper, which has 12 years experience,
36

37
00:02:54,530 --> 00:03:00,790
he's called James, and he's only qualified to clean bedrooms.
37

38
00:03:01,000 --> 00:03:06,960
All right. So now let's hit enter and create our new object called houseKeeper1.
38

39
00:03:07,080 --> 00:03:11,390
Now houseKeeper1 now comes equipped with this method called clean.
39

40
00:03:11,560 --> 00:03:16,120
So we can simply say houseKeeper1.clean.
40

41
00:03:16,120 --> 00:03:22,030
And if we hit enter you can see that we get an alert that says "Cleaning in progress". Pretty good, right?
41

42
00:03:22,420 --> 00:03:29,530
Now at this point you might be getting a little bit of deja vu because it's looking pretty similar to
42

43
00:03:29,530 --> 00:03:31,570
something that we've written before.
43

44
00:03:31,630 --> 00:03:40,330
It looks almost exactly the same as these lines of code that we used to create a new audio
44

45
00:03:40,510 --> 00:03:45,860
and to play the audio, because we created a new variable that was called tom1,
45

46
00:03:46,120 --> 00:03:51,980
and it's a new audio object that is linked to this particular sound file,
46

47
00:03:52,330 --> 00:03:57,670
and then later on we used that object's method called play to play that sound.
47

48
00:03:57,670 --> 00:04:03,970
So even though we can't see the source code of this constructor function, but we could guess what it
48

49
00:04:03,970 --> 00:04:05,170
might look like.
49

50
00:04:05,200 --> 00:04:09,970
So the constructor function for this audio object might look something like this.
50

51
00:04:10,270 --> 00:04:14,980
So, as with all constructor functions, you start off with the keyword function and then you have the
51

52
00:04:14,980 --> 00:04:21,850
name of the object that it's going to construct with the first letter capitalized and then in between
52

53
00:04:21,850 --> 00:04:24,050
some parentheses we have some inputs.
53

54
00:04:24,130 --> 00:04:28,610
And in this case it's going to be the location of the file for that audio.
54

55
00:04:28,720 --> 00:04:35,170
So now our constructor makes a new property called file location which is set equal to the location
55

56
00:04:35,380 --> 00:04:39,770
that was given when this new audio object gets created.
56

57
00:04:39,940 --> 00:04:45,690
And then this constructor function also has an associated method called play,
57

58
00:04:46,060 --> 00:04:47,920
and this play function does a number of things,
58

59
00:04:47,920 --> 00:04:51,290
for example it might tap into the audio hardware of the computer,
59

60
00:04:51,340 --> 00:04:55,700
it might check whether the file at the file location specified exists,
60

61
00:04:55,750 --> 00:05:01,810
it might check that the file is actually a sound file, and then it might try and play that file at that
61

62
00:05:01,810 --> 00:05:02,780
location.
62

63
00:05:02,850 --> 00:05:10,780
And all we had to do was to use that constructor Audio to create a new audio object specifying the
63

64
00:05:10,780 --> 00:05:12,770
location of our audio file,
64

65
00:05:12,820 --> 00:05:19,690
then we simply called the method that was associated with that new audio object and got it to play that
65

66
00:05:19,690 --> 00:05:20,440
sound.
66

67
00:05:20,440 --> 00:05:26,260
Now a lot of the code that you'll be writing in Javascript involves using these properties and methods
67

68
00:05:26,500 --> 00:05:32,290
associated with the objects on your web site, and occasionally you also need to create your own objects
68

69
00:05:32,560 --> 00:05:35,530
in order to get some custom behavior on your web site.
69

70
00:05:35,530 --> 00:05:39,580
Now hopefully this lesson has helped you to understand what we've been writing
70

71
00:05:39,580 --> 00:05:46,000
when we created our audio objects and when we called our methods or when we used our properties in our
71

72
00:05:46,000 --> 00:05:53,020
drumkit web site. Now a lot of these concepts are quite abstract and it might take a little bit of repetition
72

73
00:05:53,290 --> 00:05:57,490
and coming back to it a few times in order for it to start making more sense.
73

74
00:05:57,490 --> 00:06:04,300
But as with all things programming as we get more practice using a lot of these concepts over time it
74

75
00:06:04,300 --> 00:06:09,320
will become more and more familiar to you and the puzzle pieces will start coming together.
75

76
00:06:09,490 --> 00:06:13,990
So don't worry if some of this stuff is going over your head. We're going to be revisiting this in the
76

77
00:06:13,990 --> 00:06:14,710
future
77

78
00:06:14,920 --> 00:06:20,490
as we keep building more and more web sites. But this is a great place to just sow the seeds about objects
78

79
00:06:20,500 --> 00:06:26,350
in Javascript, and hopefully you'll revisit this lesson a few more times and eventually getting really
79

80
00:06:26,350 --> 00:06:28,480
comfortable with this concept.