ES6 Tutorial: Learn Modern JavaScript in 1 Hour

แชร์
ฝัง
  • เผยแพร่เมื่อ 2 ธ.ค. 2024

ความคิดเห็น • 660

  • @jaimerios1989
    @jaimerios1989 6 ปีที่แล้ว +371

    Thank you so much for this lesson Mosh!
    00:00 - Modern JavaScript Essential
    01:46 - Var, Let, Const
    05:40 - Objects
    08:27 - The this Keyword
    13:57 - Arrow Functions
    18:15 - Arrow Functions and this
    22:32 - Array.map()
    26:10 - Object Destructuring
    32:45 - Classes
    36:32 - Inheritance
    44:50 - Named and Default Exports

  • @thang8617
    @thang8617 3 ปีที่แล้ว +31

    1:45 var, let, const
    5:40 Objects
    13:56 Arrow Functions
    26:08 Object Destructuring
    28:40 Spread Operator
    32:43 Classes
    40:35 Modules
    44:49 Named and Default Exports

  • @worldbenefitfestival780
    @worldbenefitfestival780 4 ปีที่แล้ว +17

    The amount of connections I made with this video is unbelievable. I started my web development journey learning react and working from a high-level. After coming across many blockers I decided to learn javascript to hopefully make connections with all the higher level stuff I already knew. 3 months into the slow, grueling process of learning javascript I came across this video and it all finally clicked. I finally connected all the dots. Thank you for providing value to me and, at the time of this posting, 1 million other people. Liking and subscribing is the least I can do to return the value.

  • @gilbertrosario8633
    @gilbertrosario8633 6 ปีที่แล้ว +103

    I started learning React a few days ago and thanks to this video I can finally understand concepts like super(props), extends and overall classes, which I've never used in vanilla JS, so it's always been kinda of a scary topic to me until now. Another thing that I was confused about was the this key word in arrow functions, you explained that in such a fine way that I could finally understand what appeared to be a very complex concept. Thank you so much, you are definitely one of the best instructors one can find on the internet. I will closely follow your content, I really like your teaching style.

  • @pawenobis5386
    @pawenobis5386 6 ปีที่แล้ว +349

    My most valuable 50 minutes in this year!

  • @ruixue6955
    @ruixue6955 6 ปีที่แล้ว +21

    13:59 Arrow Function
    14:25 same function in ES6 14:30 convert this function to an arrow function
    15:19 the final result, which is the same as the original function
    15:53 real use case of Arrow Function
    18:15 Arrow Function and this
    22:33 Array.map()
    25:00 use *template literal* in es6
    26:10 Object Destructuring
    28:41 Spread Operator
    28:59 combine 2 arrays
    29:19 using spread operator
    29:51 improvement of spread operator
    31:08 use spread operator on an object
    31:58 combine
    32:28 clone an object

  • @ashish2438
    @ashish2438 2 ปีที่แล้ว +45

    I don't usually comment on any video, but this little course here made me do it.
    I knew basic JS only so when I started learning React, things were going over my head just because of not some of the concepts taught in this video, but while watching this video, all those React tutorial videos went through my mind again and I finally understood the concepts I missed. So, A lot of thanks to you

    • @NOTHING-en2ue
      @NOTHING-en2ue ปีที่แล้ว

      @user-ze6uv7qq5d can i ask a question i am searching it for a long time

  • @edward-soli
    @edward-soli 9 หลายเดือนก่อน +2

    The ES6 topics that you covered were 90% used everywhere, which makes your video stand out from the rest of the crowd. Thanks for your kind explanation.

  • @rohitrai4215
    @rohitrai4215 5 ปีที่แล้ว +11

    Indeed everything that is required for React is covered in this video. Simply amazing.

  • @dekafmusic
    @dekafmusic 3 ปีที่แล้ว

    So grateful for this, left code for nearly a year now I came back and I want to go into react for front end dev, just trynna sharpen my JavaScript first before I start that

  • @steffenlaurens8280
    @steffenlaurens8280 6 ปีที่แล้ว +16

    I just started learning React a few weeks ago and this video really explains lots of things that made me wonder before. Thank you so much for making things easier to be processed. 👍

  • @exoticcoder5365
    @exoticcoder5365 3 ปีที่แล้ว +4

    18:00 I love how you refactored the code so clearly in front of us which many tutorials didn’t do, Thanks for that clarification 🙏🏻

  • @jacobkreifels7690
    @jacobkreifels7690 2 ปีที่แล้ว +3

    I love this video. I graduated from my uni feeling like I hadn't learned anything and went through some personal motivation issues. Now I am back trying to relearn in the hopes of finding a job soon and this video is an excellent tool. You're not going over basics as everyone else does and you're instead giving us the modern-day coding practices as well as refreshers on details.
    I appreciate you so much!

  • @gracewood6768
    @gracewood6768 2 ปีที่แล้ว +1

    As a dev lead on our company that uses reactjs and nodejs.. having a refresher like this is the best experienc eever. You saved my life! I can now guide better on my dev

  • @artreaktor
    @artreaktor 6 ปีที่แล้ว +13

    Excellent explanation, you're simply a genius teacher! That's how every tutorial should look like!

  • @jayzdevera7579
    @jayzdevera7579 6 ปีที่แล้ว +10

    This will help beginners from learning React. Every details is explicitly explained and all other concerns. Can't wait for the actual react tutorial. Keep it up!

  • @arturluisoliveira
    @arturluisoliveira 5 ปีที่แล้ว +2

    The tutorial is not only useful for React, but also for any developer that know other languages and needs to understand JavaScript. Thanks Mosh!

  • @elzurotsyry
    @elzurotsyry 6 ปีที่แล้ว +13

    Wow you're an amazing teacher. I've been learning React by myself for a couple of months now, and I've used all these concepts, but now I know I didn't really understand them until today, thank you. Now I feel the necessity to go through your whole channel. Thanks again.

    • @prshendra
      @prshendra 6 ปีที่แล้ว

      What reference do you use for learning react?

    • @elzurotsyry
      @elzurotsyry 6 ปีที่แล้ว +1

      I guess a little bit from everywhere, the reactjs official docs are really nice, but I haven't found a best approach than getting my hands dirty. I usually think of something I really want to develop and then I just start working on it, in the process I'll face a lot of doubts and questions, so for every question I'll invest a couple of minutes (or hours depending on how challenging/interesting the topic is). After I'm done with the project my knowledge has increased so then I'll start a new project with all the new knowledge or maybe I'll refactor the same project but with a better architecture or best practices.

  • @fc9gaming458
    @fc9gaming458 4 ปีที่แล้ว +5

    My most valuable 50 minutes in this year! To be honest what a tutorial

  • @akissot1402
    @akissot1402 5 ปีที่แล้ว +1

    Highly skilled instructor... they guy u need if u want directions for mcdonalds in a desert island, few words and totally on point , wish we had guys like him in school

  • @ruixue6955
    @ruixue6955 6 ปีที่แล้ว

    32:45 Classes
    36:33 inheritance
    40:37 Modules
    40:50 modularity
    42:03 When working with moduled, the objects we defined in a module are private by default
    42:30 prefix the class with *export*
    42:55 import
    43:31 import from your own module
    44:52 Named and Default Exports
    46:08 default export
    46:18 typically we use *default export* if there is only one single object that we want to export
    46:59 add default keyword
    *47:15** we only use the curly bracket to import the named export*

  • @psuralkar5550
    @psuralkar5550 5 ปีที่แล้ว +2

    You are my "GURU" - Its Indian - "Sanskrit word" that means you are my "teacher" .
    I really love it your teaching technics.
    Thanks a lots for such a great tutorials.

  • @kevvu_l
    @kevvu_l 6 ปีที่แล้ว +2

    I love you man!! This video was exactly what i was looking for in terms of how ES6 changed some syntax writing and how Export and Import works. Incredible that this is up in youtube for free!

  • @waleedvirk6259
    @waleedvirk6259 4 ปีที่แล้ว +1

    very specified content, short, to the point, simplified, beautiful and perfect way of teaching. Thanks .. Love from Pakistan

  • @triteraerlangga7917
    @triteraerlangga7917 3 ปีที่แล้ว +2

    Thank you Mosh!, I had React course from a random cheap online course that I found on Internet, and they are like "write this line of code and the output would be like this" without any further explanation about what they wrote... I don't say it garbage, it gives me the main idea of how to build a website. And your video just answers all of my questions about what they didn't explain.

  • @sanaliekki
    @sanaliekki 2 ปีที่แล้ว +4

    Being a long-time Java coder and an involuntary JavaScript coder trying to start learning React... This video provided me with just a perfect combination of understanding and learning of new concepts.
    Three thumbs up!

    • @OIOOIOIO
      @OIOOIOIO ปีที่แล้ว

      Good to know, trying to learn React at the moment and it's doing my head in!

  • @maheshhegde7332
    @maheshhegde7332 4 ปีที่แล้ว +17

    Great course for rapid learning and it is very time saving course. He covered so much in less than hour👏👏

  • @shahbaz_ali_official4803
    @shahbaz_ali_official4803 8 หลายเดือนก่อน

    You have the most simplest and effective way of teaching soo far on internet

  • @kumarvaibhav1307
    @kumarvaibhav1307 3 ปีที่แล้ว +1

    Liked ...shared ....subscribed.... will be using your channel to gain all of my future skills. Keep up such a quality work.!

  • @olishiz
    @olishiz 6 ปีที่แล้ว +1

    These tutorials will definitely land me a job. Thank you! Loved it very much.

  • @Simbatronix
    @Simbatronix 6 ปีที่แล้ว +2

    First time watching your vids and subscribed instantly after a few minutes.I love your teaching style and how you explain concepts in such a human friendly manner.Thank you!

  • @juangoria3517
    @juangoria3517 5 ปีที่แล้ว

    Mosh, you're the best. Thank u, im currently at a job making Angular apps, and I did learn it last year within two weeks thanks to your course, very clean. Thank you again!

  • @ashnakohli6763
    @ashnakohli6763 3 ปีที่แล้ว

    Grateful to have so rich content available for free, that sorts out our basics so well and help us develop a strong foundation. Thank you Mosh

  • @mihirp1408
    @mihirp1408 2 ปีที่แล้ว

    Thank you Mosh for an extremely simple, to the point & high quality crash course covering pretty much all the main concepts of ES6 - gained a lot by watching this.

  • @AnandBodicharla
    @AnandBodicharla 4 ปีที่แล้ว +1

    My most valuable 50 minutes in this year 2020 !!!!!!!

  • @ROFEL
    @ROFEL 5 ปีที่แล้ว

    In 7:40 , why do you have to put the const targetMember inside the brackets? If you wanted to reassign the variable "name" in the object, shouldn't you do person['name'] = targetMember ?? since targetMember is the input field in a form and is the one changing, you want to assign name to targetMember....

  • @dibyendusroy
    @dibyendusroy 6 ปีที่แล้ว +1

    Love and respect from India. You made JS so easy. great great explanation sir.

  • @pammugaadu
    @pammugaadu 4 ปีที่แล้ว

    My Most Valuable 1 hour in this 2020.... wonderful lecture... thoroughly enjoyed. Thanks a ton.

  • @abdulmalekbahamid450
    @abdulmalekbahamid450 3 ปีที่แล้ว

    you're the best instructor to learn programming.
    Thanks Mr. Mosh.

  • @faresgeek-dz5692
    @faresgeek-dz5692 6 ปีที่แล้ว +18

    Make django tutos ....plz
    You are just a great teacher...

  • @dragonknight1297
    @dragonknight1297 5 ปีที่แล้ว

    I don't understand much of this, but I understand that this is easy to understand - when Mr. Mosh is teaching it... Very nice job!

  • @vikaskhandelwal5557
    @vikaskhandelwal5557 3 ปีที่แล้ว +1

    I am not a fan of watching videos for learning, I always prefer text because videos generally waste lot of time but you nailed it though it's a video but it's very precise and to the point. You explained it very well. Thank you so much for creating this.

  • @TheCato3000
    @TheCato3000 4 ปีที่แล้ว

    Yo, Mosh! TY for clearly explaining these concepts. In 50 minutes, I've determined that you've explained this best out of them all...

  • @darko2636
    @darko2636 6 ปีที่แล้ว +10

    Extremely helpful and very easy to understand / follow. Thank you for these great tutorials 👍

    • @tkssharma
      @tkssharma 4 ปีที่แล้ว

      This is my channel for JS developers
      Full of Training Courses
      To Learn there is a playlist with 100 + videos of Demos
      th-cam.com/video/ZWqfADc-0K8/w-d-xo.html

  • @feruzcollection
    @feruzcollection 3 ปีที่แล้ว

    You have two profession programmer and teacher. You know your field deeply. bless you !💯

  • @hamzaezzagmoute8646
    @hamzaezzagmoute8646 2 ปีที่แล้ว +1

    Great tutorial from great teacher❤❤

  • @catherineauma6766
    @catherineauma6766 2 ปีที่แล้ว

    Perfectly explained! This is practically everything we learn at university....merci beaucoup

  • @amitKumar_11
    @amitKumar_11 4 ปีที่แล้ว

    Searching for ES6 tutorials and your video comes first. I would say it's so clear and clean tutorial without much advertisement... nice work Mosh...Gonna subscribe to this channel

  • @pruthvim8462
    @pruthvim8462 3 ปีที่แล้ว

    This would be the best tutorial for ES6. Mosh keeps it simple and more understandable.
    Great Job Mosh! :D

  • @objectObject212
    @objectObject212 6 ปีที่แล้ว +1

    Great video, thanks! That is exactly what is needed before starting learning React.

  • @madhug82
    @madhug82 3 ปีที่แล้ว +1

    brilliant tutorial. very good coverage and a very good voice modulation. good precurser for React tutorial. Thanks Mosh!!

  • @abednegowambua7990
    @abednegowambua7990 4 ปีที่แล้ว

    Wow the explanation in it's course is surreal. I just like the presentation the example and everything involved here in this.

  • @nijokjose
    @nijokjose 3 ปีที่แล้ว

    A great tutorial and thanks a million. I was praising you all the time during the session for how well the things are explained.

  • @windowli7433
    @windowli7433 2 ปีที่แล้ว

    I am so happy that I saw this course. Thank you very much! Now I finally have a better understanding of a lot of knowledge points, especially about class and object.

  • @themongru
    @themongru 6 ปีที่แล้ว

    I never fully understood when and how to use the super() method until watching this video, thank you for creating such concise and clear tutorials!

  • @chriscsmoon
    @chriscsmoon 2 ปีที่แล้ว

    Thank you so much. Now a lot of things are becoming clear. This video saves me from pain and agony. Again, thank you!

  • @keacydebayo9365
    @keacydebayo9365 ปีที่แล้ว

    Seriously, you save me hours of research in just an hour length of video

  • @Pareshbpatel
    @Pareshbpatel 3 ปีที่แล้ว

    JS ES6 features, so fluently explained. Thanks, Mosh
    {2020-09-15}

  • @ThePolaris87
    @ThePolaris87 5 ปีที่แล้ว

    Excellent summary for people aspiring to tackle React by having a better fundamental understanding.

  • @michaelbarron6687
    @michaelbarron6687 2 ปีที่แล้ว

    Mosh, Thank you so much for taking the time to teach us newbies the basics. Excellent video. I have officially subscribed. Looking forward to more.

  • @zero2herobeatspaul882
    @zero2herobeatspaul882 4 ปีที่แล้ว

    One of the best teachers on TH-cam.

  • @batikcompusoftlabs2371
    @batikcompusoftlabs2371 6 ปีที่แล้ว +6

    Good job Mosh you're awesome! I just starting to create some tutorials like you.. You're inspiring me.. Thank you

  • @rektlesss8822
    @rektlesss8822 5 ปีที่แล้ว

    so clear language, and building knowledge bit by bit, great teaching, very happy that i came across your channel. Cant wait to see ur future work, impressive

  • @deepakkhetarpal7198
    @deepakkhetarpal7198 3 ปีที่แล้ว

    Wow, simply awesome. I don't subscribe too many techs but I am watching this tutorial for the first time and couldn't resist to like/subscribe. Will be looking forward for new courses and will explore more what's added into this channel.. Thanks Mosh

  • @petridev77
    @petridev77 4 ปีที่แล้ว

    i knew es6 but this is very clear now. awesome job Mosh !

  • @digigoliath
    @digigoliath 5 ปีที่แล้ว

    WOW, this is really valuable material. Very well explained in an easy to understand approach! Pure Gold!! You are a great teacher MOSH! Thank you very much. I finished your 2.5 hrs REACT course before coming to this. I enjoyed it too.

  • @amjadalsharif8452
    @amjadalsharif8452 4 ปีที่แล้ว +1

    Just perfect: presentation, teaching style & peace, explanation & presentation of the key concepts. Thank you Mosh

    • @tkssharma
      @tkssharma 4 ปีที่แล้ว

      This is my channel for JS developers
      Full of Training Courses
      To Learn there is a playlist with 100 + videos of Demos
      th-cam.com/video/ZWqfADc-0K8/w-d-xo.html

  • @dinesh.p8642
    @dinesh.p8642 5 ปีที่แล้ว +1

    i am your fan Mosh.i love ur voice ..as cleaner as es6 syntax

  • @varunrajput8083
    @varunrajput8083 3 ปีที่แล้ว

    This video is hands down "PERFECTION"

  • @mostafahabib97
    @mostafahabib97 2 ปีที่แล้ว

    That is the great tutorial I have ever watched, thank you so much for making it free.

  • @davidmathengegoogleplus
    @davidmathengegoogleplus 6 ปีที่แล้ว

    Totally enjoyed the materials in this intro course. Great content. Looking forward to engaging with more of your content.

  • @stillpickinganame5350
    @stillpickinganame5350 ปีที่แล้ว

    Awesome tutorial! Clear and precise! Thank you so much!

  • @funnyvideo-ex4kw
    @funnyvideo-ex4kw 5 ปีที่แล้ว

    Nazim from India :Thanks Mosh brother, your tutorials is very helpful for me.

  • @upendraallu503
    @upendraallu503 3 ปีที่แล้ว

    You're awesome. You made it easy and clear.
    Thank you Mosh.

  • @caizza3
    @caizza3 5 ปีที่แล้ว +1

    Very clear. Best explanation i've seen!

  • @lesleyshome
    @lesleyshome 5 ปีที่แล้ว

    Really the first video to watch and learn before stepping into React..Thank you mosh..!

  • @ritikakapoor4583
    @ritikakapoor4583 4 ปีที่แล้ว

    I completed this JavaScript course from scrimba and now I came here to learn about ES6 and five minutes in and I already love love this video. Thank You❤️

  • @venoms3160
    @venoms3160 3 ปีที่แล้ว

    Brilliant Stuff Mosh. I love the way you explain various complicated concepts in such a simplified manner.

  • @ikashyap5
    @ikashyap5 4 ปีที่แล้ว

    It was like a movie, I didn't even know when 50 mins passed ! Love ur content MOSH

  • @rosieshiels7500
    @rosieshiels7500 3 ปีที่แล้ว

    Mosh, that was a fantastic video. It explained ES6 for well. Thank you so much!

  • @javascript_developer
    @javascript_developer 3 ปีที่แล้ว

    Awesome Mosh. I loved the classes and module. Its super clear now.

  • @df15804
    @df15804 4 ปีที่แล้ว +1

    Congratulations, your explanation is amazing, Thank you. Cheers from Brazil.

  • @akshaymaity5064
    @akshaymaity5064 4 ปีที่แล้ว

    Thanks Mosh. i am from India. I really love it your teaching Technics.
    Thanks a lots for such a great tutorials.

  • @pranitapanchmukh402
    @pranitapanchmukh402 ปีที่แล้ว

    Thank you so much for this video!! It was much needed!

  • @theonlydino2244
    @theonlydino2244 5 ปีที่แล้ว

    in the map part, u can do const items = colors.map(color => `${color}`) instead of const items = colors.map(color => '' + color + '')

  • @bijalpatel9463
    @bijalpatel9463 5 ปีที่แล้ว

    Thank you so much Mosh!!! It is very useful for me...your teaching method is so good.....

  • @dancewithzinnia
    @dancewithzinnia 2 ปีที่แล้ว

    Best course ever to refresh es6 features 💯 awesome

  • @ahsboy
    @ahsboy 2 ปีที่แล้ว +1

    I let 5 years go by without keeping up on javascript, and when I returned it was like a whole new language! This was exactly the recap I needed to catch up. Concise, but with ample realistic(ish) usage examples. Just great. Ta.

  • @shomendas7011
    @shomendas7011 4 ปีที่แล้ว

    One of the best js tutorial i ever watched

  • @easyfinanceexplained
    @easyfinanceexplained 3 ปีที่แล้ว +1

    Thank You, Sir. It really clears more concepts in a very friendly manner.

  • @jeps7688
    @jeps7688 6 ปีที่แล้ว

    thanks a lot! I badly needed to learn this.. planing to create an app for my thesis proposal

  • @PavanSibal
    @PavanSibal 3 ปีที่แล้ว

    Mosh, you are simply the best!!

  • @ruixue6955
    @ruixue6955 6 ปีที่แล้ว

    3:00 problem of car keyword in Javascript
    3:25
    3:38 *let* in es6
    4:32 const
    5:32 tip: use let only when you needs to reassign a variable
    5:56 objects in js are collections of key-value pairs
    6:11 a function inside an object, we refer to the function as a method
    6:24 method in es6
    7:20 use case of bracket notation
    8:28 this Keyword in js
    8:47 this doesn't behave the same as this in other languages
    9:40 walk function
    *10:19** the value of this is determined by how a function is called*
    10:34 if you call a function as a standalone object or outside an object, 10:40 this will return the global *window* object in browser
    10:53 strict mode
    11:21 binding this
    13:08 recap

  • @rasuwankalhara534
    @rasuwankalhara534 3 ปีที่แล้ว +1

    My best tutor ever

  • @aabhasjain96
    @aabhasjain96 4 ปีที่แล้ว

    Thank you so much Mosh, I love the way you teach. You are amazing.

  • @bilalkhan-vn6hf
    @bilalkhan-vn6hf 3 ปีที่แล้ว

    the best teaching methodology , really I always learn something new and best from mosh lectures

  • @thagreatone402
    @thagreatone402 4 ปีที่แล้ว

    I don't usually comment on videos but this was an amazing crash course. Wow

  • @qasemraheb623
    @qasemraheb623 2 ปีที่แล้ว

    I join your channel just because of this video and i can't wait to see more video about JS, grazie maestro 🙏

  • @KHANSOFFICIAL
    @KHANSOFFICIAL 5 ปีที่แล้ว

    This was pure gold, thanx MOSH !!!

  • @tuanconandoyle9674
    @tuanconandoyle9674 4 ปีที่แล้ว

    really like this video, highly focusing on practical knowledge. Thank you Mosh and keep going!