Тёмный
No video :(

Class keyword - Object Creation in JavaScript P7 - Fun Fun Function 

Fun Fun Function
Подписаться 263 тыс.
Просмотров 75 тыс.
50% 1

💖 Support the show by becoming a Patreon
/ funfunfunction
The class keyword was added to JavaScript in ES6. On the surface, class seems to works like you’d expect, but if you look just a little closer you’ll see that class is just a thin veil on top of the existing prototypal inheritance model. In this video, I try to convince you that you should focus on learning JavaScript inheritance properly, in order to understand the mechanics of the class keyword in JavaScript.
This series is called Object Creation in JavaScript, and is meant to be a deep dive in how object creation works in JavaScript, the different ways that you can create objects and how it all fits together.
🔗 Series Playlist - Object Creation in JavaScript
[ • bind and this - Object...
🔗 Inline evaluation plugin
quokkajs.com/
🔗 Composition over inheritance
• Composition over Inher...
🔗 The ’new’ keyword
• The 'new' keyword - Ob...
🔗 Functional Programming in JavaScript series
• Higher-order functions...
🔗 Help translate the show to your language
www.youtube.com...
💛 Follow on Twitch and support by becoming a Subscriber
We record the show live Mondays 7 AM PT
/ funfunfunction
💛 Fun Fun Forum
Private discussion forum with other viewers in between shows. www.funfunforu.... Available to patron members, become one at / funfunfunction
💛 mpj on Twitter
/ mpjme
💛 CircleCI (Show sponsor)
Robust and sleek Docker-based Continuous Integration as a service. I used CircleCI prior to them becoming a sponsor and I love that their free tier is powerful enough for small personal projects, even if they are private. Use this link when you sign up to let them know you came from here:
circleci.funfu...
💛 Quokka (Show sponsor)
Wonder how MPJ evaluates JavaScript inline his editor. Quokka is the answer - use this link when you buy to let them know you came from here:
quokka.funfunfu...
💛 FUN FUN FUNCTION
Since 2015, Fun Fun Function (FFF) is one of the longest running weekly RU-vid shows on programming 🏅 thanks to its consistency and quality reaching 200,000+ developers.
🤦‍♂️ The Failing Together concept is what makes FFF unique. Most coding content out there focus on step-by-step tutorials. We think tutorials are too far removed from what everyday development is like. Instead, FFF has created a completely new learning environment where we grow from failure, by solving problems while intensively interacting with a live audience.
Tutorials try to solve a problem. Failing Together makes you grow as a developer and coworker.
📹 Each show is recorded live on Twitch in a 2-hour livestream on Mondays. The host, assisted by the audience, is tasked to complete a programming challenge by an expert guest. Like in the real world, we often fail, and learn from it. This, of course, reflects what the audience identifies with, and is one of the most praised aspects of the show.
⏯ On Fridays, an edited version of the show is adapted for and published on RU-vid.
Content Topics revolve around: JavaScript, Functional Programming, Software Architecture, Quality Processes, Developer Career and Health, Team Collaboration, Software Development, Project Management

Опубликовано:

 

27 авг 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 290   
@johnswanson217
@johnswanson217 2 года назад
I miss you man. Your videos are very funny and straight forward.
@slidewineder3953
@slidewineder3953 7 лет назад
object creation in javascript is my favorite series on youtube
@frozen_tortus
@frozen_tortus 7 лет назад
"Fluffykins is tiny dragon that breaths fire" -- MPJ
@rayrack5416
@rayrack5416 7 лет назад
I'm thinking vampiric cotton tail rabbit.
@viniciusalbuquerque8030
@viniciusalbuquerque8030 7 лет назад
If JavaScript continue to bow down to that new people coming in, we'll have a programming language monster.
@coolworx
@coolworx 7 лет назад
I agree. Classes are exactly what MPJ described... some out-of-place, clumsy accouterment - haphazardly stapled to the prototypical functional nature of JS. Just to appease the lazy and arrogant Java and C# crowd.
@coolworx
@coolworx 7 лет назад
Nope.. I've watched seasoned programmers REFUSE to learn something new. The arrogance know-it-all runs deep.
@dysonlu
@dysonlu 7 лет назад
With the popularity of React, the prominence of classes in Javascript will only get worse. (Yes, you can use the module pattern but the React community is favoring the way with classes.)
@MrRiesable
@MrRiesable 7 лет назад
Great video! It needed a long time to realize that inheritence is not possible in the classical sense (with private members, etc,...). Now I have found my way out with factory functions and composition and I felt in love with javacript. You should do more videos on this topic! :)
@SK-iv4ml
@SK-iv4ml 7 лет назад
tldr: don't do meth in rome
@JohnBehan
@JohnBehan 7 лет назад
Is that an example of dependency injection?
@im.empimp
@im.empimp 7 лет назад
+Dmitriy Getma actually, "It's always better to coock on your own."
@JohnWick-rc9qq
@JohnWick-rc9qq 6 лет назад
*slow clap*
@sinistar99
@sinistar99 5 лет назад
OMG you beat me to it! I was going to say "Meth: not even once"
@efreitorhabibulin238
@efreitorhabibulin238 7 лет назад
YES, the world needs more of these videos! ...not a joke and im not being sarcastic, the world actually needs more of this info out there.
@DigitalMonsters
@DigitalMonsters 7 лет назад
Good Monday Morning, the thing I look forward to hearing every week
@cheeseburger1884
@cheeseburger1884 7 лет назад
Yes, JavaScript videos again
@WMTeWu
@WMTeWu 7 лет назад
Private properties trick ? What about this: const sound = Symbol() export class Mammal { constructor() { this[sound] = "My private sound" } } We can access sound property only when we have access to "sound" const. This is more like "module private" then "class private", but still.
@funfunfunction
@funfunfunction 7 лет назад
+WMTeWu yeah, this is a really neat trick that ES6 allows us to do!
@trappedcat3615
@trappedcat3615 6 лет назад
This works -- using object.assign and object.create // Class Person const Person = ({name, type = 'robot'}) => { const age = 27 // private return Object.freeze({ type, describe () { return `${name}, a ${this.type}, is a ${this.mood} ${age} year old.` }, getName() { return name }, getAge() { return age } }) } // Worker extends Person const Worker = (props) => { return Object.assign( Object.create(Person(props)), { mood: 'happy' }) } // Dude is a new Worker const Dude = Worker({name: 'Joe'}) Dude.describe() //=> 'Joe, a robot, is a happy 27 year old.'
@nathancornwell1455
@nathancornwell1455 4 года назад
@@funfunfunction Or you can use proxy( ) ..... const handler = { set(obj, prop, value) { for(let key in obj) { if(prop === key) { console.log('Dont you dare touch my properties'); } } } } const objProxy = new Proxy({ name:'gary', age: 34, id: '34n34j9fn34' }, handler); You can also do a lot of other really interesting things with proxy() but this can make an object's properties immutable .
@AndyRocket1000
@AndyRocket1000 2 года назад
Thankyou for This video MPJ. I followed you when you made the videos. But I see now. I was not good enough to Get something out of it. This video changes the game for me. Something about the classes felt wrong. I had A problem with method overloading. And that led me in to the path Im on now. Rewriting gigantic class objects to many function and learning the nature of this beast called Javascript. Im looking forward to watch your functional programingseries🙏
@arushibajpai8113
@arushibajpai8113 5 лет назад
Annnnndddd i have sucessfully completed the series .. So happy!!!!
@Tracks777
@Tracks777 7 лет назад
Brilliant work! Keep it up!
@gchamaa
@gchamaa 6 лет назад
Thank you for a wonderful explanation. Finally, i do feel relieved. That 'class' keyword has been really bothering me and now I'm happy to know that it's actually just a sugar keyword for basic prototypal inheritance.
@twfahey1
@twfahey1 7 лет назад
Another great video! Thanks for enlightening and entertaining me on a rainy Monday morning in Austin, TX! Really appreciate all your wisdom and insights!
@dmh20002
@dmh20002 7 лет назад
The one reason i like 'class' in JS is that it provides a single way of creating objects rather than having to agree on one of the several other conventions.
@eugenea8264
@eugenea8264 6 лет назад
Oh, you made me watch all series. And it was great.
@moistbrownypoints
@moistbrownypoints 7 лет назад
14:00 Yes. You will. Funny comparing OOP to meth though. We make people feel less ashamed of OOP by helping them use it, then they don't feel condemned when they ask for help to get off of it. So this clean needle might still serve its purpose.
@funfunfunction
@funfunfunction 7 лет назад
+Dewald Laubscher interesting observation there, did not think of that.
@alebrozzo
@alebrozzo 7 лет назад
Kind of what VB.NET was created for...
@loayzag91
@loayzag91 7 лет назад
"This video... oh my god. I just found f***ing gold." This topic has been entirely confusing to me for almost a year now, which is to say 'since I started learning Javascript' Thank you, mpj.
@Will-tb8qm
@Will-tb8qm 7 лет назад
Nice to have a break from the other series.
@viraj_singh
@viraj_singh 5 лет назад
2:30 great advice MPJ, will always remember that.
@abudayah
@abudayah 5 лет назад
Public and private field declarations are an experimental feature (stage 3) proposed at TC39, the JavaScript standards committee. Support in browsers is limited, but the feature can be used through a build step with systems like Babel. developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes
@ViniciusDallacqua
@ViniciusDallacqua 7 лет назад
Great episode! Whenever talking about JS 'classes' I like to illustrate how it is just really delegation on the prototype chain by screwing with 'extends'. Nothing seals the deal better :D
@MicahBales
@MicahBales 6 лет назад
I had been reading the documentation for JS classes and just couldn't wrap my head around `super()` for some reason. Thanks for explaining it so succinctly and clearly - that super() is effectively the constructor of the inherited classes - and arguments passed into it are passed as into that constructor!
@Ellyll
@Ellyll 7 лет назад
What are your thoughts on languages that compile down into JavaScript like TypeScript or CoffeeScript? (Especially as TypeScript is used for Angular now)
@funfunfunction
@funfunfunction 7 лет назад
+Ellyll I'm personally not a type person. They distract me tremendously and I end up spending vast amounts of time putting things in buckets. JavaScript just keeps me more focused on the task at hand. I'm not against types per se, types just works extremely badly for me productivity wise. It also causes me to write less tests, because they give me a false sense of security. Static types also tend to make testing significantly harder (TypeScript is less of an offender here though). Some type systems are better than others, Rust is pretty good and does a lot of work for you instead of, like many type systems do, making me go on quest to invent types (and worse, names) for simple things that don't benefit from that rigor. TypeScript is very popular among devs coming for C#, which worries me that we'll get a big generation of devs that write JavaScript like C# instead of learning ideomatic, more functional JavaScript. If you're learning TypeScript before learning JavaScript fully, I definitely think that you are making a mistake learning wise. I absolutely loathe the idea of it being crammed into a framework per default. I think that is a bad decision, as the benefits of TypeScript are not clear cut and universal enough to slam that on. I think that should be up to the team.
@steelful
@steelful Месяц назад
​@@funfunfunction 7 years later now, I would be really interested in hearing if you feel the same way now. I am myself an always-Typescript developer that learned JavaScript fundamentals like prototype 6-7 years ago watching Fun Fun Function and Meth Meth Method. During this time, I have almost only used the "class" style of creating objects. I feel like I'm missing something. I should probably look deeper into composition. I would love to hear your thoughts on this. (And I'm looking forward to the new data developer videos your working on)
@aleksd286
@aleksd286 5 лет назад
UPDATE! Private class fields coming soon. More about it: developers.google.com/web/updates/2018/12/class-fields In short, now fields in classes can have # hash before their name, making them private, and not accesable from anywhere else than the class itself.
@fifilulu
@fifilulu 4 года назад
Awesome! It's more about psychology than programming. I love it. I'm the guy who comes from C++. I definitively have to quit meth. I try hard ... Let's now watch the video on functional programming.
@Qbe_Root
@Qbe_Root 7 лет назад
You can make private properties though, just define your “class” in a closure alongside some local symbols. The symbols will be used as keys for your private properties, you can use them from inside your “class” (or inside the closure but you should still have full control over that), but no code outside of the closure can see the private properties, at least not without specifically looking for them with Object.getOwnPropertySymbols().
@YurickHauschild
@YurickHauschild 7 лет назад
Why did you ditched the paper sheets, mpj?
@nikhithajosh5425
@nikhithajosh5425 4 года назад
Wow... this playlist is just so great.... It's just what I wanted... Thankyou mpj
@PRATIK1900
@PRATIK1900 5 лет назад
I'm kind of doing the opposite. I am a JS beginner, and this idea was fed into me that classical inheritance is bad, by Medium articles by Eric Elliot (i hear he is notorious, but I have no idea if that is the case). So I really became focussed about learning prototypes well (at least it led to something fruitful, eh?), and now that I have a somewhat decent idea of it, it's still quite new for me and I don't wanna confuse myself and ruin my weeks (2 at least) of hard work by trying to understand classes in JS. So I think I will completely avoid classes for nor, and make do with the old school of using prototypes until I am comfortable with those fully. Then I will move onto classes. So, after covering 6 of the 7 videos on this series, I will pause here, and leave without watching the last one. Hopefully, I will be back before long, when its time, and then finally watch this, and add another tool to my arsenal. Happy learning folks :3
@Nate5466
@Nate5466 6 лет назад
Dude, you explain things well. kudos
@vpetevotov
@vpetevotov 7 лет назад
Thank you for your videos and bright thinking :) You guided me to the right path! From my experience in some situations functional style really helps to get rid of all that redundancy, which pure OOP on classes brings. When I came to Javascript, I chose Typescript dialect, because I was familiar with C# and PHP. Some solutions are really hard to implement using class inheritance even with combination of composition in context of classes, when we instantiate, then share methods. Often, even in relatively simple tasks, we need to apply OOP patterns (like "Strategy") to avoid duplication and build abstractions properly. But as the result we have huge complexity and much code to read and support. I always thought it's ok to have just one tool (I mean pure classes) to solve almost the entire range of problems, but when I came to FP paradigms I was shocked how simple and elegant solutions can be. My personal philosophy is to use hybrid solutions, both class programming and functional approach, to get convenient solutions. The process of finding ways to do things simple and clear is very encouraging for me!
@funfunfunction
@funfunfunction 7 лет назад
+Biouda VV one subtle thing that an experienced FP programmer pointed out to me is that statically typed FP languages does not have design patterns like Strategy. They don't exist in that world and they have not arisen naturally either. This is because of two reasons: 1) typed functional programming is extremely expressive and you can express something like a Monad through the type system - in JS for example, the type system cannot check that we have a monad, we have to do that check manually and b) many designs patterns in OOP exists to solve problems that ONLY EXIST because of OO, as opposed to being essential to the actual problem we are trying to program.
@angusclark5736
@angusclark5736 6 лет назад
Thanks for the tip about Quokka, such a helpful little plugin.
@anthonypipkin
@anthonypipkin 7 лет назад
This "clean needles" metaphor made me laugh so hard. What a great way to phrase that idea. It's almost like the committee was scheming saying "no, no come to JavaScript. It's a wonderful language. See, we even have classes". But the best part of your phrasing was aligning class inheritance to meth hahaha Best things I've heard in a while! Keep up the great work!
@wormalism
@wormalism 7 лет назад
Classes in JS are as real as any other languages implementation. The only missing feature is private properties. However, using Typescript or Flow to type your JS you can have this in compile time. Compile time is the place for these kind of rules (oo languages like Java only do their checks at compile time, to the best of my knowledge, as well) because having runtime checks everywhere would make js painfully slow. If​ "real" private properties are absolutely required for some kind of security application then classes aren't the right choice in any language as you probably will need to implement some kind of encrypted messaging to properly conceal sensitive data.
@wormalism
@wormalism 7 лет назад
comet3bc13 That's mostly true. All I am saying is that JS classes are a perfectly valid implementation of the computer science concept of a class, and therefore​ should be considered "real" classes​. The Java runtime surprisingly makes almost no use of typing information at all (I'll provide a link shortly). At run-time Java objects are quite similar to JS in that they have their methods stored on shared objects that have an inheritance chain. All the type check guarantees and private member access prevention happens at parsing time, then the typing details are discarded. The ability to mess with prototypes is an amazing feature that makes JS future compatibility possible, however, if you're not writing a poly-fill or doing a crazy experiment for fun, just don't do that! Have linting rules to ensure your​ codebase doesn't do weird things like dynamically messing with the inheritance chain of objects. JS class behavior​ is as close to static language as is reasonable possible for a dynamic language that needs to jitted directly from code. Using Typescript (just a JS superset with types, not a different language) then you truly do have a full implementation of classes, as private member access and call signature for functions was all that was missing (I personally think that it would be wrong for this to be added in the language natively)
@leomontes5792
@leomontes5792 7 лет назад
great points... big companies will try to market to devs providing them with "familiar" environments, like MS did with their ASPX drag n' drop forms... which resulted in great chaos... same is happening with Angular 2.0 & typescript ... this mess does generate good revenue in cleanup projects later on, but harms business in the end...
@LuisVillamilSC
@LuisVillamilSC 7 лет назад
I started using classes for one proyect in work, and some of my colleagues just got angry at me because they say classes are just syntatic sugar and that i should not use them, but i don't get what the problem is if i understand that is just prototypal inheritance.
@billfarrar6153
@billfarrar6153 7 лет назад
I really want a mug that has that yellow strip with the words "When in Rome learn JavaScript" on it.
@forgettd
@forgettd 7 лет назад
I still think that that Class sugar is pretty nice tho. It makes 'classes' much more readable even despite prototype complexity. Also, private fields is in the working draft now so we can expect them. Therefore I would prefer using this syntactic sugar over just straight prototypes. Great video dude!
@funfunfunction
@funfunfunction 7 лет назад
Yeah, if you're absolutely hell bent on using classes, it's a distinct improvement over the old new model that we had prior to ES6.
@TehMapleDude
@TehMapleDude 7 лет назад
I agree, but I also want to add that a class-system will create a better sense of structure. I think for larger scale projects, it's easier to maintain a system where the client architecture is well defined. On top of that it opens more doors toward visualizing your code by using class diagrams for example. What are your thoughts on this MPJ?
@chakritlikitkhajorn8730
@chakritlikitkhajorn8730 7 лет назад
Class is not the only way to structure large scale program. I think modeling code in term of functions and data is more suitable for both javascript and many business domain. OOP is not the only a way to modeling your apps
@TehMapleDude
@TehMapleDude 7 лет назад
But don't you agree that using functional programming will eventually lead into a more disorganized solution? Or am I just too inexperienced in this area? I often get lost in my code when using js and nodeJs, but maybe that's because I have an object-oriented programming background.
@krisztianballa777
@krisztianballa777 7 лет назад
I believe factory functions are a better match for js. The only people embracing classes are people coming from classic oop languages. On the downside it makes people go into the wrong direction and avoid taking advantage of JavaScript's functional nature. The only thing I do not like in React is the use of classes whenever I need to use the lifecycle methods or local state.
@adamtolley5621
@adamtolley5621 6 лет назад
What I don't understand is why so many modern libraries seem to lean on constructors and classes, even when employing functional concepts, factories, etc. Somewhere along the line, usually as the single top level access to the api, or the actual thing that you require from the the NPM package, there it is, an uppercased (by convention) function you need to use new with. Maybe it's because fluent api's are (arguably) slightly easier (or harder) to write with classes, I don't know -- but every time I try to figure it out, my deep fear of new, class, and this seems to grow only deeper. I feel less alone when I watch these videos. But at some point I am going to fail a job interview though, because I cant remember the difference in this binding between arrow functions and function functions and lexical variable descriptors, and I am going to blame you for reaffirming my suspicions that closure makes it all moot.
@rebornreaper194
@rebornreaper194 6 лет назад
I realize this video is really old, but I'm curious -- if you're so against classes/OOP in Javascript, then what do you think of React and its Component classes, for example?
@funfunfunction
@funfunfunction 6 лет назад
I'm not against OOP. I think of it more like meat or sugar, it's something that isn't inherently bad, it's just something that we gorge ourselves on in the industry to cancer-producing levels. In React, I tend to use almost exclusively functional components.
@rebornreaper194
@rebornreaper194 6 лет назад
Ah, I see. Thank you for the feedback and for all of your great content -- after discovering you a few days ago, I have seen at least like 20-30 of your videos, and keep finding more and more I'm interested in! Also got my co-workers to take a look through your TDD in JS series, as we implement that in our team's new js development (coming from java and spring boot). You seem to have great knowledge, empathy, and experience -- all a great combination for a fantastic channel. :) Thanks again, and keep it up. 👍
@karlokidd
@karlokidd 7 лет назад
I'd like to get some insight into using functional programming to avoid using the class keyword. For example using functional components in React instead of extending the Component method.
@funfunfunction
@funfunfunction 7 лет назад
+Karlo Luis Martinez yep, this series is definitely building up to that ;)
@_danisson
@_danisson 5 лет назад
Im starting with javascript but i dont get when apply class in my regular website. In practice i can apply class animal and make objects like dog, cat or bear. But in a job website i dont know how to apply classes.
@coolworx
@coolworx 7 лет назад
Whenever someone is watching me type, I can't type. I can't imagine how bad I'd be if I had 86k folks watching me... You're doing stellar, MPJ
@tuxmusicman
@tuxmusicman 5 лет назад
I'm trying to pass an object that I created using this method and the variables are changed, but the variables for the object always reset when the object is used again.
@bagoquarks
@bagoquarks 7 лет назад
Has Douglas Crockford moved to Sweden?
@SongSeeker7
@SongSeeker7 7 лет назад
It's fun to try and mimic Inheritance in a crude way: function Mammal(sound) { let DATA = {}; DATA.sound = sound; let METHODS = { talk: function() { return DATA.sound; } } Object.setPrototypeOf(DATA, METHODS); return DATA; } function Dog() { let DATA = Mammal("wooOOF!"); let METHODS = { talk: function() { return `This dog says: ${ DATA.sound }`; } } Object.setPrototypeOf(DATA, METHODS); return DATA; } let monkey = Mammal("EeeEEEEEhhh!"); console.log( monkey.talk() ); let dog = Dog(); console.log( dog.talk() );
@rodbotic
@rodbotic 7 лет назад
so many great quotes.
@rafaellerescapone
@rafaellerescapone 5 лет назад
great video, as always. i do have a problem with the meth analogy, as needle programs are actually extremely helpful to get people out of meth, and it seemed like you implied that they're a bad thing, and i don't really agree with that. still just a detail that has nothing to do with the actual subject of the video, but i still felt like i should point it out
@zelaciaimen980
@zelaciaimen980 6 лет назад
Which book do you think is great for learning js?
@rayrack5416
@rayrack5416 7 лет назад
I've put this request in before but here it is once again since you have a new series specifically on Object Creation in Javascript. You previously did a video on factory functions and composition over inheritance and they were great. I was wondering if you could do a video in this series on the Revealing Module Pattern ala Classless OOP. I've read the opinions of Douglas Crockford on this topic and I would love to hear MJPs take (if there is anything else to add to this conversation). And of course, we need to bring back the clown rainbow trap!
@funfunfunction
@funfunfunction 7 лет назад
+Raymond R the idea of this series is actually to build up to that and then actually segueway into functional programming after that. :)
@rayrack5416
@rayrack5416 7 лет назад
Can't wait! I've been working my way through SICP which has been a REAL eye-opener for finally getting FP. Now when MPJ drops terms like, "Tail call optimization" I'm nodding my head instead of crying inside.
@kushal1
@kushal1 7 лет назад
I got the golden star as I guessed the talk.bind before you even started hinting or maybe started writing Dog.prototype.talk. Ummm..what can be be possibly doing with it ? Hehe. But yes, no specific use of class keyword without private property and all that etc. Liked the re-inforcement of "classes do not exist/ or are fake". Gotta watch Composition over inheritance for Wisdom. Waiting how it differs from prototypical inheritance which purely makes sense. However, I got super() first time since the recent inception of React learning.:D
@deriegle
@deriegle 6 лет назад
@mpj or anyone who can help. React uses classes for every component that you make extending React.Component. Is it losing speed or performance for using the "inheritance" and "class" keyword?
@funfunfunction
@funfunfunction 6 лет назад
No, speed or performance are benefits of classes, the problem is the complexity they add. It makes sense for React to use classes as they might actually be creating hundreds of thousands of objects per second.
@facundoflores9640
@facundoflores9640 7 лет назад
I've heard a lot of people saying that JS devs always mess up the code when you have a large project and teams, and this is the reason why many corporations are not confident on using only just vanilla JS (even ES6) and they prefer to use Typescript. Unluckly, I am a newbie JS dev and I could not find a project when JS is used correctly or successfully (if someone has good open source projects I would really like to see them, better if one of them is spotify :3), but I refuse to accept the first statement, JS is great, and the problems are devs, most of them coming from 3 months code-schools, or those who came from other languages trying to force their old patterns.
@ThePodux
@ThePodux 7 лет назад
Great video again :) I'm total agree with you. What do you think about typescript? It looks really like java or c# with classes and interfaces. But for me it feels like a thin corset :/ What do you think is the reason for companies like Google, to set on typescript for their newest framework ? (We are using Anguar 2)
@JBuchmann
@JBuchmann 6 лет назад
It's obviously not as good as Java/C#, but I personally think it's a great step forward. With Typescript "types", "classes", "interfaces", etc, editors like VS Code (works perfectly with Typescript) really help you stay on track and reduce errors. You instantly see errors at compile time (red underlines) when you set, say, a string to a number type, you miss an argument to a function or class call, etc. Also you get strong intellisense as you type which is a huge help. Not to mention you can also set things as private. I couldn't imagine creating a large JS application without it. (I'm also an Angular 2+ developer)
@muxahuk1214
@muxahuk1214 7 лет назад
You could explane the difference between static this and this inside the instance of the class. Usually noobies don't get this point.. As well - u didn't mentioned static at all )) Also u could use .call or .apply instead of .bind..
@RUKAclMortality
@RUKAclMortality 7 лет назад
class makes sense with TS compiler
@iminsik
@iminsik 5 лет назад
Do you use VS Code with some extension to show variables' values, like REPL? If you do, what's the extension?
@funfunfunction
@funfunfunction 5 лет назад
The awesome inline evaluation plugin is named Quokka, I demonstrate it in detail in this video: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-W4brAobC2Hc.html (Link to buy it is in the video description, if you use that link I get a kickback and it supports the production of the show)
@austen1314
@austen1314 6 лет назад
Isnt talk function in the prototype of the Mammal, but in the _proto_ of the Dog, why is it also in the prototype of Dog??
@aboodediriye7798
@aboodediriye7798 7 лет назад
hello ur channel is so amazing i like the why you talk about programming even if i don't understand any thing hhhh i have i rec west i startes learning HTML/CSS this is my first week of learning journey can u please please give a beginners like me an advice please ....i hope that u make video for beginners about learning and some advice please please please
@simonhrabec9973
@simonhrabec9973 7 лет назад
Hello there MPJ, nice video! It would be even better if you throw around some papers with notes as you used to, it makes the video more awesome :P
@Scripterrific
@Scripterrific 7 лет назад
Could you do a video that explains how the class syntax would be achieved without the class keyword; what's the syntax sugar equivalent? In other words, a class constructor is like the constructor function, but how does super work without classes?
@funfunfunction
@funfunfunction 7 лет назад
+Scripterrific that is a great idea for a follow up, thanks!
@Scripterrific
@Scripterrific 7 лет назад
funfunfunction indeed. I want to clarify that I also was suggesting that you could go into details further than just the constructor and super, for example how is inheritance being achieved under the hood with the extends keyword. Thanks for the reply! Love your videos; keep up the good work. 🙂
@shabbirbadshah4562
@shabbirbadshah4562 6 лет назад
i am backend developer with node and i want to know that why we follow object oriented programing in javascript what are its advanteg
@iLoveTurtlesHaha
@iLoveTurtlesHaha 7 лет назад
One minute in and I feel like I should learn JavaScript. XD
@bundyfx
@bundyfx 7 лет назад
awesome! thanks for the explanation mpj
@howiesfunware
@howiesfunware 7 лет назад
javascript has private members. Here's an example I wrote using the class keyword. Give it a try. class PrivateTest { constructor() { // Use var to make a private member variable var privateVariable = 123; // Define a function here in the constructor to make a private function // This function can call other private members function privateFunction() { console.log(`test: privateVar = ${privateVariable}`); } // This public function defined in the constructor can reference private members this.publicFunction = function() { privateFunction(); privateVariable = 234; privateFunction(); } } // This public function CAN'T reference private members anotherPublicFunction() { } } var privateTest = new PrivateTest; privateTest.publicFunction();
@funfunfunction
@funfunfunction 7 лет назад
+GameCodingNinja yes, there are plenty of ways to get private members in JavaScript, but the class does not have that concept. what you are doing there is using closures to control the scope - we're going to be getting to object creation with closures as well. I'm not a big fan of mixing the two in the manner you do in the example, I think it's better to pick one method of object creation for one part of the code and stick with it for consistency.
@howiesfunware
@howiesfunware 7 лет назад
Yep. Thanks for your reply! Big fan of your channel!
@UliTroyo
@UliTroyo 6 лет назад
That's pretty clever anyway! I dig it.
@cseckler
@cseckler 7 лет назад
Awesome explanation! Thank you so much! Which IDE are you using? I love that it shows you what the variables will evaluate to directly in the IDE. Is that a package or plugin for an IDE?
@cseckler
@cseckler 7 лет назад
I figured it out! It's called Quokka.js and is currently only available for VSCode Editor and JetBrains. I need it for Atom! quokkajs.com/
@funfunfunction
@funfunfunction 7 лет назад
+Chris Seckler vscode with quokka
@elvinasss2767
@elvinasss2767 7 лет назад
Hi, thank you for your informative and funny videos, I'd like to ask you what websites do you visit daily to learn something about JavaScript, do you have a few or there are a lot of them? I get stuck learning really quickly because there are so much info about JS that I don't know if one website is better than the other and how to know if provided content is high quality? Any suggestions?
@devvvvvvvvvvvv
@devvvvvvvvvvvv 7 лет назад
Quokka is awesome!!
@duanxiaobai
@duanxiaobai 6 лет назад
Hi, MPJ, what is the editor plugin that prints the result of code snippets?
@funfunfunction
@funfunfunction 6 лет назад
Quokka
@duanxiaobai
@duanxiaobai 6 лет назад
Thx very much.
@TheDataArchitect
@TheDataArchitect 6 лет назад
MPJME, we are both wearing same glass frames :) secondly you are giving me heart attack, i am starting hating classes, although i never used it in js so far, i use function objects. You have made me rethinking in every aspect of JS programming.
@Asimov16
@Asimov16 6 лет назад
why are you using let instead of var?
@mikkqu
@mikkqu 6 лет назад
I'm find it pretty confusing that methods in classes aren't separated by semicolons, like properties in standard objects. It hurts when you forget to place semicolons in objects and now it hurts just as much when you 'recall' to use them inside a class.
@boomer5015
@boomer5015 7 лет назад
Wondering why underscores we're used sent me on a 4 hour tangent trying to find out how to do private members. I got to the point where I was using getters and setters etc for properties and the whole works on the object model, but then couldn't figure out how to return the entire object. I found references to using symbols for instances....Head got wrecked but at least learned a bit about Object.
@ezequielmiranda87
@ezequielmiranda87 7 лет назад
What do you think about TypeScript?
@funfunfunction
@funfunfunction 7 лет назад
+Ezequiel Miranda I posted a video this week with that title :)
@DanielSamsonProfile
@DanielSamsonProfile 7 лет назад
I wish JavaScript had interfaces to guarantee methods and properties.
@DanielSamsonProfile
@DanielSamsonProfile 7 лет назад
+comet3bc13 I meant natively.
@okoiful
@okoiful 7 лет назад
Hey mpj.. whats that mic you use ? and which camera ? and whats that program you used to change the brightness ? Thanksssssssssssssssssssssssss!!!!!!! :)
@funfunfunction
@funfunfunction 7 лет назад
+Giorgio Martini see the behind the scenes episode. I've changed the mic to a squid lav + zoom recorder since then but other than that it's basically the same. I just changed the ISO on the camera using canons remote control app thingee.
@andreyorlov33
@andreyorlov33 7 лет назад
@funfunfunctions Dude thank you so much for your videos! You have some of the best tutorials out there !
@rjmunt
@rjmunt 7 лет назад
I'm a bit scared to ask this ... BUT, do you have a video on transpiling from modern JS back to compatible vanilla JS? It's a big hurdle for me. Even with tools like "CodeKit" for Mac I encounter errors 😳
@PDVega
@PDVega 7 лет назад
Which plugins or tools so i can try the codes ?
@funfunfunction
@funfunfunction 7 лет назад
+Vega Snpr no need, all of this is just plain JS.
@dovh49
@dovh49 7 лет назад
Reminds me of Ramda.js trying to bring currying into JS. Or, basically, ML style programming into JS. Although I really like it, it really isn't traditional JS. At the same time though they do make it more JS-like rather than bringing a strict interpretation of other languages into JS. So, the OO guys do it and the functional crowd does it. I lean towards the functional crowd, so JS overlords, please bring us native currying!
@funfunfunction
@funfunfunction 7 лет назад
+dovh49 comparing ramda to class was a really interesting observation. There are more extreme things in Ramda too. Some of it makes sense (native currying would be so nice) but the usefulness of a lot of FP concepts in Haskell are dependent on the type system being as expressive as it is, and doesn't translate very well to JS.
@collinrea6183
@collinrea6183 7 лет назад
Haha this is exactly what happens when a language has too much freedom and tries to make everyone happy. I love Javascript for what it is instead of worrying about what it isn't.
@stevenjazz787
@stevenjazz787 7 лет назад
Would it have been more palatable to call it something else? It doesn't seem to have many real problems with how it works, more just the word "class" being potentially confusing. The exceptions are private and protected members, but those aren't difficult to implement in the module pattern and it's not like you lose the legibility of "class." Classes are generally used on export.
@johnnyLikeVideo
@johnnyLikeVideo 6 лет назад
Do you have a link to that shirt?
@blackdeckbox
@blackdeckbox 7 лет назад
Soo... for react. What's the JS way for doing this: class App extends React.component { render() { return (Test); } }; const App = Object.create(React.component); App.prototype.render = Test ???? I dont know if that is even right lol.
@evolutionxbox
@evolutionxbox 7 лет назад
I don't know if you're trying to make fun of JS, or just showing how little pre-ES6 JS you know...? (Not that I know loads of course)
@blackdeckbox
@blackdeckbox 7 лет назад
Please show me how you do it instead of adding that comment.
@evolutionxbox
@evolutionxbox 7 лет назад
I don't use react, but after a few minutes of searching I found this: const MyComponent = React.createClass({ render: function() { return Test; } });
@blackdeckbox
@blackdeckbox 7 лет назад
Jonathan Cousins Yeah that's pre es6 way of doing things. So how does React.createClass work internally? Thats what I want to ask.
@blackdeckbox
@blackdeckbox 7 лет назад
If you dont know React, why you have to answer my questions rudely. You dont even know the answer too
@kaikai7702
@kaikai7702 5 лет назад
this guy is so honsome !!!
@dansmar_2414
@dansmar_2414 Год назад
I got the golden star!
@faisalalmalki9834
@faisalalmalki9834 4 года назад
your accent its lovely
@juanyang838
@juanyang838 5 лет назад
How the `talk()` function can be called such as a property at 12:02?
@vladyslavzakrevskyi8449
@vladyslavzakrevskyi8449 5 лет назад
talk() is called and return this._sound, which in this case is "ROAR" string, and only after that it is being assigned to X, so X is not a function, but just returned "ROAR" string (if i understand your question correctly)
@FedericoCicerone
@FedericoCicerone 6 лет назад
class Foo {} var myFoo = new Foo() console.log(myFoo) // is printing out: Foo {} // instead of: {} why?
@arushibajpai8113
@arushibajpai8113 5 лет назад
Yeah console tells the that your myFoo which is instance of Foo type. check myFoo instanceof Foo // true
@tilakmadichettitheappdeveloper
@tilakmadichettitheappdeveloper 4 года назад
prototypes ---> Australia ; class ---> New Zealand
@diegolamanno
@diegolamanno 7 лет назад
The meth analogy 😂 ... so true!
@NicholasEli
@NicholasEli 7 лет назад
Sorry for dragging you into the twitter debate with that Microsoft guy the other week. Seems like one of those guys who can't admit something is a good idea and pivoted the topic instead. It originally started of a debate over separation of concerns, but some how turned into a React debate(at times)?
@alexandermeesters6841
@alexandermeesters6841 7 лет назад
Private members are a problem in javascript, not per se with classes in javascript. Also, you failed to mention how much cleaner the class syntax is compared to the traditional prototypical way, much in the same way what arrow functions did for callbacks. You emphesized on multiple occasions that readable code is very important. So yeah, its only syntatic sugar, but makes it so much better to read. How are your thoughts on that?
@funfunfunction
@funfunfunction 7 лет назад
"Private members are a problem in javascript, not per se with classes in javascript. " The point I was trying to make there is that classes are just a thin layer on top of the prototypal model, which has the limitation of not having private members. (JavaScript in general can do private members just fine by using closures) I fully agree that the class syntax is an improvement over the old new-keyword-applied-to-functions crazyness, if you are absolutely hell bent on using classes.
@AnitaSV
@AnitaSV 6 лет назад
There is a hack for private fields, make a closure and define methods in constructor itself.
@funfunfunction
@funfunfunction 6 лет назад
Yes, but since doing that gives your class the same memory characteristics as a factory function, I think it's just better to go with that.
@AnitaSV
@AnitaSV 6 лет назад
I just wrote this: github.com/anitasv/makeup
@rolandbrake
@rolandbrake 7 лет назад
can you tell us what happens to meth meth method?
@brianmcclain2241
@brianmcclain2241 6 лет назад
Aha! Now, I finally get what JS programmers mean when they talk about "Array Methheads"
@themefracas8021
@themefracas8021 7 лет назад
why show the message? ---- Unexpected reserved word in safari and chrome browser
@cichy187
@cichy187 7 лет назад
big ups to you Tho
Далее
Dependency Injection basics- Fun Fun Function
22:26
Просмотров 153 тыс.
what will you choose? #tiktok
00:14
Просмотров 1,5 млн
НЕ ИГРАЙ В ЭТУ ИГРУ! 😂 #Shorts
00:28
Why Democracy Is Mathematically Impossible
23:34
Просмотров 236 тыс.
How to Do 90% of What Plugins Do (With Just Vim)
1:14:03
Просмотров 890 тыс.
Object Oriented Programming vs Functional Programming
18:55
Rust and RAII Memory Management - Computerphile
24:22
Просмотров 225 тыс.