Modern JavaScript Tutorial #5 - Objects

[@derickyyy]

You are an excellent teacher. There’s a difference between knowing a topic and knowing how to teach that topic. You are a natural at breaking down complex topics, coming up with purposeful examples to illustrate each idea, and anticipating viewers’ questions and misconceptions. I especially appreciated your explanation of primitive vs reference types and how JS handles data behind the scenes. Your videos help me actually understand JavaScript and not just memorize code. Thank you for the time and effort you put in creating these free videos.

[@NetNinja]

Thanks so much Derick, really appreciate it 😃

[@Risterreacts]

@@NetNinja when I type for each blog this => function it won’t work for me for whatever reason and did what you did still doesn’t work

[@k16e]

I really enjoyed reading your words of appreciation, Derick. Thanks for writing them out so clearly, as they express exactly how I feel about The Net Ninja plus more.

[@shyamsriram]

Been coding for 3 years now, never better understood before than now how primitive and reference types access the memory. Thank you, Shaun. 👍

[@OIKONOMOYENOIKIAZOMENA]

In same position and same years coding.......... Totally agree! The best explanation on that I've ever seen

[@namgoCS]

02:25 - Object Literals 09:20 - Object Methods 12:26 - "this" Keyword 18:35 - Store Objects in Arrays 22:21 - Math Object 27:47 - Primitive & Reference Types

[@jayminmaheta8253]

Thanks 👍

[@Risterreacts]

Do you know how to do this.blog.foreach blog => function correctly because did what he did but still doesn’t work for me. Keeps saying error. This.blogs.foreach(blog =>{.

[@אופקברזלי]

Thanks

[@pjf7044]

Best teacher on youtube. Most channels on youtube are mainly done for views often times by questionable "developers"...but it is clear you know your stuff and really express things clearly and in detail with no confusion. Straight and to the point with no fluff. Thanks so much!!

[@abishekp.y4736]

Sir your explanation is clear... Your explanation for primitive and reference type is awesome.. 😄😄

[@ridl27]

wow. I already know how these things work but your explanation of stack and heap is really perfect !

[@nocturnal81-xv5le]

Your only dropping jewels Net Ninja , I love the clarity and the accent too . Much appreciated.

[@NetNinja]

Thanks for your kind words :)

[@lucymcloughlin6190]

Wow. My mind is blown by how good your teaching style is. I was just trying to grasp objects, but I think it'd be worth my while to revise all of my Javascript knowledge through your courses. Thank you!

[@antoniofuller2331]

It took me a month to grasp functions, and 4 months to grasp objects. Yes, it's that hard

[@Hamza77k]

@@antoniofuller2331 took me 2 days to grasp functions and 5 to grasp objects, i suggest you get an iq test brother 🤣

[@rehanyounas4868]

I have never seen such talented tutor anywhere. your lectures are descriptive and your concepts are way more clear than any other teacher out there on youtube

[@NetNinja]

Wow, thank you Rehan! That means a lot :)

[@regal_7877]

40 minutes on Javascript obects. Just amazing. Thank you so much, people like you are a godsend

[@k16e]

By far, ever ever, the best treatment of "by value" / "by reference" in JavaScript I've gotten, and this makes it all so so lucidly clear. Thanks, dude!

[@itsshopboy]

The best way to appreciate Shawn is to purchase his course at Udemy.

[@AccessCode101]

That's is exactly what I just did.

[@scorlingonzalez9003]

@Morrorwind ur right, I don't even need it but will do so just to show gratitude.. these tutorials are super well explained.. i will definitely watch serval of your other videos series within the channel

[@ThatGuyDownInThe]

@@scorlingonzalez9003 when I start making a little programming money these dudes are all getting pay days lmao

[@杰奇]

just did

[@YOUTUBE_IS_WOKE]

I will do that, I am just so impressed with the way he teaches, so detailed and yet not boring or repetitive.

[@h9n154]

the way you explain about stack and heap is insane level.The best teacher!

[@DJ_Melech]

Been looking at a lot of tutorials on KZbin and although I'm still struggling to keep up, this is the best I've found so far.

