6.2: Classes in JavaScript with ES6 - p5.js Tutorial

This video introduces Object-Oriented Programming in JavaScript with ES6 classes and the p5.js library. Code: thecodingtrain.com/tracks/cod...
🕹️ p5.js Web Editor Sketch: editor.p5js.org/codingtrain/s...
🎥 Previous video: • 6.1: Introduction to O...
🎥 Next video: • 6.3: Constructor Argum...
🎥 All videos: • Start learning here!
Timestamps:
0:00 Introduction
3:09 Encapsulation
3:37 Using Classes as a Template for Objects
8:40 The constructor() Function is the Object's Setup
10:10 Using “this.” to Declare Class Variables
12:26 Code Example
14:50 Adding Functionality to a Class
Editing by Mathieu Blanchette
Animations by Jason Heglund
Music from Epidemic Sound
🚂 Website: thecodingtrain.com/
👾 Share Your Creation! thecodingtrain.com/guides/pas...
🚩 Suggest Topics: github.com/CodingTrain/Sugges...
💡 GitHub: github.com/CodingTrain
💬 Discord: / discord
💖 Membership: kzbin.infojoin
🛒 Store: standard.tv/codingtrain
🖋️ Twitter: / thecodingtrain
📸 Instagram: / the.coding.train
🎥 Coding Challenges: • Coding Challenges
🎥 Intro to Programming: • Start learning here!
🔗 p5.js: p5js.org
🔗 p5.js Web Editor: editor.p5js.org/
🔗 Processing: processing.org
📄 Code of Conduct: github.com/CodingTrain/Code-o...
This description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecod...
#basics #oop #objects #p5js #javascript

[@MattCurney]

"What does it mean to be a bubble?" I literally understand Classes now because of this adorable man

[@bernardnoctor5627]

If I wasn't unemployed I would subscribe to desperate dan he is funny I like his real bell and he helped me to understand oops

[@jonahmorgan2474]

His ramble about "What does it mean to be a bubble?" makes more sense if you know he got a Bachelors in Philosophy, as well as Mathematics. Just a fun fact.

[@JakeWHamilton1]

I also have a degree in philosophy and have been naturally drawing the analogies between phil and coding as I learn. Have been trying to explain these connections to my brother (programmer, no phil) who just won't hear it...immediately sent tthis video his way. one day ill convince him he is actually a philosopher on the cutting edge of ontology, asking 'what does it MEAN to be a programmer!?'

[@millanferende6723]

@Jacob Hamilton Don't you mean what does it MEAN to be an object? 😏

[@kamelyehya2182]

@@millanferende6723 A woman once said.

[@x7w6]

@@kamelyehya2182 quick witted

[@martynconkling8876]

lol nice, Bubbles are quite a cool mathematical concept to think about no matter what age you are!

[@carllitabobita]

Some educational coding videos are hard to watch: 10 minutes feel like the longest, driest eternity. With your videos, 10 minutes pass so quickly, and I learn a lot! Thank you so so much for your content!

[@JustinSulak]

We live in an age where it doesn't matter if I don't understand a single word my professor is saying, because I can come to KZbin and learn ten times more! Thank you for this video series!

[@lookupverazhou8599]

Well, if you think throwing away money doesn't matter...

[@Alessandro-nq3tm]

You are the best teacher in the world!! :)

[@noxid86]

For real, youtube should pay this guy more

[@romanemul1]

a question that has been burnt into my mind after watching this video. "Hows to be a bubble ? " Im going to think about that for a very long time.

[@TheCodingTrain]

mission accomplished!

[@jelto-tankredbasel9060]

Now that I know how to be a bubble... I am afraid of bursting at any moment...gosh being a bubble is so difficult.🙈

[@leyshonrr]

Dan, I have been at pains with OOP in python & R for many years. Your video series here is honestly some of the most tangible and comprehensible learning material I've come across for this programming paradigm.

[@itsMapleLeaf]

i pretty much know most if not all of this stuff, but it's still fun to watch Dan talk about it :D

[@TheCodingTrain]

hah

[@pieteroehlers9716]

Is this ES6 only if you have p5.js or is is just something in js

