 Okay, so hi guys, my name is Isaac, I actually just started to learn JavaScript a few months back, not more than a year. So one thing coming to my mind is for many meetups that I attended, they are too advanced for me because I'm a new learner. Is there anyone learning JavaScript just a few months ago or okay, I'm feeling stressed now. Okay, so I'm coming from a C sharp background and then just recently I have the thoughts to learn to do mobile apps. So the first technology come to my mind is React Native, it's very hot now. So when it come to my mind, I try to learn it and then I have to learn React.js and then eventually I have to learn JavaScript. So by learning the JavaScript, I go through a book, you don't know JS. I'm pretty sure many of you heard of it and then it's very advanced for me as a new learner and very complex. So then I stumble upon a very easy way, somebody just summarise everything for the object-oriented design in JavaScript. So I thought can share with some of you and beneficial for the new learners. So I'm currently a software engineer at Detract Systems. We are POD Solution Proof of Delivery. So we are targeting the logistic industry. So I'm currently doing React Native over there. Okay, so this is the quote that coming making fun of the bad class design. You wanted a banana but you got a gorilla holding the banana and the entire jungle, which clearly the very bad design. So which is why the first thing when I try to learn JavaScript, the first thing is I try to learn the object-oriented design. So today I'm going to present four common patterns. The first one is factory object creation pattern, second one is constructor pattern. The third one is pseudo-classical pattern and the fourth one is... I studied from this, you don't know JS, the author actually written this Olu. So object link to another object pattern. This is going to be a very high-level presentation. So for the first pattern, factory object creation pattern is also known as factory pattern. Basically, any function that return an object, we can call them as a factory design pattern. And it uses a factory function. As I say, any function that return an object, we can call it a factory function. And the objects will have the same properties including the state and behaviors. So this is an example. We have a function called makeGorilla and we explicitly returning an object with an attribute name, number of badana, and a showoff function. And then we declare a variable called john, a new object and then we call the function makeGorilla and then we call the function showoff and then do the console login. So for this pattern, there's some drawback. We cannot know how the object was created. For instance, we can't use the instance of, we can't use the get prototype of to know what is this object, like the john belongs to the makeGorilla class or the gorilla object. And the second drawback is they don't share the behaviors. What it means by that is john itself have a showoff pattern and rock itself have another showoff function. So which means that in a large system, if I have tens of thousands, in one jungle, I have a huge root of gorilla it's going to cost a lot of memory issue. And if space is a constant. So then introduce another pattern called constructor pattern. So basically constructor function is just a normal function when we call it with a new keyword in front of it. It's also known as constructor function. So when we call with a new keyword in front of the function there is a four key thing will happen. Immediately create a new object. This inside the function will be set as the new object. Function code execute within the new object execution context and it will implicitly return a new object. So take from the previous example. I have a function called gorilla. We can use this.name equals to name taking the parameter in and then here clearly we don't have any return keyword and then we declare the method called this.showoff. So then from the John, there is a new keyword in front of the gorilla with the parameter, with the attributes and then can do like John do showoff which essentially do the same thing. So now the difference is we can do the extra console logging like John instance of gorilla which return us through. So this is the solution for one of the drawback that I mentioned previously. We can check the type now. We can check the instance now. Okay, then we come to the third pattern, pseudo-classical pattern which is one of the consider advanced topic for me when I study this JavaScript is a prototyper delegation. So for this code example we have a function gorilla and basically it do nothing not to say do nothing we do the same thing as previously we have the name we have the number of banana but because the previous sorry I miss this point out for this pattern, constructor pattern if we can see we have a John, we have a rock but the showoff function itself it still exists in each of the John and the rock so it doesn't really solve the memory consumption problem as compared to the first one we only solve one of the drawback which is we can use the instance of now so for the third pattern is actually for us to solve the last drawback which is we can use the prototype we can call gorilla.prototype.showoff so now when we create a new object John and rock we can call the showoff method but the showoff method actually doesn't exist inside the John so it will perform a prototype look up along the chain and then it found inside the gorilla and then it work the function so this one the function only exist at one place instead of inside each and every individual object but it still give us a very class type look like you still somehow feeling because there is a new keyword in front of it and some there are many articles actually saying that year 6 class is actually very bad decision about having this class because it create more confusion and leads to many false assumption because as like me I'm coming from C sharp background so many thing I thought it works as same as the previous C sharp background is actually create a lot of confusion so the last pattern is actually introduced by the author or maybe not introduced by him I don't know it just mention in the book so it object link to other object pattern we don't use the new keyword we define a blueprint object and then we don't use the function to create the object so as you can see instead of using the function we declare the variable called gorilla and then we have a need attribute with a function so during the John when we try to create we use object to create and then we call any function to create the instance so but ya maybe I'll just finish this first okay so John do show off actually again ya it's just all the example is actually following the previous example so now we can actually instead of using the instance of we can also use object.getPrototypeOfJohn equals to gorilla equals to true ya so ya basically that's about it any questions since you guys are not not really a new learner actually I have some question to ask you guys actually to my opinion this one looks like class design to me because in the book they mention that a class design for the very classical class design we define a class then we create a new instance using a new keyword based on the class so the class is like a blueprint but to me this one looks like a blueprint for gorilla as well and then I just instead of using the new keyword do you think that my assumption is make sense? is it the same? or no? ya esx ya I know there is no class design ya I'm comparing this one with the classical class as in C sharp, jawa just to me right we usually we define the class for jawa we define the class first whenever we need to use it we declare a new instance ya for this one it looks definitely the same to me so you guys want to debate something about it sorry is that a question sorry did I miss something any other questions you guys wondering or any things you guys think there is something wrong with the pattern or the drawbacks or the dimensions so do you ever try to suppose something like inheritance and follow-up ya so of course inheritance in jawa script so I think it's using the prototype inheritance so prototyper delegation so since inheritance is just using the function bring so it's like a chain look up that's why in jawa script people favours this language is because there is this prototyper function where allows us to just you link from for what one object link to another object and then when we don't find attribute in it we can just look up to another object right ya ya ya it's a ya the function is now stay inside the gorilla as you see so if you really there is a function I don't remember the name we can check whether this attribute exist inside the john or exist inside the rock actually it doesn't ya for my field it's still in there ya so this one I don't think it's solve the memory concept ya ya oh it does sorry ya ya any other questions sorry maybe I'm just a new newbie and I thought the thoughts can target to some new learners but I didn't know so many experts around okay alright thank you