JavaScript Classes #1: The Basics - JavaScript OOP Tutorial

In JavaScript you can use the OOP (Object-Oriented-Programming) feature of "classes" to construct objects which are then useful resources for your script/application.

By using the "class" keyword you are able to create a definition of a class and then from there you can instantiate it using the "new" keyword followed by the class name. You can think of a class as being a specified structure of what the eventual object HAS and also what it DOES.

In this video I take you through a simple and easy to understand example of defining a class called "Rectangle" and then creating different objects based off of it. I explain how instance properties/variables, instance methods and how constructors work - along with the "this" keyword.

For your reference, check this out:

Support me on Patreon:

Follow me on Twitter @dcode!

If this video helped you out and you'd like to see more, make sure to leave a like and subscribe to dcode!

[abhinavkumar]

Such an elegant & beautiful explaination! This gives me great confidence to learn code at an elder age where doubt and imposter sucks. Thanks mate :)

[HuertaGer]

thank you dom im currently taking the FCC basic javascript cert and i was quite lost at ES6 but after watching this video i feel like now i understand a little bit more, your explanations are beautiful because you carry us since the beginning.

[aam]

Absolutely well explained!!! Thank you!

[llarn.i]

What a great explanation! You’re a lifesaver thank you so much

[Kay_Drechsler]

Very good explanation! Thank you for that!

[viktoriaj.]

Thank you for this. I am going through a QA course currently and just had classes thrown in my face... didn't know what to do with it so I Googled and found you.

[jake-hezt]

Sir you are just AWESOME. Thanks for making these videos.

[JeffRAX]

This channel is gold. Thank you very much, sir!

[HarveySpecter]

that is a really clear explanation. Thank you!

[farmgatebd]

Why your subcribers a few ! you really good teacher with understanding ! go ahead bro.

[mulumbaandrew]

Best explanation of classes have come across!

[rajeevthapa]

Very nice explanation! Easy to follow.👏👏

[martinchakarov]

One more subscriber here! You are an awesome tutor, thank you! :)

[SarahStarmer]

Thankyou for the great tutorial. How do I append the rectangle to the document.

[SACHIN-gdzy]

Hey thanks for the tutorial, i subscribed your channel🔥

[jayteecollins]

thanks for the simplifying the explanation and demonstration. would you be able to share how the classes use in real world?

[Ineffable_Wisdom]

Hey, nice tutoprial.
Aren't you using JQuery when you use "${this.width}". If not could you explain that a little or point me in the right direction?
Thank you.

[timothyletsoko]

Thank you very much... I understand now😭😭😭

[Shubham-xhnz]

= () => {
currentWords += 'SOuu' ;
}, 5000);