[@pieteroehlers9716]

Is this ES6 only if you have p5.js or is is just something in js

[@abdoelkaheal1940]

this is something in js

[@muhammedmustafa5725]

I feel so bad as I have just found your channel now, and I haven’t seen this video for 2 years. You are by far the best teacher I have seen

[@greatsuccess4734]

Coding in Javascript for 2 years now, have watched tons of videos where has this guy been hiding all the time. damn amazing tutorial.

[@bahaatamer1245]

I just found out about this tutor by co-incidence when I was searching for online videos to explain classes, and he is really brilliant to make things fun and easy!

[@viveksakpal3231]

One of the best teaching skill i have ever seen...great job

[@seeker4570]

Very well done, good example of JS and OOP. "this. is the bane of your existence now", so true.

[@gabrielcoku5774]

You are fun and amazing. You realise later that you actually didn't struggle at all to understand what ever He was teaching about.

[@andrelie7760]

"What does it mean to be a bubble?" You just won me over, love the energy, love the way you talk, you're gonna teach me how to create classes, and everything else

[@AJBatac]

I wish my teachers in the past are 1/100th of your enthusiasm.

[@DesignDensity]

So much energy, so much motivation, when I watch your videos I get 1000% more inspired and motivated to do things in writing codes than just watching... You are remarkable :)

[@jacob9919]

Please tell me you teach for a living, you've got the perfect spirit for it. This helped me so much trying to refresh my brain after my break from my curriculum. Thanks so much!

[@Vendavalez]

"There are 15 different ways to do everything in JavaScript and also this video will be out of date by the time you watch it because there will be a new way which peopel are doing now, I am just trying to keep with the times." Me too train man. Me too.

[@neotericphoenix5811]

WTF! New favorite teacher!

[@heidik1757]

The reason I enjoy learning p5 is because it allows me to visually see JS in action and how all the different parts (loops, conditionals, etc.) translate visually. I think this will help me to apply JS to less visual applications when the time comes. I also think he's hilarious. Great teacher.

[@fotiem.constant4948]

This guy is a genius. It's been 3 years now and your video is still very relevant. Thanks for making my understanding of OOP easier sir.

[@jostermayer]

I watched hundreds of programming videos had six years of programming in school and your videos is the first thing where I really understand coding

[@santiagoramirez5507]

The best coding teacher on KZbin ever!!! Regards from Chile!

[@Juliazevallos-vn5vw]

You explain things so easy. Other videos take you directly to the coding aspect and its hard to understand the why and how. Thank you for being so clear and detailed in your explanations.

[@puneetjain5625]

Worked in oop for some time, still all this create a new meaning for me. I always learn coming back to you. You have changed my approach to programming.

[@martynconkling8876]

Such an excellent introductory video to classes! I use this video in my classes and have been referring people to this playlist for years!

[@gary3548]

Finally a programming tutorial, where the presenter has passion and makes you not fall asleep! thanks!

[@user-cy3kn7zx1l]

You add so much flavor and spice into teaching that it's very fun to learn and follow along! Awesome work dude!

[@Kasas90]

Sir you got my attenction within the first 10 seconds. What an amazing format did you choose. You nailed it.

[@Killjoy3990]

OH MAN this is what I needed. I needed it laid out for me exactly like this.

[@maarten452]

Note that classes always start with a Capital letter.

[@mirzaaghaalikhan183]

Isnt that just a convention?

[@VivekYadav-ds8oz]

@@mirzaaghaalikhan183 Yes, but one that would help a lot if followed thoroughly.

[@1inda1ee]

I really love your videos because I'm currenty working as a web developer and everytime I get to use, I just didn't know how to do it properly. Anyhow, I totally understands and can do class function with confidence. Thank you ~

[@thomasalston]

Dude, you have a very unique method of teaching! Thank you for going into such detail and the repetition, it was very helpful.

[@ahmedsellami1743]

I think You are the best teacher in programming. I didn't understand classes before but now thank You !!!

[@vasilispapasakellariou4074]

I have reached a point where i am coming in ur channel just to have fun and chill listening to u ! Duuuuude.

[@makitocode]

One of the best videos to explain objects in JS. Excellent work with these videos, really really helpful!

