WEBVTT 00:01.800 --> 00:05.700 You already know how to create objects using a literal or new operator. 00:05.970 --> 00:10.860 And now I want to introduce another way to create objects using objects that create method. 00:11.790 --> 00:17.520 This method allows us to create object and at the same time, it allows us to define for the object. 00:17.820 --> 00:22.940 The prototype that we want objects to create is a method of a global object. 00:22.950 --> 00:26.880 And in order to prove that, let's go to Brackett's. 00:27.960 --> 00:35.670 I'm going to use a new method called Castledare, which allows us to display list of properties and 00:35.670 --> 00:37.320 methods of the specified object. 00:37.830 --> 00:38.130 So. 00:38.130 --> 00:39.960 Right, Castle Dot, dear. 00:42.450 --> 00:46.350 And inside the parentheses, that's right, the global object. 00:49.460 --> 00:58.340 Then reload and we have here the object function, if we expand it, you will see here a bunch of methods 00:58.340 --> 01:05.390 and some of the properties and here at the beginning we have our mentioned method create. 01:06.980 --> 01:07.460 All right. 01:08.210 --> 01:13.760 Let's get rid of council doctor and create the variable, the object one. 01:16.050 --> 01:19.120 As we have just seen, create is a method of global object. 01:19.140 --> 01:25.650 Therefore, we need to right at first object and then attach to it create method. 01:28.450 --> 01:34.840 Object and create takes two parameters as a first parameter, we need to define the prototype that we 01:34.840 --> 01:41.360 want to connect to our object, and you need to remember that passing this parameter is mandatory. 01:42.160 --> 01:42.400 So. 01:42.400 --> 01:42.820 Right. 01:43.900 --> 01:45.940 Object that prototype. 01:49.660 --> 01:57.880 The second parameter is optional, and I'm going to omit it for now and now, let's see and cancel what 01:57.880 --> 01:58.770 we have, right. 01:58.780 --> 02:01.120 Cancel that log, object one. 02:05.810 --> 02:14.900 Reload, so we have here an empty object because we have missed second parameter, the exact same happens 02:15.200 --> 02:21.140 if we use empty color braces here as a second parameter. 02:24.180 --> 02:31.830 OK, if we drop down this empty object, we will get your global object functions prototype, it's because 02:31.830 --> 02:35.750 we have indicated it as a first parameter inside object. 02:35.760 --> 02:36.510 What great method. 02:37.560 --> 02:43.470 We can say that it's the same thing as an empty object created using literal notation. 02:45.310 --> 02:51.920 So right here for our object to and then log it in Castle as well. 02:51.930 --> 02:52.220 Right. 02:52.240 --> 02:54.420 Consider log object to. 02:57.670 --> 02:58.240 Revote. 03:00.850 --> 03:06.550 And you see that both of them have access on global object functions prototype. 03:07.930 --> 03:14.230 All right, let's remove these lines of code and now I'm going to show you how to add properties and 03:14.230 --> 03:16.630 methods to the newly created object. 03:17.360 --> 03:19.470 Of course, we can use dot notation. 03:20.860 --> 03:26.770 So if we write object, one dot name equals to John. 03:30.260 --> 03:37.200 Then reload will have your name property inside our object. 03:38.720 --> 03:43.970 There is another way to add properties and let's comment this line out. 03:44.780 --> 03:46.910 We can do it using second parameter. 03:47.960 --> 03:52.850 This way has kind of strange syntax, but it's the way how it works. 03:53.180 --> 03:54.950 So write your name. 03:57.380 --> 03:59.450 And here is a strange part. 03:59.810 --> 04:08.180 Instead of assigning the value simply, we need to create another object and then use a value property 04:08.180 --> 04:10.380 and then assign the actual value to it. 04:10.850 --> 04:12.510 So open Calabrese. 04:12.830 --> 04:13.340 All right. 04:13.940 --> 04:14.570 The value. 04:16.330 --> 04:16.720 John. 04:21.340 --> 04:25.840 Reload the page, and he said that we have the exact same result. 04:27.490 --> 04:32.670 All right, so you already know basically how object and create method works. 04:33.130 --> 04:39.160 As we said, we can connect newly created object to any of the objects, prototypes and let's see it 04:39.160 --> 04:40.680 with a function constructor. 04:41.830 --> 04:45.580 Let's remove these codes and create a function constructor. 04:45.760 --> 04:47.380 Right function person. 04:50.840 --> 04:55.220 That inside that club, racist, right, this that name. 04:57.520 --> 04:59.320 And as undervalued as John. 05:03.900 --> 05:12.930 No, I'm going to add new property to persons prototype object, so right here, person dot prototype. 05:15.890 --> 05:18.890 That's great equality, hello. 05:23.530 --> 05:30.250 OK, as first I'm going to create object using new operator in order to compare it to the object that 05:30.250 --> 05:39.190 will be created using object dot create method so right var person one equals to new person. 05:44.960 --> 05:55.100 Then use objects that create and create other objects, the person to equals objects create. 05:58.010 --> 05:59.510 And passed as a parameter. 06:02.640 --> 06:04.080 Person, not Prototyp. 06:08.030 --> 06:11.020 Let's log both objects in council, right? 06:11.360 --> 06:14.210 That log person one. 06:16.450 --> 06:18.430 And then person to. 06:20.540 --> 06:28.880 Reload and you see that we have two person objects, first one which is created using new operator and 06:28.880 --> 06:32.880 the second person object, which is created using objects, dot create method. 06:33.560 --> 06:37.400 Let's expand them and drop down. 06:37.970 --> 06:41.660 Underscore, underscore, Proteau, underscore, underscore properties as well. 06:43.520 --> 06:46.410 You see that in both cases we have great property. 06:47.150 --> 06:51.350 So it means that both objects have access and persons prototyp object. 06:51.890 --> 06:56.090 And of course both of them have access on global object functions prototype. 06:56.960 --> 07:01.010 But here we have one difference between those two person objects. 07:02.340 --> 07:08.490 The first one which was created using a new operator has named Property and the Value John, but the 07:08.490 --> 07:12.000 second one created using object, that great method doesn't have it. 07:13.410 --> 07:19.770 OK, so you already know that using object to create method, we can manually define the prototype for 07:19.770 --> 07:26.820 the created object, either the prototype of global object or function constructor, or even we can 07:26.820 --> 07:30.080 create other objects and pass it as a prototype of it. 07:30.990 --> 07:33.750 So it may sound confusing, but not sorry. 07:33.810 --> 07:40.170 I'm going to show you another example in order to explain it well that I'm going to create an object. 07:40.860 --> 07:41.100 Right? 07:41.220 --> 07:42.870 VAR first Crothall. 07:46.940 --> 07:49.910 Then right here, the method, say hello. 07:52.250 --> 07:54.230 Then anonymous function. 07:56.600 --> 07:59.450 And inside the the braces, right to return. 08:02.570 --> 08:03.080 Hello. 08:06.610 --> 08:10.090 Because of that, I'm going to use this entire object as a prototype. 08:10.600 --> 08:16.160 I want to use variable this and name, which will be the property of current object. 08:16.510 --> 08:20.160 So right here, plus this dot name. 08:22.540 --> 08:28.630 And now I'm going to create object and set for Proteau object as its prototype. 08:29.560 --> 08:30.070 Right. 08:30.070 --> 08:34.960 VAR John equals two object dot create. 08:38.580 --> 08:48.090 Pass here the first parameter, as we said, for Proteau object and then as the second parameter open 08:48.090 --> 08:50.880 here, Colonel Brice's right to name property. 08:53.860 --> 08:56.980 Then again, open coal prices, right value 08:59.620 --> 09:00.430 as John. 09:04.170 --> 09:07.650 That's Luggage and Council Rights Council, good luck, John. 09:11.630 --> 09:12.200 Without. 09:14.640 --> 09:21.210 Here we have objects with property name John, and if we check it's underscore, underscore, Proteau, 09:21.240 --> 09:28.440 underscore, underscore property will find there say hello method from First Proteau object because 09:28.440 --> 09:32.780 as you see, it is passed as a prototype for John object. 09:33.780 --> 09:41.220 So again, object dot create method gives us the ability to use manually created objects as prototypes. 09:42.770 --> 09:48.290 All right, in order to make our example more interesting, I'm going to create another object using 09:48.530 --> 09:49.800 object and create method. 09:50.180 --> 09:55.070 This object will be used as a prototype for another object, which will be created soon. 09:55.730 --> 10:00.750 And we will see kind and interesting prototype hierarchy. 10:01.250 --> 10:03.770 So right now, our second prototype. 10:06.560 --> 10:09.050 Equals to object dot create. 10:13.550 --> 10:19.640 And I'm going to pass as prototype the object that we have created, I mean, first Proteau. 10:21.750 --> 10:27.750 Then open the coal prices and at hear the method, say hi. 10:30.330 --> 10:33.390 Then we need to hear the value. 10:36.460 --> 10:42.340 As anonymous function and inside the call braces right return. 10:45.400 --> 10:48.460 Hi, plus this dark Nate. 10:51.920 --> 10:56.780 Let's say it in Castle, White Castle, Deathlok, Second Proteau. 11:01.530 --> 11:11.090 Reload, so here we have object with say hi method, and if we expand, underscore, underscore, Proteau, 11:11.100 --> 11:16.770 underscore, underscore property, we will find say hello method from First Proteau object. 11:18.420 --> 11:25.490 OK, and now the last thing that I'm going to do is to create another object and to assign to it as 11:25.500 --> 11:33.600 Prototyp Second Proteau object so right var blob equals to object. 11:33.600 --> 11:34.380 Thoughts create. 11:38.200 --> 11:43.150 Then as the first parameter, as we said, let's pass second Proteau. 11:47.300 --> 11:58.160 Then as the second parameter open cut prices and add in property and then the value as Bob. 12:01.250 --> 12:03.810 Again, let's see Castle, right, Castle? 12:03.830 --> 12:04.760 Good luck, Bob. 12:09.190 --> 12:09.760 Reload. 12:11.980 --> 12:13.860 So here we have object. 12:13.870 --> 12:20.950 Bob, let's drop down it and check the first underscore, underscore, Proteau, underscore, underscore 12:20.950 --> 12:21.420 property. 12:22.300 --> 12:29.340 Here we have Sagi method because the prototype of Bob Object is set as second Proteau object. 12:30.160 --> 12:35.920 If we expand another underscore, underscore, Proteau underscore, underscore property, then we will 12:35.920 --> 12:44.500 find say hello method from first Proteau object because it is set as a prototype for second Proteau 12:44.500 --> 12:44.920 object. 12:45.940 --> 12:50.680 And then finally we will reach to global object functions prototype. 12:52.560 --> 12:53.190 Makes sense. 12:54.980 --> 12:55.390 All right. 12:56.400 --> 13:03.300 I think it's not a very complicated topic, but again, I recommend you to think of other examples and 13:03.630 --> 13:08.430 test this method on your own, because it's the best way to learn more. 13:09.570 --> 13:12.800 So before we finish, I want to show one more thing. 13:13.350 --> 13:14.930 Let's create another object. 13:15.420 --> 13:27.900 So right below our object equals object, dot, create and as a parameter, let's pass here the null 13:27.900 --> 13:32.670 value and then check in council what we have. 13:32.670 --> 13:34.770 Right, cancel that log object. 13:38.550 --> 13:48.120 Reload, then drop down it, you see that our object is completely empty, it doesn't have underscore, 13:48.120 --> 13:50.460 underscore, Proteau underscore on the school property. 13:51.030 --> 13:56.970 It means that this object doesn't have connection with any of the prototype objects, and that's because 13:56.970 --> 13:58.500 of the null value. 14:00.210 --> 14:08.610 OK, so if we compare object of creative function, constructor method, both of them have some advantages 14:08.610 --> 14:12.470 and disadvantages which we actually have talked about already. 14:13.020 --> 14:19.830 Nowadays, function constructor is more popular and flexible, but regardless of that, you may come 14:19.830 --> 14:24.060 across the situations where you may need to use object that great method. 14:24.570 --> 14:26.850 So you have to know well how it works. 14:28.320 --> 14:29.900 All right, let's move on.