JavaScript Object Oriented Programming Tutorial Beginners - OOP in JavaScript

Best Tech Resume Template: papermoontech.com/pmcsrtk/pedro
Use code: PEDRO for 20% off ^
Hey guys, I decided to make a tutorial on how to implement the Object Oriented Programming paradigm using JavaScript. OOP is a sequence of principles and design patterns that is very common in the world of programming. However, I don't see a lot of people learning it using JavaScript. SO in this tutorial I will go over the basics and also talk about the 4 pillars of OOP: Abstraction, Encapsulation, Inheritance, and Polymorphism.
-
🚀 Learn ReactJS By Building 6 Projects: codedamn.com/learn/reactjs-pr...
💻 PedroTech Discord: / discord
-
Social
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
Website: machadopedro.com
Twitter: / pedrotech_
Linkedin: / machadop1407
Instagram: / _pedro.machado_
Github: github.com/machadop1407
Email: [e-mail]
Timestamps
00:00 | Introduction
04:09 | Beginners
22:24 | Abstraction
27:50 | Encapsulation
31:45 | Inheritance
39:00 | Polymorphism
44:00 | Outro
Tags:
- Object oriented Programming
- JavaScript OOP
- ReactJS Tutorial
- ReactJS and MySQL
- NodeJS Tutorial
- API Tutorial

[@abirmahmood7096]

Very easy to follow with! I am halfway through but will definitely complete the tutorial and work on a project with the learnings from here

[@salvaddd]

29:32 There is now a standard way to set private properties (added in ES2022). class Person { #age constructor(name) { this.name = name; // public this.#age = 20; // private } } const p1 = new Person('joe') console.log(p1.age) // undefined

[@sparkscomputerprogramming]

this guy is young but can really teach like a professional. Thanks so much pedro

[@RemoteJuniorJobs]

Thank you for the complete explanation! I think I finally got my head around OOP! 🤟

[@kristijanlazarev]

Very simple. I'm actually amazed! Love it!

[@ugochiori2160]

I definitely understand OOP better now. Thank you.

[@charlestoneoyoo]

I have really learnt a lot from this course, thank you so much Pedro. You are a great tutor

[@cyrilressi1114]

As many people said, it's exactly what I was looking for. Everything was clear, also for a beginner like me. Thanks for what you've done. You got a new subscriber too :D

[@abeasta7674]

Thank you Pedro, it was really useful for me.

[@Max-nm8ct]

I think you have huge potential in making videos as your way of explaining is very easy to follow and you seem to know a lot about what you are talking about. I do agree with other people in the comment section that , from abstraction onwards, you rush through the topics too quickly. I am a fan regardless, keep up the good work

[@PedroTechnologies]

Hahaha thank you! I agree, I should have taken my time and prioritized the quality of the video over making it shorter.

[@kanjakan]

Your production quality is top notch. Your explanations are clear and concise and your humor is great.

[@PedroTechnologies]

Hahaha appreciate the support!

[@mfahriferdiansyah]

Thanks for the video, very clear explanation!!!

[@chubamoa3640]

can you make a video on type script and angular , really love the way you break things down into comprehensible chunks. This is way more helpful than any documentations out there.

[@barrygarrick8673]

I agree documentations kinda slow you down

[@harrisonvictor6493]

Hey Pedro thank you for this video ❤

[@CuongVu-yy4cg]

incredible tutorial. Thank you

[@mohammadkamrul5310]

awesome man. thanks for the video. really loved it

[@zababy]

Damn that was so clear. Thanks

[@arturofreire9943]

Começando com poo agora, esse vídeo é incrível

[@ricardocambundo2527]

Thx so much bro This is exactly what I wanted. You’ve got a new subscriber 🔥💪

[@PedroTechnologies]

Thanks for the sub!

[@zarifaibrahimzade8097]

Thank you !

[@smnomad9276]

Hey man i was really confused about OOP and every video i watched confused me even more. You are inbelieveably talented when it comes to teaching, you explained everything in a very easy to follow way and went into all the small details without assuming that we already know certain things. I learned a lot thanks! I hope you can make courses on Udemy! Keep going and thanks again.❤

[@PedroTechnologies]

Happy to hear :) This motivates me a lot! Also, I haven't told all subs yet but I'm 90% done with my first udemy course hahaha hope it goes well!

[@davidjacopin-taho3998]

Same thing for me, bought a 65h course on Udemy, spent 20h watching it so far to get nothing but confusion. I watched this video and finally understood! I might be able to get back to my course and follow through now, thx!

[@mdbicky9460]

thanks mate such and beautiful video

[@apeiron4409]

This is a perfect tutorial for oop. Thanks!

[@PedroTechnologies]

Glad it was helpful!

[@mark_asiimwe]

Getters and setters was kinda fancy until I watched this video, thank you Pedro.

[@nabhanabdullah2517]

Great content, really helpful! Thanks a lot

[@nisargshah7531]

With JS, private variables are declared using # as prefix.

[@abhinavverma4111]

Super clear!!

[@missin3322]

Man I was also very confused with this.You made it super clear.Thank you.

[@PedroTechnologies]

Glad to hear it!

[@viajuiceology]

this.You = him; lol, sorry had to

[@BeasySemantic]

Very nice video! I would like to know when i have an object and i have some properties that holds some values , and another object need also that properties from the first object, how i impelement that correctly ?

[@hamzehqatash6256]

thank you very much, it is really helpful.

[@gilliantv9917]

Thank you sir 🔥

[@MuhammadAwais-rp8po]

Great content really helpful! Bro can you tell me which vs code theme you're using in this video?

[@kelkiiii]

Do you not want code from outside the class to have direct access to the fields for security reasons/context/convention/etc?

[@vegasvato55]