[@sandeepdeodhar]

This is absolutely divine. You are a great great teacher and Guru. I am reading javascript for some time but what I understood today is absolutely crystal clear. May God bless you for ever

[@jeffreyzhao9156]

Best explanation of object reference I have ever seen. Awesome!

[@NetNinja]

That’s awesome 😎 thank you!

[@shadorain]

Literally have never understood the stack and the heap, and primitive types etc you made it sooo dang easy to understand, i appreciate it so much Best explanation for it yet ^

[@satyam1543]

best javascript course on internet, now javascript started making sense to me, your way of explanation is really great, thank you 🙏🙏

[@zinklog]

That primitive and refernce type difference is so goood. Thank you.

[@whatevertech204]

I love your videos! I've been using them to help my wife learn Javascript. One slight correction I wanted to mention 32:58 mentions some code like this: const userOne = {name: 'shaun', score: 100}; const userTwo = userOne; const userOne = {name: 'shaun', score: 50}; In the video you said that since userTwo and userOne are pointed at the same value, they would both be updated. Setting aside that the variable is being redeclared, and you're reassigning a const, there is still one issue. When userOne get's updated to the new object userOne = {name: 'shaun', score: 50}; The userTwo object is actually still pointing at the original object, and not the same value as userOne. so in memory things would look like this: userOne = {name: 'shaun', score: 50}; userTwo = {name: 'shaun', score: 100}; Then, if you changed userTwo in this way: userTwo.score = 500; Your variables would now have these values: userOne = {name: 'shaun', score: 50}; userTwo = {name: 'shaun', score: 500}; Small think, but an important distinction. Otherwise, things in this series seem on point. Thank you so much for your amazing content. I learn new things from you all the time :)

[@lockborethdevid3533]

The primitive and reference types explaination is absolutely amazing for me. With around 10 minutes I understood these concepts clearly. Thank you so much for this free and valuable video.

[@vigneshr5190]

You have talent in Teaching. Just incredible

[@YOUTUBE_IS_WOKE]

I hope you're making more money in udemy as your tutorials are really easy to understand and full of information. I love how you explained the stack and heap dfferences. you deserve a lot more money, likes and subscribers. thanks for the videos.

[@Roxaro]

that primitive and refence difference talk was really helpful

[@klaasjanssen644]

Thanks for explaining it. I searched for a plain and simple examination, but i couldn't find it, since I'm a newb. i added some information to it (standing on giants shoulders) , so i could understand it even a bit more. I hope this will help someone! OBJECT LITERAL is an “own” created object , where you can store/group all the information that you want in. (this is called encapsulation of information, or grouping information) ( Javascipt does also have a lot off objects that you can use, but in an Object Literal, you can make your own object and use it like you would use a "standard" object) The basic syntax is: let user ={ } ; * You start with creating a variable. (with var, or better let. Not const, because you want to be able to change the information in it during the process) * The { } are used to store the information in . * You’ll end it with a semi-colon, so you can execute/run it. ( ? ) In this new/ “own” created object you now can store information in a key value. * The key is the objects name, * and an you can add a value to it. For instance age(key) : 37 (value) this is a key value pair or the object property. And this is now a part of this object. You now can call this object property via console.log (user.name) // 37 If you want to store more data in the object literal, you add a comma at the end en insert a new property let user = { name : `Ross`, age : 37, location : Amsterdam, Hobbies : [ `skiing` , `painting`, `horseback riding` ] (adding an array , a list of hobbies) Etc. etc. } ; continue at 4:01

[@ashwinibarki9255]

Shawn, your teaching way is fantastic...wow your explanations will understand by any average student. Thank you so much. From India.

[@Sizzahandz]

Up to part 5 watching you even on x1.5 speed and you are very easy to understand.. Plus with the speed of technology this set of tutorials still holds its value. Appreciated.

[@thiagom5195]

best video about object, and explain "this" in arrow function and "this" in a traditional(normal) function.

[@X161King]

bro no lie your the most helpful video I've found. at least for me you're touching the spots that I needed connecting. this video is good to follow after you have read some type of notation on objects. It's difficult at times being new to code seeing exactly what the code in writing and represents. going back and forward from reading something to your video helped a lot. thank you.

