i think the onlu difference is that you can add/modify method using "constructrorname.prototype.newfunction" in constructor function but you cannot do this in factory function.
A factory function basically clones new copies of all object members defined in the object, in each object instance that is created - by default; whereas a constructor function only clones the members defined in the constructor. Lately I've been using an OOP framework that uses a singleton object as a class that contains only static methods. One of those static methods serves as a factory function for creating data objects that the class object can then manipulate. Static functions serve as prototypal functions by having a data object passed to it as an argument. So instead of using the traditional this keyword to reference instance objects, you use the instance argument passed. For example: let ClassObj = Object.create(null); ClassObj.newDataInstance = function(arg1, arg2) { return { property1: arg1, property2: arg2 }; }; ClassObj.setArg1 = function(instance, newArg1) { instance.arg1 = newArg1; }; But it can get a bit tiresome to always have to pass in an instance argument every time you want to work with instance data. So I've also toyed with the idea of having a static defaultIntance property in the Object so that when there is a series of consecutive calls involving the same instance you can use a function like this: ClassObj.withInstance = function(instance) { ClassObj.defaultInstance = instance; }; to initially lock on to a particular instance that will be used for the following instance calls without having to repeatedly enter an instance argument for each call. Now the setArg1 function would look like this: ClassObj.setArg1 = function(newArg1, instance = ClassObj.defaultyInstance || null) { instance.arg1 = newArg1; };
The best decision in my RUclips History was to subscribe to this Guy. His teaching method is just amazing. You should launch your own complete js course, why limit it to 20?😅
underrated channel! I'm watching 10 Things JS Developers Should Know and I'm loving it, you explain everything in such great detail and with nice humor too. TOP NOTCH QUALITY VIDEOS HERE. Keep it going man, I hope this channel gets more subs.
So funny, love how he doesn't just explain how to create constructors/functions but also gives practical examples of how and why the distinctions are important. Liked and subscribed.
The presentation is engaging, and the information provided is very valuable. The production quality is top-notch, and it's evident that a lot of effort went into creating this content. Keep up the great work!
Thanks for this tutorial series My key Takeaways from this video Factory functions, by default, create distinct copies of methods for each object, which can be memory intensive. Constructors, by using prototypes, share a single method instance among all objects, which is memory efficient. Constructors enable genuine inheritance, unlike factories that need workarounds for a similar effect. Why Use Factories: Simplicity: They're just standard functions without needing the 'new' keyword or dealing with 'this'. Flexibility: They leverage closures, promoting data privacy by not exposing certain properties or methods directly. Data Privacy: Properties or methods can be hidden, reducing the chance of unintentional overwrites.
i am usually not commenting but once i saw it has only 25k views i had to come down here and say i've been struggling with these stuff for a while and this series shed light over everything i really hope more programmers get to see these :D
I am currently doing a project for college on constructor functions, and these videos have helped a lot! You are the most clear and concise person to explain all of the parameters of a constructor function. Thank you! :D
As someone who wants to work as a developer relations engineer, I love this channel. So informative and so fun! Hope I can make great content like this some day. Very inspiring
Agreed with the other comments. Underrated channel - you have a new subscriber. Not only do you explain concepts in a clear and concise way but you explain WHY IT MATTERS. And you're engaging. You should have at least 400k-500k subscribers.
Grazie Mille per i tuoi video, finally I found someone who knows how to make people understand these tricky things. Bravo , Complimenti davvero! Se vieni in Italia your next espresso is on me!
You speak a really good english, you explain better than most of the teacher out there, your mind is brilliant, you stand out. So thank you. What's your name and where are you from?
I just wanted to add a comment about using Object.Create in your factory functions like you have on 12:10. The "name" property will be added to the object you are returning, but if someone wants to loop through an object like the one in your example using a for in loop, Object.keys, Object.values, or Object.entries, they will get back an empty array. To make the object iterable they will need to add "enumerable: true" property to the "name" property. After that you can loop through the object with a for in loop or convert the keys, values, or both.
Good point. We're really touching on the basics here and not going super deep in any object API, but you are correct in saying you can configure your object further when you use Object.create. Thanks for the call out.
@@ColorCode-io No worries! It was a thing that got me once. I love your videos btw. Really well produced and easy to follow along and understand. Keep going!
10 Things JS Developers Should Know. Unfortunately I'm one of that JS developer😅. Under rated channel with lot of information. you deserve more subscriber sir. Please do more videos
Great video! I've been struggling for a while using The Odin Project to try to figure out what Eliott was saying in '3 types of prototypal inheritance'. Maybe you could make some videos covering some of the more confusing stuff in The Odin Project? Thanks for the help very clear.
Extensively Underrated Channel. I am feeling lucky to see your teaching style. BTW, would love to have a youtube live collaboration with Hitesh Choudhury? 😊
For JavaScript, Prototypical inheritance is quicker to write, less typing in my opinion. The end goal is the same: to organize, and encapsulate properties and methods that can be reused in other areas of your code. It's important to understand so you know why all objects have a toString method in JS and the behavior of Object.keys vs Object.getOwnPropertiesOf etc... If you get confused, just remember, the purpose is to have access to all of the properties and methods that are in an already defined object without having to rewrite code.
Can we say that, when we define properties inside constructor functions with this keyword, it is not in prototype and it actually same thing as factory function and has same problems? And can we say that everything we write inside classes are created directly in prototype? so classes are short way of costructor.prototype ?
Almost. Adding properties to 'this' keyword in a constructor function does NOT add it to the prototype but you can reference the 'this' inside any function you add to your prototype. So they are aware of each other and that's a big advantage. The second part of your question is correct. Adding 'functions' to a class is the exact same thing as adding a function to the prototype of a constructor function. It's just a different syntax.
Thank u sir for the free course, I really appreciate But is there any way I can access the code for other courses?. i only accessed the code for episode 1, which name is the inheritance and others can't be found.
very concise and informative video, can you make videos where you can explain different built-in properties in js like for object, array, set, map, dom properties.
I did the same thing with constructor function as you did with factory function, the private name thing and it works the same. Just don't declare this.name and use $ {name}. idk if it's a mistake or you meant something else. great vids tho.
Technically you can start without it but eventually you will cross paths and have to learn it to go further. You can learn the fundamentals of programing using Javascript.
Really nice video. I was not really aware of the meaning of prototype and now its clear. Actually I'm doing some canvas / webgl animation, is it better to use classes if I need to create a lot of object with methods ?
Are factory functions more in use in the industry currently? I have seen some current online articles discussing factory & constructor functions but it also said you will rarely use them as classes are the current thing. Some of the most well known bootcamps only teach classes, while others say the classes have fallen out of favor. So it seems like it's a preference thing and probably depends on the company.
Hi is it possible to chain factory function methods when you call them? E.g. sayName().location().favFoods(). Not sure if I'm phrasing my question correctly sorry lol I can't use the `return this` keyword inside the factory function like how you would with a constructor :( code below: const Nerd = (name, city, food) => { const { sayName, location } = Person(name, city) const { favFoods } = FaveFood(food, name) const doSomethingNerdy = () => console.log(`${name} likes nerd stuff!`) return { sayName, location, favFoods, doSomethingNerdy } return this } const colorCode = Nerd('ColorCode', 'The Matrix', 'Fried Tofu and Teriyaki Chicken') colorCode.sayName().location().favFoods() // uncaught reference error :(
I use simple factory functions 99% of the time, and in the 1% of times I need a complex object with inheritance, I use a prototype object with a factory function. Those also tend to be the only time I ever use the this keyword.
This comment was a brain saver for me. It's been messing with my head cos I've seen examples where the returned objects of factory functions are used as parent objects for the returned objects of another Factory functions and it just messes with my head. Using object.create with factory functions just seems like an easier way to handle inheritance unless it has to deal with private variables. Am I off track here?
@@dougdoug9223 now I wonder if it’s possible to use the factory function and prototype object pattern with private variables. I haven’t had any need for that yet but I’m sure it can be done, even if it might be one of those things where even if you could maybe you shouldn’t. 😄
I have watched this video more than 10 time but i cannot understand the major difference between these two. Also please make a video on why we use these both for creating object i mean we can simply create objects. please make fully explained each and everything in a video abut these . I will be very thank full
okkk those who are confused see.............. Difference is initially in factory fn -> me.__proto__ === createPerson.prototype // false. but in constructor fn -> ben.__proto__ === Person.prototype //true so in constructor fn when we create the obj with new keyword it gets the fn in its proto, and for factory fn we have to do it manually......
What is the difference between a Factory Function and a Constructor in JavaScript?
Factory Functions are Better More Secure than Constructor Functions.
@@kran399 can you proof this ?
i think the onlu difference is that you can add/modify method using "constructrorname.prototype.newfunction" in constructor function but you cannot do this in factory function.
Constructors are OOP. Anyone saying otherwise is simply wrong and abusing standard nomenclature.
A factory function basically clones new copies of all object members defined in the object, in each object instance that is created - by default; whereas a constructor function only clones the members defined in the constructor.
Lately I've been using an OOP framework that uses a singleton object as a class that contains only static methods. One of those static methods serves as a factory function for creating data objects that the class object can then manipulate. Static functions serve as prototypal functions by having a data object passed to it as an argument. So instead of using the traditional this keyword to reference instance objects, you use the instance argument passed. For example:
let ClassObj = Object.create(null);
ClassObj.newDataInstance = function(arg1, arg2) {
return {
property1: arg1,
property2: arg2
};
};
ClassObj.setArg1 = function(instance, newArg1) {
instance.arg1 = newArg1;
};
But it can get a bit tiresome to always have to pass in an instance argument every time you want to work with instance data. So I've also toyed with the idea of having a static defaultIntance property in the Object so that when there is a series of consecutive calls involving the same instance you can use a function like this:
ClassObj.withInstance = function(instance) {
ClassObj.defaultInstance = instance;
};
to initially lock on to a particular instance that will be used for the following instance calls without having to repeatedly enter an instance argument for each call. Now the setArg1 function would look like this:
ClassObj.setArg1 = function(newArg1, instance = ClassObj.defaultyInstance || null) {
instance.arg1 = newArg1;
};
The best decision in my RUclips History was to subscribe to this Guy. His teaching method is just amazing. You should launch your own complete js course, why limit it to 20?😅
Hands down the best teacher I’ve come across on RUclips. Keep producing content!!! Love it
Thank you
Why you are not active 😢😢the bestest teacher ever
underrated channel! I'm watching 10 Things JS Developers Should Know and I'm loving it, you explain everything in such great detail and with nice humor too. TOP NOTCH QUALITY VIDEOS HERE. Keep it going man, I hope this channel gets more subs.
Awesome! Thank you :)
I'm happy I found your Javascript videos. Saying a very appreciating thank you from Northern Nigeria for now.
You are very welcome
This is the first video I have seen from this channel. Subscribed.
Following the Odin Project and looking up your videos definitely saves time on certain topics. Very clear and concise
Nice
So funny, love how he doesn't just explain how to create constructors/functions but also gives practical examples of how and why the distinctions are important. Liked and subscribed.
Awesome! Glad you liked it :)
Thank you so much for this series of videos! You explanations are perfectly clear, the editing is amazing and they are super entertaining :)
Love the flow of this video. Awesome editing work as well. You deserve more subs!! (Here before 6K 😎)
Nice! Thank you :)
Wow, I've watched so many videos on this and your explanation is by far the best. deserve way more subs
Awesome! Thank you
You explained the difference so good! I was struggling to understand the difference since im new to JS. You're the best🙌
The presentation is engaging, and the information provided is very valuable. The production quality is top-notch, and it's evident that a lot of effort went into creating this content. Keep up the great work!
Thank you ♥️
Thanks for this tutorial series
My key Takeaways from this video
Factory functions, by default, create distinct copies of methods for each object, which can be memory intensive.
Constructors, by using prototypes, share a single method instance among all objects, which is memory efficient.
Constructors enable genuine inheritance, unlike factories that need workarounds for a similar effect.
Why Use Factories:
Simplicity: They're just standard functions without needing the 'new' keyword or dealing with 'this'.
Flexibility: They leverage closures, promoting data privacy by not exposing certain properties or methods directly.
Data Privacy: Properties or methods can be hidden, reducing the chance of unintentional overwrites.
i am usually not commenting but once i saw it has only 25k views i had to come down here and say i've been struggling with these stuff for a while and this series shed light over everything
i really hope more programmers get to see these :D
Thank you!
Great coverage of the topic and parallels of theory against real-world examples. True scholar and a gentleman in real life, keep it up.
I am currently doing a project for college on constructor functions, and these videos have helped a lot! You are the most clear and concise person to explain all of the parameters of a constructor function. Thank you! :D
Great to hear!
Why doesn’t this series have millions of views
Every view counts 🙏 ♥️
I've never watched a video of yours before, but way to go. Funny, simple and accurate. Good job!
Thanks Gustavo!
As someone who wants to work as a developer relations engineer, I love this channel. So informative and so fun! Hope I can make great content like this some day. Very inspiring
Agreed with the other comments. Underrated channel - you have a new subscriber. Not only do you explain concepts in a clear and concise way but you explain WHY IT MATTERS. And you're engaging. You should have at least 400k-500k subscribers.
hugely underrated quality channel
Thank you
Grazie Mille per i tuoi video, finally I found someone who knows how to make people understand these tricky things. Bravo , Complimenti davvero! Se vieni in Italia your next espresso is on me!
Very underrated channel don't worry will get 1 billion+ subscribers bro thanks bro great job
Thank you
I came back to this video just to refresh my mind! Thank you once again!
You are so welcome!
Just stumbled across your channel... really enjoyed this style of teaching! Great stuff!
Wonderful to hear. Thank you.
Excellent. Very underrated channel!
Thank you
You speak a really good english, you explain better than most of the teacher out there, your mind is brilliant, you stand out. So thank you. What's your name and where are you from?
I just wanted to add a comment about using Object.Create in your factory functions like you have on 12:10. The "name" property will be added to the object you are returning, but if someone wants to loop through an object like the one in your example using a for in loop, Object.keys, Object.values, or Object.entries, they will get back an empty array. To make the object iterable they will need to add "enumerable: true" property to the "name" property. After that you can loop through the object with a for in loop or convert the keys, values, or both.
Good point. We're really touching on the basics here and not going super deep in any object API, but you are correct in saying you can configure your object further when you use Object.create. Thanks for the call out.
@@ColorCode-io No worries! It was a thing that got me once. I love your videos btw. Really well produced and easy to follow along and understand. Keep going!
I really had no idea, thanks alot!
You're welcome
Thanks for sharing. As someone learning javascript, you cleared up some confusion.
Love to hear that, thank you
Great series. Nice to know about Eric Elliot as well.
I'm liking your channel honestly
👍
10 Things JS Developers Should Know. Unfortunately I'm one of that JS developer😅.
Under rated channel with lot of information. you deserve more subscriber sir.
Please do more videos
You a great Teacher and I appreciate you
Top Tutorial! Greetz from Germany!!!
Guten morgen Germany!
This is a banger video. Thank you for the help.
👊👍
Super good production on the video. Really aids in visualizing the workings of the code! The intro music might be mixed a little too loud though.
Thank you!
Top quality content. 10/10.
👍❤️
Nice style of teaching ❤
Really love your explanation
Thanks!
thank you so much, top notch explanation, amazing!!
very understandable and practical way explaination. thank you so much x 10
great Content Love from India Sir.
Really good explanation, thanks a lot!
Glad it was helpful!
Great video! I've been struggling for a while using The Odin Project to try to figure out what Eliott was saying in '3 types of prototypal inheritance'. Maybe you could make some videos covering some of the more confusing stuff in The Odin Project? Thanks for the help very clear.
Amazing video.. Hats off
Thanks for your explanatory examples and efforts !!
Great teaching. Thank you.
👍
great quality!
Great video ❤
🙏
thanks for the tips. good stuff
Amazing video helped a lot
god bless you
you make the best videos all over the internet thank you very much
you are the best!!!!!!
You're welcome :)
Extensively Underrated Channel. I am feeling lucky to see your teaching style. BTW, would love to have a youtube live collaboration with Hitesh Choudhury? 😊
Thank you. Not sure who that is but maybe in the future
For JavaScript, Prototypical inheritance is quicker to write, less typing in my opinion. The end goal is the same: to organize, and encapsulate properties and methods that can be reused in other areas of your code. It's important to understand so you know why all objects have a toString method in JS and the behavior of Object.keys vs Object.getOwnPropertiesOf etc... If you get confused, just remember, the purpose is to have access to all of the properties and methods that are in an already defined object without having to rewrite code.
Dude great video.
Glad you enjoyed it
Can we say that, when we define properties inside constructor functions with this keyword, it is not in prototype and it actually same thing as factory function and has same problems? And can we say that everything we write inside classes are created directly in prototype? so classes are short way of costructor.prototype ?
Almost. Adding properties to 'this' keyword in a constructor function does NOT add it to the prototype but you can reference the 'this' inside any function you add to your prototype. So they are aware of each other and that's a big advantage.
The second part of your question is correct. Adding 'functions' to a class is the exact same thing as adding a function to the prototype of a constructor function. It's just a different syntax.
Good stuff! subscribed
Awesome :)
Thank u sir for the free course, I really appreciate
But is there any way I can access the code for other courses?. i only accessed the code for episode 1, which name is the inheritance and others can't be found.
very concise and informative video, can you make videos where you can explain different built-in properties in js like for object, array, set, map, dom properties.
Hello. Thanks for the video. What IDE are you using?
Chrome DevTools
I did the same thing with constructor function as you did with factory function, the private name thing and it works the same. Just don't declare this.name and use $ {name}. idk if it's a mistake or you meant something else. great vids tho.
What is this interpreter you are using for code.
happy to have inspired :)
Chris Brown. Cool name.
Pure gold found here
This channel is a fucking GEM
Thank you!
how much css and html do i need start learn javascript?
Zero :)
Technically you can start without it but eventually you will cross paths and have to learn it to go further. You can learn the fundamentals of programing using Javascript.
Holy shit... thank you! I now know how to create static variables/methods in my factory function! PROTOTYPES!!!!
👍🤘
What's that awesome code editor you're using to see your objects?
Chrome DevTools
You are soooo gooood❤❤❤
You are too
Great video, thx a lot!!
You are welcome!
By far the best explanation I've heard about this, ColorCode >>> ChatGPT
Really nice video. I was not really aware of the meaning of prototype and now its clear. Actually I'm doing some canvas / webgl animation, is it better to use classes if I need to create a lot of object with methods ?
You can definitely use classes, constructors or factories. In the end it's up to you what makes more sense to you for your particular case.
i love you video, can you tell me what app or tools your using to record? it seems its cool
Are factory functions more in use in the industry currently? I have seen some current online articles discussing factory & constructor functions but it also said you will rarely use them as classes are the current thing. Some of the most well known bootcamps only teach classes, while others say the classes have fallen out of favor. So it seems like it's a preference thing and probably depends on the company.
Great stuff
Thank you
Great video
Thanks!
Awesome.... !!! 👍
👍
which editor...you used? please
It's called RunJS: runjs.app/?via=colorcode
Liked and subscribed.
14:13 Gramma song?
Hi is it possible to chain factory function methods when you call them? E.g. sayName().location().favFoods().
Not sure if I'm phrasing my question correctly sorry lol
I can't use the `return this` keyword inside the factory function like how you would with a constructor :(
code below:
const Nerd = (name, city, food) => {
const { sayName, location } = Person(name, city)
const { favFoods } = FaveFood(food, name)
const doSomethingNerdy = () => console.log(`${name} likes nerd stuff!`)
return { sayName, location, favFoods, doSomethingNerdy }
return this
}
const colorCode = Nerd('ColorCode', 'The Matrix', 'Fried Tofu and Teriyaki Chicken')
colorCode.sayName().location().favFoods() // uncaught reference error :(
I use simple factory functions 99% of the time, and in the 1% of times I need a complex object with inheritance, I use a prototype object with a factory function. Those also tend to be the only time I ever use the this keyword.
This comment was a brain saver for me. It's been messing with my head cos I've seen examples where the returned objects of factory functions are used as parent objects for the returned objects of another Factory functions and it just messes with my head.
Using object.create with factory functions just seems like an easier way to handle inheritance unless it has to deal with private variables.
Am I off track here?
@@dougdoug9223 now I wonder if it’s possible to use the factory function and prototype object pattern with private variables. I haven’t had any need for that yet but I’m sure it can be done, even if it might be one of those things where even if you could maybe you shouldn’t. 😄
This man makes me wanna drink water whenever he does it =))
💧 🍺 cheers
I have watched this video more than 10 time but i cannot understand the major difference between these two. Also please make a video on why we use these both for creating object i mean we can simply create objects. please make fully explained each and everything in a video abut these . I will be very thank full
Good vid
Thanks
king
thank you
I loved how you just put you.name= قلی
I found that funny 😆
Explain " return " in JavaScript . please make a Deep UnderStanding Video ,Please Sir.
We want set up tour..
It’ll be included in my JS MasterClass. Coming soon.
@@ColorCode-io kk sir, we are curious about your js master classes .
New subscriber 😊✌️
Why don't the sound work?!! Noooooo! I need this knowledge...😢😢😢
Wow!
I wish he would launch a RUclips series on React.
Wouldn't that be great :) ?
okkk those who are confused see..............
Difference is initially in factory fn -> me.__proto__ === createPerson.prototype // false.
but in constructor fn -> ben.__proto__ === Person.prototype //true
so in constructor fn when we create the obj with new keyword it gets the fn in its proto,
and for factory fn we have to do it manually......
OMG, have my babies; you've shown me the light with your incredible teachings!! 🤡
14:08 "peeeeeerry"
i like it
OG Batman
:D