1 00:00:00,390 --> 00:00:01,170 Hey, guys. 2 00:00:01,170 --> 00:00:02,190 Good to see you back. 3 00:00:02,220 --> 00:00:05,670 This is the second tutorial related to object oriented programming. 4 00:00:06,030 --> 00:00:12,270 And as you can see side by side, I opened my Visual Studio Code editor and my browser using lib server 5 00:00:12,270 --> 00:00:18,230 extension, and I already created an HTML document name index dot HTML. 6 00:00:18,240 --> 00:00:21,750 So inside the script tag first I'm going to create a class. 7 00:00:21,750 --> 00:00:27,660 To create a class in JavaScript we need to use class keyword class. 8 00:00:27,660 --> 00:00:31,530 Then we need to set the class name and our class name is hello. 9 00:00:32,430 --> 00:00:36,990 Then inside the curly braces here I'm going to pass a message. 10 00:00:36,990 --> 00:00:39,660 Basically I'm going to define a method named message. 11 00:00:39,660 --> 00:00:44,760 So I'm going to type message round braces. 12 00:00:45,180 --> 00:00:55,920 Then inside the curly braces here I'm going to print console dot log inside the round braces. 13 00:00:55,950 --> 00:00:58,710 Inside the double quotes I'm going to print a message. 14 00:00:58,710 --> 00:00:59,970 Hello everyone. 15 00:01:03,390 --> 00:01:06,000 And then semicolon to in this line. 16 00:01:06,000 --> 00:01:11,430 So whenever user call this method from this class then it's going to print this message. 17 00:01:11,460 --> 00:01:12,510 Hello everyone. 18 00:01:13,080 --> 00:01:18,900 And as I told you to call this method from this class we create an object using this class. 19 00:01:18,900 --> 00:01:28,200 So let's create an object using this class let and our variable name is a a equal to. 20 00:01:28,230 --> 00:01:33,000 To create an object we need to use new keyword new. 21 00:01:33,180 --> 00:01:36,390 Then we need to call the class name. 22 00:01:36,390 --> 00:01:37,050 Hello. 23 00:01:38,790 --> 00:01:43,830 Now a variable becomes an object which is made with hello class. 24 00:01:45,070 --> 00:01:47,430 And now I want to call message method. 25 00:01:47,440 --> 00:01:54,030 For that we need to type a dot message and semicolon too. 26 00:01:54,040 --> 00:01:58,240 In this line if I save this file, as you can see in my console, it print. 27 00:01:58,270 --> 00:01:59,440 Hello everyone. 28 00:01:59,680 --> 00:02:00,940 Now you understand. 29 00:02:00,940 --> 00:02:02,500 First we need to create a class. 30 00:02:02,500 --> 00:02:05,260 Then inside this class we have a method named message. 31 00:02:05,260 --> 00:02:10,600 If we want to call this method then first you need to create an object using this class. 32 00:02:10,630 --> 00:02:11,860 In our case A. 33 00:02:12,130 --> 00:02:15,040 Then you can call this method from this class. 34 00:02:15,310 --> 00:02:21,760 Now let's talk about more about methods in JavaScript we have total three types of methods. 35 00:02:21,940 --> 00:02:29,740 Our first method is constructor method, second one is prototype method and third one is static method. 36 00:02:29,950 --> 00:02:33,250 And we are going to start with constructor method. 37 00:02:33,520 --> 00:02:37,690 To create an constructor method, we don't need to take any constructor name. 38 00:02:37,690 --> 00:02:39,000 Let me show you how. 39 00:02:39,010 --> 00:02:42,130 So here I'm going to create a constructor method. 40 00:02:42,130 --> 00:02:48,760 For that just we need to type only construct our constructor round braces. 41 00:02:48,760 --> 00:02:53,290 And inside the curly braces you can pass your message. 42 00:02:53,290 --> 00:03:02,380 Suppose here I'm going to type console dot log inside the round braces I'm going to type welcome. 43 00:03:04,630 --> 00:03:06,640 And semicolon too in this line. 44 00:03:07,300 --> 00:03:10,180 And remember to create and constructor method. 45 00:03:10,180 --> 00:03:14,560 You don't need to take any name just you need to type constructor keyword. 46 00:03:14,590 --> 00:03:17,940 Now the question is what is the purpose of this method. 47 00:03:17,950 --> 00:03:24,850 Whenever we create an object using this class, then constructor method automatically called. 48 00:03:24,970 --> 00:03:28,660 We don't need to call it by ourselves, it automatically run. 49 00:03:28,900 --> 00:03:36,880 Now if I comment out this line and save this file again, now you can see it automatically run the constructor 50 00:03:36,880 --> 00:03:37,300 method. 51 00:03:37,300 --> 00:03:39,400 So it's print welcome here. 52 00:03:39,490 --> 00:03:41,530 Just create an object using this class. 53 00:03:41,530 --> 00:03:44,760 But I do not call the particular any method. 54 00:03:44,770 --> 00:03:48,400 Similarly if I create another object using the same class. 55 00:03:48,400 --> 00:03:49,930 So I'm going to duplicate this line. 56 00:03:49,930 --> 00:03:53,560 And here I'm going to type B and save this file. 57 00:03:53,710 --> 00:03:57,280 After save this file as you can see again it print welcome in our console. 58 00:03:57,520 --> 00:04:01,540 First it run for a object then it run for B object. 59 00:04:01,540 --> 00:04:03,820 And now we are going to learn about properties. 60 00:04:03,820 --> 00:04:07,510 And also we are going to learn how we can assign value in properties. 61 00:04:07,510 --> 00:04:10,060 There is two option that we can do it. 62 00:04:10,060 --> 00:04:12,340 First I'm going to show you a basic method. 63 00:04:12,340 --> 00:04:13,980 So I'm going to remove this line. 64 00:04:13,990 --> 00:04:15,370 Listen carefully. 65 00:04:15,400 --> 00:04:22,270 Whenever we need to declare an property to an class we need to declare it inside the constructor method. 66 00:04:22,270 --> 00:04:25,150 Suppose I want to declare a variable. 67 00:04:25,180 --> 00:04:27,730 Properties are basically a variable, nothing else. 68 00:04:27,730 --> 00:04:32,980 So I'm going to declare a property late and our property name is name. 69 00:04:32,980 --> 00:04:34,690 Then semicolon to end the line. 70 00:04:34,690 --> 00:04:36,460 So here we declare a property. 71 00:04:36,460 --> 00:04:42,760 And now I want to use this property I want to use this property in our message method. 72 00:04:42,760 --> 00:04:44,500 So I'm going to remove everyone. 73 00:04:44,770 --> 00:04:47,620 And here I'm going to use concatenation sign. 74 00:04:47,620 --> 00:04:49,390 Also you can use Backticks here. 75 00:04:49,480 --> 00:04:54,730 If you are familiar with template string method then I want to call name variable. 76 00:04:54,730 --> 00:04:57,070 For that we need to use this keyword. 77 00:04:58,210 --> 00:05:02,470 This means the object dot name. 78 00:05:02,710 --> 00:05:04,780 Now we set a property in this class. 79 00:05:04,780 --> 00:05:08,410 Also we use this property but we do not send any value. 80 00:05:09,130 --> 00:05:12,310 Now we need to set a value to this property. 81 00:05:12,310 --> 00:05:13,600 So how we can do it? 82 00:05:13,630 --> 00:05:23,350 For that we need to use the object name in our case a a and I want to say it name name assign with and 83 00:05:23,350 --> 00:05:30,460 here you can pass the student name which is Edward means and then semicolon to in this line. 84 00:05:30,460 --> 00:05:36,010 And now again I want to print the message in my console. 85 00:05:37,100 --> 00:05:41,180 So I'm going to uncomment this line and save this file. 86 00:05:41,330 --> 00:05:47,450 After save this file, as you can see in my console now it's print hello at one means if I provide a 87 00:05:47,450 --> 00:05:50,810 little space and save again now you can see it correctly. 88 00:05:50,840 --> 00:05:56,780 Hello at one means with that also you can see another message from our constructor method. 89 00:05:56,780 --> 00:06:00,020 And as I told you, we don't need to call constructor method. 90 00:06:00,020 --> 00:06:03,500 It's automatically run when we create an object using this class. 91 00:06:03,500 --> 00:06:08,030 And there is another shortcut that we can assign value to our properties. 92 00:06:08,030 --> 00:06:12,320 For that here we need to take a parameter in our constructor method. 93 00:06:12,530 --> 00:06:15,440 So I'm going to take a name as parameter. 94 00:06:16,040 --> 00:06:21,590 And I'm going to assign a name to this variable is name. 95 00:06:21,860 --> 00:06:27,080 And now we don't need to create this line to assign this value to this variable. 96 00:06:27,350 --> 00:06:29,210 So I'm going to comment out this line. 97 00:06:29,210 --> 00:06:32,960 And from here I'm going to copy add one means. 98 00:06:32,990 --> 00:06:38,840 And whenever we create an object using this class we can pass the value. 99 00:06:38,930 --> 00:06:40,490 It's like a function. 100 00:06:40,850 --> 00:06:44,330 So if I save this file you can see the same result. 101 00:06:44,720 --> 00:06:50,780 Oops I think I did some mistake because here we don't need to declare that keyword. 102 00:06:50,780 --> 00:06:52,340 So I'm going to remove late. 103 00:06:53,090 --> 00:07:00,920 This time I'm going to use this keyword, this dot name this keyword represent the object. 104 00:07:01,250 --> 00:07:08,480 So if I save this file now you can see now it's print hello at one means it's pretty similar with function 105 00:07:08,480 --> 00:07:09,260 is not it. 106 00:07:09,260 --> 00:07:10,340 Yes it is. 107 00:07:10,370 --> 00:07:14,360 Here you can define multiple properties as much you want. 108 00:07:14,390 --> 00:07:17,570 Now let's talk about prototype method. 109 00:07:17,870 --> 00:07:20,360 This is the example of prototype method. 110 00:07:20,450 --> 00:07:24,560 For that you need to take the method name and prototype method. 111 00:07:24,560 --> 00:07:26,120 Do not run automatically. 112 00:07:26,150 --> 00:07:28,730 To run this prototype method we need to call it. 113 00:07:28,730 --> 00:07:31,580 And our last method is static method. 114 00:07:31,610 --> 00:07:35,570 To create static method we need to use static keyword. 115 00:07:35,570 --> 00:07:36,620 Let me show you. 116 00:07:36,620 --> 00:07:39,830 So here I'm going to create a method which is static method. 117 00:07:39,830 --> 00:07:41,570 So I'm going to type static. 118 00:07:41,600 --> 00:07:44,450 Then we need to take a method name. 119 00:07:44,450 --> 00:07:46,820 In our case our method name is full name. 120 00:07:48,830 --> 00:07:51,200 Then we need to use round braces. 121 00:07:51,650 --> 00:08:00,440 Then inside the curly braces you can print anything document dot write inside the round braces. 122 00:08:00,470 --> 00:08:01,970 Inside the double quotes. 123 00:08:02,030 --> 00:08:03,710 Student name is Add1 means. 124 00:08:06,770 --> 00:08:11,630 And now you decide you are going to call the static method from this object. 125 00:08:11,630 --> 00:08:17,340 So let's call this static method a dot full name semicolon. 126 00:08:17,360 --> 00:08:18,050 Do in this line. 127 00:08:18,710 --> 00:08:21,260 If I save this file, it's not going to work. 128 00:08:21,260 --> 00:08:22,700 It's going to throw an error. 129 00:08:22,700 --> 00:08:23,570 Yes. 130 00:08:23,750 --> 00:08:26,600 We don't need to create an object to call a static method. 131 00:08:26,990 --> 00:08:30,740 We can call static method without creating a object. 132 00:08:30,770 --> 00:08:34,580 To call this static method we need to use the class name in our case. 133 00:08:34,580 --> 00:08:35,090 Hello. 134 00:08:35,090 --> 00:08:36,890 So let me show you how we can use it. 135 00:08:36,890 --> 00:08:39,740 So here I'm going to type our class name. 136 00:08:39,740 --> 00:08:45,080 Hello dot full name function then semicolon to in this line. 137 00:08:45,080 --> 00:08:47,690 If I save this file you can see the result. 138 00:08:47,690 --> 00:08:52,760 As you can see in my browser now it calls the static method and print student name is add. 139 00:08:52,760 --> 00:08:53,600 One means. 140 00:08:53,630 --> 00:08:57,290 As I told you, class is a blueprint, otherwise a template. 141 00:08:57,320 --> 00:09:01,010 We can use class multiple times to create objects. 142 00:09:01,010 --> 00:09:03,050 So this is it for this tutorial. 143 00:09:03,080 --> 00:09:04,730 Thanks for watching this video. 144 00:09:04,730 --> 00:09:06,590 Stay tuned for the next tutorial. 145 00:09:06,590 --> 00:09:10,010 In the next tutorial we are going to learn about inheritance.