[@ganeshsrambikal3614]

This video gave me new perspective towards primitive and reference , heap and stack.

[@HostDotPromo]

Thought I knew objects well, mind blown within a few minutes. Thanks 🔥

[@batchrocketproject4720]

Credit where it's due, this is an excellent explanation of objects. I was a bit worried when the customary analogy to real-world physical objects began as this often gets followed by the same vague explanations that rarely extend understanding and often introduce confusion. I've always believed that effective teaching requires deep fundamental knowlede and understanding by the teacher and this class is archetypal proof - the clarity of thought flowed effortlessly, anticipating and explaining hurdles to understanding without getting lost on irrelevant asides. Thank you.

[@simonbates9454]

A great teacher, the explanation of stack and heap is amazing never could get my head around it thankyou mate.

[@NetNinja]

Happy to help :) thanks for the kind words, Simon!

[@MartinJaszczuk]

I've been hearing about you in various Facebook groups and wanted to have a couple of things explained to me differently than every other course or tutorial does. I found this and a few other videos you've made and they helped clear up my confusion on a handful of topics. Thank you! I'll definitely look for your stuff on Udemy to support the work you're doing!

[@NetNinja]

Thank you so much!

[@kadoacademy551]

OMG, I feel I'm lucky to come across this channel, this is the killer JavaScript course all over the KZbin channel! what the amazing tutorial! May God give you the peace of mind my tutor for this heavy work you're doing just for us.

[@DanielBeckel]

This free course was so good that I bought the Udemy's course. I love JS and I want to dominate that. I believe I'll have a lot of knowledge with your course. Congrats! And please, keep updating the course at Udemy!!

[@ndabenhlemhlongo7231]

Brilliant sir 🙌🏾❤️ Simple and practical examples for beginners and newbie like myself

[@NetNinja]

Thanks for watching Ndabenhle! :)

[@chinedujonathan4238]

I have a better understanding of reference types and how data types are stored in JavaScript. Thank you!

[@davidallsopp4030]

Excellent discussion and analysis of the difference between primitive and reference types!

[@gina7898]

I now completely understand objects after going through this tutorial. Thank you!

[@yashparekh2954]

@TheNetNinja I really, appreciate the explanation of how the Primitive and Reference type values get stored in the memory and how subtle difference it makes..kudos.

[@NetNinja]

Thanks Yash :)

[@yashparekh2954]

@@NetNinja Which made me purchase your course on udemy as well...and I'm enjoying learning curve..hope you keep updating there as well

[@kj.junaid]

Explaining lots of things nicely in less time, nice tutorials. 👍 Who knows well, can teach well, recommend everyone to watch and learn from him.

[@NetNinja]

Thanks Junaid, that means a lot :)

[@kevindivinagracia8620]

even im not good in english . i understatood your explaination... 100% recommended. commended..

[@MultiMemich]

30:45 This presentation would make more sense if you had used *let* . You can't reassign *const* . You also didn't point out the difference in the behavior of primitive types and objects due to the fact that you can't reassign const values in the stack: - *Primitive type* When you define a primitive as a *let* , you can change it, to me more precise, you can reassign it. You can't change (reassign) *const* primitive. - *Object* Same as with primitive *const* , when you define a *const* object, you cannot reassign it. Address in the stack is permanently linked to the object in heap. You can still *EDIT* the *const* object (edit data in heap), which is exactly what Ninja did here 36:13.

[@krusnanshgupta]

hey , your teaching style is so good that i understood everything , i think it will be benificial to all of your viewers if you make video on data structure and algorithms

[@chinecheremedeh]

Yo shaun, i always love your teaching bought your course on udemy ❤ because ik you are great at teaching and if i need help in other things ik the best teacher

[@NetNinja]

Awesome, thank you!

[@gamester7152]

best teacher on youtube. thank you so much bro.

[@NetNinja]

You're very welcome! Thanks for watching :)

[@nathantorento1042]