[@thanos4177]

Happy Teachers' Day :) Thank you, you made coding a lot easier to me!

[@baxudak]

dude, even tho it's already 3 years old, i'm amazed by your explanation skills! thank you for helping me understand classes :D

[@StrengthScholar0]

Thank you so much I'm in a coding bootcamp and I was completely lost on classes and constructors until this video. You saved my ass

[@theriddler525]

I have taken classes on this stuff and not understood it. Thank you for describing these concepts in a way that finally let me understand them!

[@gemma4784]

these videos are getting me through my 'programming for visual artists' class........ i love this man

[@mrwrench3131]

"this dot is the bane of your existence now, welcome to your life" I felt that on a personal level :)

[@knowledge_4203]

I ABSOLUTELY LOVE how he teaches. I am definitely SUBSCRIBING!

[@drivgest]

always loved the way you write codes. so clean and efficient.....

[@stevetran1215]

This tutorial is exhilarating, helpful and impressive! Thank you!

[@m.pashakhoshkebari2045]

The first time I watched this, I understood nothing and was super confused. The next day, I went back on it and decided that I was going to try my hardest to try to learn again. By the time it was finished, I had understood everything and realized that no KZbinr or teacher will ever be able to teach like this man can. You truly are the goat :)

[@racheltodd5424]

Same experience dude. I love coding but I've put it off for a few months because i need to write college essays (I REALLY REALLY hate them). But I'm rewatching a lot of this man's videos in an attempt to make bootleg versions of my fav 2d games

[@JatanPassi]

@@racheltodd5424 Hey there person so did you make that game yet or what?

[@racheltodd5424]

@@JatanPassi sort of. I made a pong game and then got held up w life. But I'm in college for cs now so I should be making bigger and better things

[@J3SUZFR33K]

Bro! You are the man! You can teach the world my friend! I love your enthusiasm, charisma, and passion! Keep it up Boss man!

[@darkhorse621]

"What does it mean to be a human?" This statement was the aha moment for me in understanding Objects and Classes. Thank you so much !!!

[@sultanehind5884]

Its 2020 and I came here watching all the videos from the start of the series... sir but you said it might be outdated when I watch it... it kind of got me worried there. But still I am going to finish the course, hope it will help me grasp the ml5 playlist easily!! BTW sir you are the most amazing professor I ever saw in my life. God may bless you with long life!

[@DanielHernandez-jn8lz]

What a great way to explain something that usually is boring and abstract and turn it to something very easy and funny... I'm learning JS and I will watch all your videos!!!!

[@akshhatsrivastava1972]

Thank you so much for this great explanation! "What it means to be a bubble?" really made me understand constructors and classes.

[@abdessadekelaasri8862]

I just open youtube sometimes and pick a random video from your playlist and watch, It's so fun and very educational. Thank you teacher :)

[@24Leonberger]

Really enjoy this tutorial video you make learning fun! Thank you!

[@bernardnoctor5627]

i agree he is funny as long he uses his bell

[@ryanscoville3586]

Thank you for being the kind of teacher that you are! I learn a ton and laugh a lot all the while. Keep it up!!!

[@hnariman_]

Tutorial is really fun to watch, especially when you're learning more complicated concepts of OOP. It will be pretty beneficial to have links on other tutorials, where let/var explained as example. Personally I get confused only at the stage where print() replaced console.log() and started watching from this particular tutorial I get confused, whether print() is custom function, node.js function or a new feature brought by ES6. But anyway, tutorial is fun and thanks for explanations!

[@hugoandrade8691]

what a perfect teacher, i started to love coding, because i started to watch his classes. : 3

[@MarcelaoVMS]

This is so nice and fun to watch! Amazing class! Thank you very much!

[@RyanValizan]

Your statement at ~4:50 is just too true! There is no one single method to solving a problem in programming.

[@cloretteangel]

You’re a great teacher! I really understand a lot from here. :D its really cute using the bubble explanation 😁

[@iqrasuhail3516]

I finally understand what the “this” keyword is used for when referring to objects. So thank you!

[@shadowbro8522]

Love you. You make everything very easy and it feels like watching a comedy show.