HOW DO Y OU GET THE NEEW OBJECTED FROM THE CONSTRUCTOR CLASS INTO AN ARRAY???

[@fastislivee]

Very well explained.Subbed!

[@PedroTechnologies]

Awesome, thank you!

[@timbr1279]

Thanks for such a simple explanation, this is awesome! ( log ctrl + space Enter => console.log) Go on, don't stop Bro

[@PedroTechnologies]

Glad you liked it!

[@jurajhlavek7742]

Very ncie explanation, you just got new subscriber. Can I ask you what is the VS code theme you use?

[@josephmariga]

Thanks. I have been having a hard time understanding OOP.

[@PedroTechnologies]

Glad i could help!

[@cappatech]

im using visual studio code, how can i use terminal section?!? It doesnt recognize the 'note' command for some reason. Can you help? P.S Thanks to your perfect tutorial! RESPECT!

[@vladislavspisligins1561]

18:28 "imagine, I got merried... Something, that's not gonna happen for few years" :D I don't know, is it honesty or sence of humor, but I like it. Also I agree with others, that the tutorial is well made!

[@gaser6911]

amazing dud salah is the best greeting from Egy🦍

[@ssekabirarobert-lr5cl]

Thank u, how did u land ur first job

[@farandibrahim3261]

May i know what theme you use in this video?

[@vovaherchuk2777]

Well, before ES6 or EcmaScrip2015 function constructors were used insted of classes (actually class - it's a simple syntax sugar). You can read more about this cos it gives you much more deep language understanding) Btw thx for such cool lesson!

[@PedroTechnologies]

Yes! You are correct! There is no need for using the class syntax, it was made primarly to look like other languages!

[@rishibhatia900]

excellent tutorial!

[@PedroTechnologies]

Glad you liked it!

[@Cappell7]

amazing video bro

[@stalonfernandes]

The Best OOP In JavaScript Video On The Planet

[@PedroTechnologies]

Thank you!

[@pranjalwalia3810]

Bro you're on 🔥

[@PedroTechnologies]

Thank you! Glad you liked it!

[@zakariaealami3135]

@@PedroTechnologies good content , but i see that you need to work better your SEO and marketing strategy ...good luck

[@PedroTechnologies]

@@zakariaealami3135 Thank you, I really appreciate it! Do you have any tips on improving my seo?

[@sandun7266]

you are awesome

[@CodeVideo]

Very 👍

[@jaidkarim9080]

bro how did u become so good at this at 19

[@aahsansiddiqui8680]

Hi pedro OOP is a backend concept or frontend ? if i watn to become a front end develper then should i need to learn opp or not

[@anthonyviniciusdossantosmu3062]

I am not the person you asked and I think my answer is a little late, but here it is: both, it's a front and back end concept

[@rayvincentdelacruz8251]

Cool bruh!

[@teja.4]

You watched in no time

[@PedroTechnologies]

Lmao this commented less then 1 minute after it went live

[@PedroTechnologies]

Thank you bro! Really appreciate it!

[@eshw23]

Wait, your only 19? Ridiculously successful for your age bro keep it up

[@sivacharan3987]

Sir,I have a doubt in oop in JavaScript.when can implement anything in JavaScript without oop also.Then what is the use of oop in JavaScript?When do We use oop in JavaScript?

[@damonmartin1572]

OOP and Procedural Oriented Programming are just paradimes. OOP's benifits grow in larger massive codebases as it helps get rid of a lot of repeated spaghetti code but in smaller code bases Procedural might still be ok. There's a reason why many of the top companies use it but you can not learn OOP with out first learning Procedural. Encapsulation and Abstraction are the main reasons why.

[@vegasvato55]

ONCE THE CLASS CONSTRUCTOR IS CALLED AND CREATES THE NEW OBJECT, HOW DO I GET TH NEW OBJECT INTO AN OBJECT ARRAY???

[@zeetheartist2563]

.PUSH() I THINK

[@arbabmemon2095]

👍👍👍

[@thunderstack5365]

Nice

[@PedroTechnologies]

Glad you liked it!

[@thunderstack5365]

@@PedroTechnologies hey can you make videos on ml algorithms

[@aghilannathan8169]

What the hell you go to my school. What a cool coincidence.

[@PedroTechnologies]

Hahaha you are from UBC? What year?

[@joseph7744]

Shouldn't the syntax for methods be: getName() { } not getName = () => { } I'm pretty sure the former is what tells the JS engine to set the method on the prototype object where as the latter definition would create a new copy in memory of the getName method for every single instance of the Person class.

[@varaprasad4163]

got stuck at 23:33. but great explanation brudda.

[@PedroTechnologies]

Thank you! Abstraction is quite confusing at first, but the whole idea is that you separate ur code so that peopl working with you can access some functionality without having to understand how it works!

[@varaprasad4163]

@@PedroTechnologies now I understood everything. Please take care.👍

[@LucasSilva-oy7fq]

Is it a new intro?

[@PedroTechnologies]

Yes!

[@alekodimitrov2635]

timestamp 31:45

[@usmanmughal5916]

You create an awesome and informative video but like you, I am not a KZbinr but I think you need to create different projects to grow your channel.

[@PedroTechnologies]

Really appreciate it! I have put a lot of effort into the channel and I think its growing fast. Obviously I would love if it grew faster but I honestly don't know what I can do to increase the speed hahaha I know that certain videos will bring in more views (making a clone using firebase (and not actually write any backend code), use material ui, make videos on different languages). But I want to post stuff that will be helpful and not just to get views. Idk to be honest, but I am planning on making mre projects!

[@usmanmughal5916]

@@PedroTechnologies Damn yea Sure!!!

[@alcymn]

L stanley

[@phyf3]

Thank you!