Apart from your clear and top-quality explanations, I really like the way you say "rules" in 19:37 haha! Humanity is a better place with you and your courses Mr. Net Ninja. Thank you.

[@NetNinja]

Haha, thank you :)

[@yinonb172]

Best JavaScript Tutorial, I bought the full course and it is excellent ! , Arrigato Net Ninja San !

[@joanclarke2724]

Superb tutorial! Your explanations are crystal clear. You are truly gifted at teaching.

[@charlesadah5929]

Well delivered, thank you shaun

[@NetNinja]

Very welcome, hope you found it helpful :)

[@anishagarg4364]

very detailed explanation✨ if you are looking forward to learn js, u r at the right location.

[@ecommercemexican]

best course ive come across on youtube, cheers !

[@muhammadmujahid5819]

liked and subscribed after watching ten minutes of video, Taking a course through Udemy, I was struggling with these concept, this video made it so clear, going buy his course at Udemy

[@vikrantpatil4540]

Love the way you teach bro, surely gonna buy your udemy course

[@plyicebo133]

You know what? You should make a course on teaching as well! I dunno if everyone really appreciates how good you are at teaching. How you breakdown complex topics and the order in which you present things are perfect! There must be a philosophy behind your teaching style. Would love to learn it.

[@amandarizqi1322]

You're such a great teacher, such clear explanation thank you soooooo much!!

[@smallbutsuper]

At 15:17, I had to stop and looked up for what a callback function is, and also how to use forEach() in order to understand the role of the blog variable in the callback function called here. If memory serves, callback/anonymous function has not been introduced previously in the course. So it'd be nice if you could include some quick explanations there, I guess. Just a constructive feedback from a big fan of yours, Shaun. Hope you don't mind. Peace!

[@mridul6019]

excellent intro and teaching so far if we are defining some variable const then how can we change that again , and what's the use of it to define const

[@Belyava]

Absolutely brilliant explanation! Thank you!

[@dechennamgyal5368]

Diamond in the sea of pearls, best tutorial about JS objects

[@gautambedi591]

Very well explained. Loved your tutorial mate!

[@ineedabigboygimmeabigboy]

thanks for making this understandable!

[@NetNinja]

No problem :) hope it was useful!

[@daniellaerachannel]

I think your tutorials are great, especially the way you explain is excellent. But it's time to start to build real projects with these skills you taught to us; thank you

[@NetNinja]

Hey, the project chapters are all in the udemy course. 5 projects in total. These are just the first 5-6 chapters.

[@henr2000]

you are a really good teacher well explain and exelent content , thanks

[@ram_qr]

brilliant explanation

[@NetNinja]

Thanks, hope it was helpful!

[@oilblog1460]

Shaun, any plans for doing a video series on Javascript data structures and algorithms. It would be very good.

[@kryptonwest9059]

Hello Sir, what is the difference when changing object names like this: Example var userOne = {name: 'ryu', age: '30'}; userTwo = userOne; What makes the difference between change A and B: //A) var userOne = {name: 'ryu', age: 20}; //B) userOne.age = 20; //Cause they produce different outcome in terms of changing userTwo

[@zamirshams3430]

outstanding lecture , please provide some project based javascript learning

[@tylerlevingston2771]

Proud of myself watched this entire video.

[@NetNinja]

Great job Tyler :) thanks for watching

[@farzeenshareef1380]

This is just awesome sir. The best tutorial for me so far.

[@MSNERVANA]

Thank you so much ....... this tutorial is really PROFESSIONAL

[@jensv8859]

Another awesome tutorial. You are the man! Thanks for uploading this!

[@DavidKHill]

Hi Shaun, I took and completed your "Vue JS and Firebase" course on Udemy and found it very enlightening. I checked out your KZbin page and came across these JavaScript crash course videos. Thanks so much for providing these, they are a great knowledge gap filler. So, while watching this segment, I noticed your output of the console.log calls does not display "undefined" after each call lime mine is doing. I assume it's because you recorded these segments on an older version of Java Script? Or is there some sort of pragmatic setting to stop these from appearing on the console? I know it's because I'm calling the function from within the console.log with no return statement. I have to add a return 1; to quiescence the "undefined" lines. But your code doesn't have a return. 🤔