[@sajeevanfuels1980]

Man you are just so talented and such such amazing teacher and ofcourse a marvellous coder!

[@nostalgicnow6001]

I can watch him all day. I love your style of teaching

[@somalibeebs6092]

thanks for all that energy you releasing just to teach us javascript. most teachers are not so energetic.

[@yashchauhan5710]

love the way you teach ...... really nice all those concepts goes straight inside

[@waltercisneros9535]

New to javascript and i've been using console.log(); for print(); stuff... what a time to be alive

[@volhash3605]

OMG! Thank you SOOO much for the video! You explained it so well!

[@faribadadko5694]

You are awesome!! I'm advertising your video all over my coding cohort! Thank you!

[@FaLkraydz]

Thank you very much, you helped me so much about classes and promises, trying to understand both together is not easy.

[@MubarkAlKhatlan]

The reason why I changed my major from computer science to Mathematics back in 2009 is recursive function and classes with a very bad teacher. Watching your videos made it looks easy. You are a good teacher, Sir.

[@davidrobertson5996]

Really good introductory explanation of classes, thanks Dan.

[@bartomiejsadecki8309]

You've got so much charisma dude! Thanks for this video!

[@siten1]

I love you sense of humor; subscribed and thank you!

[@helliandrosoutohenrique8931]

I'm really enjoying your teachings. Thank you!

[@WeirdStuffaaaa]

best coding teacher i ever had

[@ndukwearmstrong]

Code Train is great, hes rilli intelligent. Makes the most complex things a piece of cake

[@baumian.]

You're honestly just such a good teacher. Your humor is just great and you're explaining everything really well. Thank you! EDIT: Thanks for the heart

[@whatsnewnow4469]

thanks you gave the actual idea what does class does thankssssssss a lot. i liked your enthusiasm throughout the video.

[@arshamazami159]

The best explanation for classes and oop programming thank you mr shiffman for your efforts 👌

[@eoin4150]

Excellent video, only decent content I could find on this stuff! Thanks.

[@namansharma4669]

I am so thankful I found this video, this person and his bubbles

[@kamoroso94]

I think you did a great job at explaining the role of the `this` keyword in a class! I just wanted to respond to something you said around 12:38 about where you can define the class. You should define the class before you instantiate it. If you tried to create an instance of a class in the global scope above the class definition, it wouldn't work, so the class should be defined before the rest of your code runs, generally.

[@TheCodingTrain]

Thanks for this tip!

[@alwaysloud-zs1ce]

mad scientist's vibes 🖤 love it, thanks for the video series!!!!!!!!

[@Karlponken]

Great explanation, always had a hard time understanding classes and their uses. Much appreciated!

[@bernardnoctor5627]

why is it you have icebergs in summer time is it because ice melts in summer?

[@Karlponken]

@@bernardnoctor5627 What? 😄

[@snimerjotsingh5561]

watching in 2020 , it is really helpful ,watching the full playlist from the start so didn't understand first time and now it is clear . please arrange your youtube page so we can find every video clearly thank you soooo much !!!!!! I wish you were my professer and also i am very young 12 years

[@mumuhKUH]

I always love your "meta-comments" about the video itself.

[@desmondkrummeck5953]

Good Fun to watch and helped me to make sense of Class, thank you.

[@SharonKerenTLV]

Excellent, as always, you are a very very very good teacher!!!

[@kingsolomon_fitness]

Your explanations are crazy beautiful bro!

[@jahelsantiago]

you and julioprofe are the best teachers in all internet

[@marklong721]

What a teaching! What a teacher

[@j653vup]

Love the energy, the white board and the explanation

[@Nostradamus21b]

This guy is a GENIUS. Greetings from CHILE.

[@CaptainSchlockler]

You're actually quite a good lecturer

[@empathy9963]

All of your work is so impressive.

[@muhammadsafiullah8428]

I paused the video just to comment that you are awesome. I love you ♥♥♥♥

[@wdwdHenry9022]

If you were my teacher back in school I would now have been a much better version of my self

[@josepena-bk8wd]

You are a genius , philosofy and Programming are connected

[@ChongHwi]

Short and sweet, thanks for the great video