16.17: Inheritance in JavaScript - Topics of JavaScript/ES6

  Рет қаралды 79,625

The Coding Train

The Coding Train

Күн бұрын

Пікірлер: 140
@seancpp
@seancpp 5 жыл бұрын
Love the video! Just one thing: Make sure to clarify that the ES6 classes are still using the same prototypal inheritance as normal JS, and shouldn't be confused with the way inheritance works in languages like C++ and Java. (only the syntax is similar) The prototype chain and the quirks of the "this" context are all still present. The syntax for classes in ES6 hides this fact and can cause a lot of confusing errors. Hope this makes sense.
@TheCodingTrain
@TheCodingTrain 5 жыл бұрын
Yes, this is a very good point!
@toastyPredicament
@toastyPredicament 2 жыл бұрын
I put the thing back on
@toastyPredicament
@toastyPredicament 2 жыл бұрын
How did I get weird money
@toastyPredicament
@toastyPredicament 2 жыл бұрын
The superset
@toastyPredicament
@toastyPredicament 2 жыл бұрын
OMG
@CodingAdventures
@CodingAdventures 2 жыл бұрын
Oldies but goldies. This is a nice video with a good explanation!
@PuzaExplores
@PuzaExplores 5 жыл бұрын
I have always dreamed of a teacher like you 😍.
@kathy9124
@kathy9124 4 жыл бұрын
Me too! 🤗
@aymenfyi
@aymenfyi 2 жыл бұрын
me too
@williamhorn411
@williamhorn411 2 жыл бұрын
I love how straight-to-the-boint this video is!
@Patrick-iy1rb
@Patrick-iy1rb 5 жыл бұрын
You are my new favorite teacher. I hope you'll decide to start teaching full JavaScript courses and sell them at Udemy or something.
@danielluna7648
@danielluna7648 3 жыл бұрын
Great video! I like how this series dives into the theory and what's happening under the hood and why more than your typical videos. I'm not the type of person who can just say "because that's how it works", I have to know WHY. So thank you.
@WaseemYusuf
@WaseemYusuf 5 жыл бұрын
Honestly, these videos are so wholesome, I never thought the day would come where I'm gonna watch OOP explanation videos on KZbin just to brighten up my day, but here we are.
@samplower5860
@samplower5860 5 жыл бұрын
wholesome like your mom.
@aparnaiyer5873
@aparnaiyer5873 3 жыл бұрын
How wonderful! Your energy is infectious, thanks sir!
@iamamirali3424
@iamamirali3424 3 жыл бұрын
I couldn't understand how to use Super correctly to inherit the mother class until I found your video. Thanks for this paranormal energy!
@oksanaserhiivna2634
@oksanaserhiivna2634 5 жыл бұрын
I wish all videos about JS were the same expressive and enthralling as yours. :) Many thanks for your work!
@lukasluftlaufer1093
@lukasluftlaufer1093 4 жыл бұрын
Oh Daniel, you helped me once again so much! Thank you for these videos!!! You really are the best.
@mattmmilli8287
@mattmmilli8287 5 жыл бұрын
Your dedication to educating about JS is impressive. I hope this channel pays of for you in the end even if that is not the goal.
@kabirrsinghsahni7792
@kabirrsinghsahni7792 4 жыл бұрын
He has the all-new ways to learn code, cheers!
@Jbortoletto
@Jbortoletto 5 жыл бұрын
Hi Mr. teacher! Your classes are awesome, no matter if subjects are simple or complex. Thank you for sharing and inspiring!
@mshahzebraza
@mshahzebraza 2 жыл бұрын
Wow! It's real fun to see your code. You're so immersed in what you're doing brother. Keep it up!
@mxc_clips
@mxc_clips 4 жыл бұрын
Your videos are the best. I am smiling while learning and watching a js tutorial. I always hope that someday I could take my skills and become a teacher to the next generation of programmers and I strive to be as good a teacher as you!
@PiyushKumar-qj8ue
@PiyushKumar-qj8ue 5 жыл бұрын
Expert, always motivating me.
@pinkleprechaun52
@pinkleprechaun52 2 жыл бұрын
The most adorable teacher on youtube
@hoxas
@hoxas 3 жыл бұрын
Best teacher ever, lol burst out laughing at boint.
@johnjohnson4484
@johnjohnson4484 5 жыл бұрын
your tuts are the gold standard here on yt
@ashwinramaswamy4059
@ashwinramaswamy4059 3 жыл бұрын
For those using the Processing desktop editor - you might sometimes get a weird console error saying the superclass name is not defined when you try to extend it. I think this is because the editor rewrites index.html to always execute your .js files in alphabetical order of their filenames. So if you make a file 'B.js' and another 'A.js' where class A extends class B, you'll get a console error saying 'B is undefined', because it executes the subclass first. My solution is to just rename your subclasses to something beginning with a different alphabet, but it's a weird editor bug I think.
@ShaneLeeCoding
@ShaneLeeCoding 5 жыл бұрын
When I was learning Java, Interitance was something that took me a while to get my head around. I wish I had this video when I was learning this. You've made this way more clear than anyone else. Thanks Daniel.
@hi-techlogics3831
@hi-techlogics3831 3 жыл бұрын
You are a universal treasure.
@kingundfaker
@kingundfaker 4 жыл бұрын
Inheritance starts at 7:20
@charlesngerem3198
@charlesngerem3198 2 жыл бұрын
You're simply a blessing
@juliofslt
@juliofslt 3 жыл бұрын
I think I already found my fav coding channel on YT, you make the learning process really enjoyable! :)
@vishank7
@vishank7 4 жыл бұрын
It feels sooo good to understand something like this! Thank you sir!
@sydneyhill655
@sydneyhill655 3 жыл бұрын
Thanks!
@TheCodingTrain
@TheCodingTrain 2 жыл бұрын
Thank you for the support!!
@codybui6252
@codybui6252 2 жыл бұрын
Wonderful lesson. Thank you very much.
@nicchunglow
@nicchunglow 3 жыл бұрын
You are really good at teaching!
@FernandoPonteFilho
@FernandoPonteFilho 5 жыл бұрын
It's awesome to have english subtitles, thanks.
@kingykronous2284
@kingykronous2284 5 жыл бұрын
I've recently discovered your channel and I love it!
@d_v_d1070
@d_v_d1070 5 жыл бұрын
happy to see concepts as such explained.
@shaimaa3424
@shaimaa3424 4 жыл бұрын
U made me love Coding 😍😍😍😂😂
@pierrem2983
@pierrem2983 5 жыл бұрын
I finally realized that you have to be a good programmer to code in JavaScript
@osamasy5802
@osamasy5802 4 жыл бұрын
You are really the best @😊
@bestformspielt
@bestformspielt 5 жыл бұрын
Your hand drawn curly braces are outrageous! ;)
@tntdogs6910
@tntdogs6910 5 жыл бұрын
Nice video, helped me. I'm doing web-components now in my comp sci class
@imajt5
@imajt5 5 жыл бұрын
Wow, you are awesome. Really great explanation.
@reimarpb
@reimarpb 5 жыл бұрын
Awesome! Btw I do like it when you start explaining classes and everything, even though I already know that and I'm here to learn about inheritance, but it does make it easier to understand
@lavdixit2267
@lavdixit2267 4 жыл бұрын
you explained it very well
@rdmammad5721
@rdmammad5721 4 жыл бұрын
Perfect tutor ever😂
@misdi_official
@misdi_official 5 жыл бұрын
love it
@halimchu9346
@halimchu9346 4 жыл бұрын
super duper helpful! Thank you!
@7Chikchan
@7Chikchan 5 жыл бұрын
Really appreciate your videos! Learned a lot from you
@marnix2452
@marnix2452 5 жыл бұрын
It would be cool if you make an implementation of the strategy design pattern. It follows the design principle "favour composition over inheritence"
@RSkyCar
@RSkyCar 5 жыл бұрын
Thank you Daniel! It was really useful stream, I learned a lot, so it's all makes sense now, how to write less code and organize a project. Hope you continue with Polymorphism in the next video.
@luismolinatanco1330
@luismolinatanco1330 3 жыл бұрын
I am 49 yrs old. I grew as a programmer with c++. Since 2007 or so I use Processing and Arduino in my teaching. I love your videos and from watching them I’m wondering if I should be teaching p5.js instead of Processing. My students are Fine Arts students. I would love to have a conversation with you about this!
@carlkitstie
@carlkitstie 2 жыл бұрын
You are just amazing
@aleksd286
@aleksd286 5 жыл бұрын
As a JS developer I can say that composition is preferred over inheritance. Please do a video about it, people will love it 😀
@TheCodingTrain
@TheCodingTrain 5 жыл бұрын
Can you link to some good resources so I can read up on and research?
@aleksd286
@aleksd286 5 жыл бұрын
@@TheCodingTrain I think this article explains it well. medium.com/humans-create-software/composition-over-inheritance-cb6f88070205
@bluestonecreeper720
@bluestonecreeper720 5 жыл бұрын
Hi coding train. Take a look at the came screeps. Good vid
@paraschavan014
@paraschavan014 5 жыл бұрын
Wooo I am learning inheritance (Java) In my college
@AhmadAlmutiry
@AhmadAlmutiry 5 жыл бұрын
Thank you, May you explain what difference between abstraction and encapsulation?
@liamrobertson2670
@liamrobertson2670 5 жыл бұрын
You should go over getters and setters. Factory functions would be great too
@TheCodingTrain
@TheCodingTrain 5 жыл бұрын
Oh good idea! Please suggest here! github.com/CodingTrain/Rainbow-Topics/issues
@xomayaaxo
@xomayaaxo 5 жыл бұрын
dude you're awesome
@grahamhelton5395
@grahamhelton5395 5 жыл бұрын
So to create the Tree, you would for example (in place of Particle class) have Animal class and then the (in place of Confetti class) have 'class Mammal extends Animal'? To do the tree would the next just be for example 'class Four legs extends Mammal' or 'class Four legs extends Animal'? Does the new class become the new super class?
@TheCodingTrain
@TheCodingTrain 5 жыл бұрын
You can do either! But "class FourLegs extends Mammal" would by definition also extend Animal, but not the other way around!
@slyer7695
@slyer7695 5 жыл бұрын
Love from Italy!!!! ❤️❤️❤️❤️ 🇮🇹 #LoveFromItaly8
@hailahong3021
@hailahong3021 5 жыл бұрын
Man. That’s what I need
@grainfrizz
@grainfrizz 5 жыл бұрын
C# does object oriented the best way possible (in my own opinion). Abstract, interface, struct...these are all super intuitive. But I understand that JS is interpreted lang and is not strongly typed. That's why it so short-handed.
@forktrader7870
@forktrader7870 5 жыл бұрын
hello kababayan. 😂 JS is a gift and curse. they have simple class object capacity but it helps other professonals to create something that doesnt need to dig deeper the behind object-oriented programming and shoot their feet with diamond object problem etc. and no need VS download/setup on their system. anyways, thats your opinion. keep it up kababayan. ✌️
@josephgaribaldi4340
@josephgaribaldi4340 5 жыл бұрын
I'm one of the people that's beeen watching you from the future. So had the opportunity to notice your hair styles evolution .... from happy relaxed to happy "businessman" style. So is this latest style just temp?
@zacharymcarthur9013
@zacharymcarthur9013 5 жыл бұрын
I’m curious you said that a class can only inherit one other class, do you mean for example I couldn’t say “class Bat extends mammal, bird” to for example get the mammal class and as well pull flight from the bird class? I hope that makes sense. Thank you.
@frankkj1995
@frankkj1995 3 жыл бұрын
Boint! Ha that made me chuckle :)
@ellpell6550
@ellpell6550 Жыл бұрын
Nice thanks
@russellge2372
@russellge2372 4 жыл бұрын
Thank u so much, sir!
@horseoperamarker
@horseoperamarker 3 жыл бұрын
yes
@limitless1692
@limitless1692 4 жыл бұрын
Thanks
@Thanveershah
@Thanveershah 5 жыл бұрын
I challenge you to create an animated colorful smoke , You are amazing btw
@lubomiratanasov6714
@lubomiratanasov6714 5 жыл бұрын
Hi, I would like to know, what is the difference between Class-Inheritance and Object-inheritance. Thank you.
@forktrader7870
@forktrader7870 5 жыл бұрын
do you really need different classes to work with? and is it really bad to have conditionals within the class? example I have BigDataGrid class, do I really need to create separate DataGrid for each report? it seems highly maintainable in the future but highly quite alot to type with. anyway, thanks for the idea.
@adamnejm
@adamnejm 5 жыл бұрын
If you need a nice example here you go. Change classes using SPACE, hold Mouse1 to draw: let interval = 0, id = 0, objects = [], classes = []; function setup() { createCanvas(500, 500); //frameRate(60); } function draw() { background(255); objects.forEach(p => { p.update(); p.render(); }); if(mouseIsPressed) if(!(++interval % 5)) objects.unshift(new classes[id%3](mouseX, mouseY, 20)); } function keyPressed() { if(keyCode == 32) id++; } class Particle { constructor(x, y, r) { this.x = x; this.y = y; this.r = r; } update() { this.x += random(-2, 2); this.y += random(-2, 2); } render() { ellipse(this.x, this.y, this.r); } } classes[0] = class Square extends Particle { constructor(x, y, r) { super(x, y, r); this.t = millis(); } render(){ let s = sin((millis() - this.t)/100)*10 rect(this.x, this.y, this.r + s, this.r + s); } } classes[1] = class Circle extends Particle { update() { super.update(); this.r = sin(millis()/500) * 10 } render(){ ellipse(this.x, this.y, this.r); } } classes[2] = class Line extends Particle { update(){ this.x += 1; } render(){ line(this.x, this.y, this.x + this.r, this.y); } }
@jeranto24
@jeranto24 5 жыл бұрын
SENSEIIII!!
@idontwantmynameinhere
@idontwantmynameinhere 5 жыл бұрын
Are you going to make videos on polymorphism and encapsulation? And if you already did, where can I find those videos?
@TheCodingTrain
@TheCodingTrain 5 жыл бұрын
Here's a video about the basic idea of OOP (encapsulation) - kzbin.info/www/bejne/il6reJeZbbFgbdk - and the polymorphism video will come out later today or this weekend.
@hussainsalih9736
@hussainsalih9736 5 жыл бұрын
I want ask you how to read text file in javascript???
@0100-f1v
@0100-f1v 5 жыл бұрын
use fs
@hussainsalih9736
@hussainsalih9736 5 жыл бұрын
Thank you
@toxin0343
@toxin0343 5 жыл бұрын
could you use the super keyword for the show function for example show(){ super.show() fill(this.bright) square(this.x, this.y, this.r) } or would it cause errors or would it just draw it as a circle . edit: I will be trying this myself and will comment what happens but wanted to comment in-case I forget
@TheCodingTrain
@TheCodingTrain 5 жыл бұрын
Yes, you can do this! In the case above it'll draw both the circle and the square.
@toxin0343
@toxin0343 5 жыл бұрын
@@TheCodingTrain and would they be at the same x and y position? Would the square be on top because it runs after the particle? Thanks for the quick response
@TheCodingTrain
@TheCodingTrain 5 жыл бұрын
@@toxin0343 Indeed they would be at the same x,y b/c each object only has that one x,y! It's the same as if you had called circle() directly in show().
@toxin0343
@toxin0343 5 жыл бұрын
Thanks for the quick reply love the channel
@palinejs
@palinejs 5 жыл бұрын
Great!
@alexblue8524
@alexblue8524 5 жыл бұрын
I wanted the code from this video. does someone knows how can I get that ?
@eduardwille1711
@eduardwille1711 5 жыл бұрын
Copy it by looking at what they typed ;)
@OptimusPrimeagar
@OptimusPrimeagar 4 жыл бұрын
Can you have more than one inheritance? For instance class Confetti extends particle extends circle ?
@kingundfaker
@kingundfaker 4 жыл бұрын
He says this at the end. The answer: no , but you can have a child class of a child class.
@tntdogs6910
@tntdogs6910 5 жыл бұрын
nice shirt man, where did u buy it?
@jochenpanjaer980
@jochenpanjaer980 5 жыл бұрын
Where is the video about encapsulation in ES6?
@TheCodingTrain
@TheCodingTrain 5 жыл бұрын
I think I cover it in this one? kzbin.info/www/bejne/il6reJeZbbFgbdk
@kikawet
@kikawet 5 жыл бұрын
What IDE are you using?
@TheCodingTrain
@TheCodingTrain 5 жыл бұрын
VSCode, more here: kzbin.info/aero/PLRqwX-V7Uu6Zu_uqEA6NqhLzKLACwU74X
@maheshkotal4214
@maheshkotal4214 5 жыл бұрын
Hello sir, can you add index. Html page, I need to see the code
@TheCodingTrain
@TheCodingTrain 5 жыл бұрын
This workflow video series might help! where I go over all the pieces. kzbin.info/aero/PLRqwX-V7Uu6Zu_uqEA6NqhLzKLACwU74X
@tomgibbons2230
@tomgibbons2230 5 жыл бұрын
Is Nodes implementation of JS different? This doesn't work for me - the super(x,y) is not a valid keyword. Regardless, great video. You're the man! :-)
@MrAfusensi
@MrAfusensi 5 жыл бұрын
A
@danushkaanurada6936
@danushkaanurada6936 5 жыл бұрын
What is that editor name..
@TheCodingTrain
@TheCodingTrain 5 жыл бұрын
VSCode! For more: kzbin.info/aero/PLRqwX-V7Uu6Zu_uqEA6NqhLzKLACwU74X
@bestformspielt
@bestformspielt 5 жыл бұрын
composition over inheritance! just saying. :)
@lee_sung_studio
@lee_sung_studio Жыл бұрын
14:28
@mrlectus
@mrlectus 5 жыл бұрын
i wish i could type fast like you do
@poornamith
@poornamith 5 жыл бұрын
VS Code
@toastyPredicament
@toastyPredicament 2 жыл бұрын
Oh Dan
@toastyPredicament
@toastyPredicament 2 жыл бұрын
Pls be ok
@lthoedt
@lthoedt 5 жыл бұрын
i have to do it FIRST
@mvmo4744
@mvmo4744 5 жыл бұрын
Somehow classes in JavaScript feel wrong to me :(
@sifatmoonjerin2479
@sifatmoonjerin2479 4 жыл бұрын
I miss my Bubble... :(
@toastyPredicament
@toastyPredicament 2 жыл бұрын
Sleepy pill for dream please
@ultimade9610
@ultimade9610 5 жыл бұрын
Third
@robotosailr2129
@robotosailr2129 4 жыл бұрын
now understand es6 better
@wanafnanhariz7650
@wanafnanhariz7650 4 жыл бұрын
i really like your videos, i do, but the theme(rainbow, unicorn and stuff) ,is not that i dont like them, its just remind me of weed...and make me wonder why u use that theme... XD
@benchilcott6908
@benchilcott6908 5 жыл бұрын
this.boint
@hi-techlogics3831
@hi-techlogics3831 3 жыл бұрын
Love from Pakistan
@geoffwagner4935
@geoffwagner4935 Жыл бұрын
Fallout 76 called "me" the Monet of Murder, i think it has the wrong Monet, this person just doesn't see anything right in anything either does he. look at him, discriminating so viciously all over on this pooor little particle like this :O *gasps*
16.18: Polymorphism in JavaScript - Topics of JavaScript/ES6
9:29
The Coding Train
Рет қаралды 65 М.
Coding Challenge 180: Falling Sand
23:00
The Coding Train
Рет қаралды 1 МЛН
Mom Hack for Cooking Solo with a Little One! 🍳👶
00:15
5-Minute Crafts HOUSE
Рет қаралды 21 МЛН
How many people are in the changing room? #devil #lilith #funny #shorts
00:39
“Don’t stop the chances.”
00:44
ISSEI / いっせい
Рет қаралды 42 МЛН
小丑教训坏蛋 #小丑 #天使 #shorts
00:49
好人小丑
Рет қаралды 33 МЛН
JavaScript Classes Tutorial
1:01:29
freeCodeCamp.org
Рет қаралды 291 М.
16.3: ES6 Arrow Function - Topics of JavaScript/ES6
22:32
The Coding Train
Рет қаралды 273 М.
Inheritance between function constructors in JavaScript
20:48
JavaScript Prototypal inheritance - Tutorial
15:29
ColorCode
Рет қаралды 85 М.
Dependency Injection, The Best Pattern
13:16
CodeAesthetic
Рет қаралды 896 М.
Object-Oriented Programming is Bad
44:35
Brian Will
Рет қаралды 2,3 МЛН
The Flaws of Inheritance
10:01
CodeAesthetic
Рет қаралды 977 М.
JavaScript OOP Crash Course (ES5 & ES6)
40:21
Traversy Media
Рет қаралды 593 М.
Inheritance in JavaScript - Prototypal Inheritance tutorial
20:06
Mom Hack for Cooking Solo with a Little One! 🍳👶
00:15
5-Minute Crafts HOUSE
Рет қаралды 21 МЛН