[@Slaptile]

So I went to college for Computer Engineering and obviously I learned all of this in my CS courses, but I have to say - you really know how to teach CS and how to teach it WELL. Your explanations and examples are outstandingly good and this is coming from a college graduate who has some pretty good knowledge on CS concepts and ideas. I've always loved your tutorials, but your explanation on Primitive vs Reference types are outstandingly clear and concise. Keep it up! :D

[@Niko.S23]

perfect . you are the best teacher

[@brahm-ahamasmi]

Some errors while talking about references Firstly: 1. const redeclaration 2. Assignment to constant variable. If the above are fixed like below: let userOne = { name: 'shaun', score: 100 }; let userTwo = userOne; userOne = { name: 'shaun', score: 50 }; 3. Here is the third error. The third line creates a NEW object on heap pointed by userOne. The old object remains on the heap, pointed to by userTwo. userTwo.score remains 100. userOne and userTwo behave as intuitively one may expect. Instead, the magic happens when one does the following: let userOne = { name: 'shaun', score: 100 }; let userTwo = userOne; userOne.score = 50; In this case the score property of existing object pointed by both userOne and userTwo gets updated so now even userTwo.score is 50

[@shamic_abby8343]

I don't now how can I thnk you, but you help me a lot thank you so much broo

[@mboe94]

Thanks, this was great!

[@NetNinja]

Glad it was helpful! :) thanks so much for your support

[@eshah3895]

Thank you sir! For great explanation of the object.

[@jassminherrera4958]

You explained this concept so well!!! Like 👍🏻 5 stars.

[@NetNinja]

Thanks! 😃

[@sakihayashi8769]

OMG. I'd love to purchase your course ...

[@jassminherrera4958]

I just want to say thank you !! U are amazing. It finally clicked 🙏🏻

[@NetNinja]

Awesome! Glad it helped! 😃

[@cedric_ds]

32:54 Hey Ninja I think you made some mistakes there: 1. const can't be changed 2. the old object of userOne doesn't get changed, instead a NEW object gets created, and userOne then points to that one, userTwo stays unchanged Great videos though :)

[@pulok9909]

your no.1 correction is right. but that was on a slide not in code editor.he made the mistake using const keyword instead of let keyword. but he made it correct at code editor in the demonstration at 34:00 your no.2 correction is wrong.because in javaScript you need not use NEW keyword to make new object. it will be in JAVA. you can easily copy that in our regular way.please check the demonstration 35:00 thank you.

[@rajkumartelukuntla3890]

Yes you can't change const but I think it can be redefined.

[@blueprintuniversalllc9919]

I just went to purchase the Udemy course, but the discount codes I found (found a couple below) are no longer active. Do you have a new discount code that is still active? And by the way, your courses are absolutely AMAZING! I have subscribed and Joined your channel here and told some colleagues.

[@elgizhasanzada]

Can't stop watching your videos mannn xD

[@Omar_Muhammad]

Thanks a lot, man u get me on the tracks

[@CristiansProduction]

bloody brilliant mate!

[@phraggers]

29:30 as a C programmer learning JS, hearing "the heap is slower" made me wince! in C, memory is memory no matter where it is. Are you saying that JS dereferences a pointer every single time it accesses the heap? seems like a very odd language design choice, derefercing pointers is (last I checked) the slowest operation a cpu can perform!

[@abiolacomputing]

Thank you so much for your explanation

[@cooper9884]

this is a lovely tutorial thank you

[@codingnewbie5954]

you are a god sent brotha

[@meisterunner]

@17:20 THANK YOU!!

[@Ahmed-bw8fx]

amazing explanation !

[@elhananben8341]

Amazing! Thank you very much for this videos!

[@gpjapan]

11:02 "A method is a function defined by an object... A regular function isn't defined inside an object; a method is."

[@chetan_nada]

great session. i learned a lot.

[@lwazoor212]

thank you G we love you Gangster

[@chineduifeanyi552]

Thanks a lot chief

[@NetNinja]

No worries :)

[@changecollar]

That's really Helpful