An Encounter with JavaScript Objects

Подписаться 3,2 млн

Просмотров 144 тыс.

50% 1

Part five of the full #JavaScript course 🐇🕳️. Learn everything you need to know about the JS Object fireship.io/courses/javascript/
Topics covered include:
- Object creation
- Bracket vs Dot Notation
- Property descriptors
- How object references work
- Prototype chain
- Modern syntax like spread and destructuring
- Loop over objects
- Custom object constructors
MDN Object Docs developer.mozilla.org/en-US/d...
Take the #JS quiz 🤓
iOS itunes.apple.com/us/app/fires...
Android play.google.com/store/apps/de...
Upgrade to Fireship PRO at fireship.io/pro
Use code lORhwXd2 for 25% off your first payment.

Наука

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

17 окт 2019

Ссылка:

Скачать:

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

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 210

@Fireship 4 года назад

Let's just pretend the audio issues in this video were meant to add extra suspense 👻 ¯\_(ツ)_/¯

@vasiovasio 4 года назад

One question - what is the editor and theme that you use in your videos? Looks like Visual Studio Code with Material theme?

@Fireship 4 года назад

@@vasiovasio VS Code + Atom One Dark + vscode-icons

@911madza 4 года назад

@@Fireship hands down Atom had the most beautiful UI, tho VS Code is light years ahead when it comes to performance and features... to be honest, I still miss the smooth look and feel of Atom (One Dark theme don't fully recreate that), but in nowadays rush you have to go with what's best for productivity...

@jiandeng8595 4 года назад

another qutestion, how to quick type the emoji string, i had to use the short ctrl+shift+b (Windows) and select one from the list

@chromus9149 3 года назад

What plugins do you use to get the squares on the left side and the console.log showing its output on the right?

@gospodarsile4606 4 года назад

Let's be honest. There is no better programming content than FireShip. A big thank you! I hope you never stop making videos.

@jaimerojas6578 4 года назад

Yeah I just love the format of the videos!

@WTFAnyNameWorks 2 года назад

Truer words have never been spoken!

@ar7alamin842 2 года назад

Kkkkkokkokkkokokkokk

@ar7alamin842 2 года назад

@@WTFAnyNameWorks kkokkkkokokokokkok

@ar7alamin842 2 года назад

kkokkkkkkk

@tobeqz7065 4 года назад

This course is PERFECT for people with some programming background who need to learn JS quickly. Thank you so much for creating it. Thanks to you I've slowly started to fall in love with JS and I'm using it for more and more of my projects.

@FordExplorer-rm6ew 4 года назад

Or for dumb people like me who need to review this over and over

@wchorski 2 года назад

@@FordExplorer-rm6ew 🙃

@whatisiswhatable 10 месяцев назад

Really? I know JS pretty well but this stuff moves too fast and doesn't give anyone time to digest. It's REALLY well done and covers everything right but I'm not sure I'd recommend it

@LukeyDubs 4 года назад

I love the blend of high level concepts and basics. It’s not overwhelming, and it’s not too basic. Amazing content

@harshitvarma7867 Год назад

If someone did not understand 8:03 here is a quick explanation, it just means that in case of nested objects, example: let obj = { name: "John", anotherObject: { age: 52, } } -> if we Object.assign({}, ) this object to let say b, although it wont copy the properties of 'obj' through reference, lets call it hard copying, it will copy the properties inside the nested object (anotherObject here) through reference. means, changing the properties of nested objects will change the copied properties of b.

@marcusgallegos8384 4 года назад

This was very well produced. You Hit a lot of deep CS topics in a digestible high level way. Sharing this with my team!

@CaptTragedy Год назад

First of all I know the editing for this video probably took forever, especially finding old clips that fit the theme so thank you for that, but also your tutorials (albeit very short and fast) have been very helpful for someone like me who just graduated from a bootcamp( I know...) so thank you for the hard work!

@agustincisneros6725 4 года назад

This course is really good. You're explaining topics that are really complicated to understand because it's necessary to see the javascript history and it's hard to do. Thank you!

@TheRyanSmee 4 года назад

this it great. popping sound made me jump though ha

@Fireship 4 года назад

Sorry bout that, YT did not like the audio for some reason

@mabdullahsari 4 года назад

09:40 defining the eatBrain property on the new zombie object itself means that a brand new function is going to be created every time a new zombie is created. Better to set it on the function's prototype property so it is only declared once. Also, that is what happens behind the scenes when you use the class syntactic sugar. Great video!

@Fireship 4 года назад

That is a great point. I've been spoiled by TypeScript for a long time.

@davidjunghan91 4 года назад

duh, it's amazing

@TheCecchino98 2 года назад

sorry if i don't get it, but could you give an example of how to achieve that? From my understanding, by "function's prototype" you are referring to the constructor function (Zombie), and i'm having a hard time understanding how to access the prototype from there.

@mabdullahsari 2 года назад

@@TheCecchino98After having declared and assigned the constructor 👇 Zombie.prototype.eatBrain = function() {}; So, *outside* the constructor.

@TheCecchino98 2 года назад

@@mabdullahsari thank you very much!

@ProgrammingwithPeter 4 года назад

When I get notification from this channel, I know that I'm getting quality!

@piyushchoughule5383 4 года назад

10 min video and hours worth of content. Thank you so much.

@YashGupta-dr5re 4 года назад

9:53 const obj = new Zombie("👨‍💻 Jeff"); 🤣🤣🤣

@Kawaiiization 4 года назад

Love it! Love it! Love it! Fast pace for the win mate!

@sagnikpradhan3594 4 года назад

I really love the quality man! Good Work 👌

@theskyspire 4 года назад

I think I need to watch this at least 10 times to fully absorb the density of the content. Other videos it is common to speed playback to 1.5X , this is one video where slowing it down can actually be helpful.. refreshingly concise, great job.

@DivineZeal 4 года назад

With programming there are a million ways to do something, love it. Great video, learned some new tricks!

@pokefreak2112 4 года назад

Love how in depth these videos go, I had personally never heard of the object.entries destructuring trick before!

@Fatfit2 4 года назад

I don't think I've ever laughed while understanding Javascript more intimately at the same time... Twilight Zone is legit a great show btw...

@abdulelahaljeffery6234 4 года назад

concise, elegant, and tremendously informative ❤️

@MongooseTacticool 3 года назад

As a beginner, I'm so glad I found this channel :D

@MrTyty527 3 года назад

I came from a Python background and finally understand the mysterious rationale of copy and deepcopy of dictionaries. Thank you!

@tomascarignano5002 2 года назад

Jeff kudos to you man! You always make learning fun with all these creative jokes. Thanks a lot

@troythompson2 4 года назад

I learned A LOT in this one. This channel is so clutch.

@n.i.c 4 года назад

You just blew my mind. I've never heard of Bigint before 🤯

@Fireship 4 года назад

Bigint was the highlight of the video!

@YinonOved 4 года назад

thought I was in control of this topic...🤓 thanks for this refresher and sharpening

@arch7143 4 года назад

And that was perfect scene/phrase to end this!

@valcron-1000 4 года назад

Another amazing technical video about JavaScript

@dantech2011 4 года назад

Please do more of these videos! Thanks @Fireship

@adityashinde3864 4 года назад

I like your teaching style . please make more JavaScript video like this one.

@gunasekarant6498 4 года назад

Covered overall all the concepts 😍

@xeonblue007 4 года назад

This is a really awesome channel period.

@abdelkadermh 4 года назад

Thank you for the good content you're making!

@hughesd.mungus9819 4 года назад

I only ever used Javascript to make a small project for school and I mostly disliked the language. This tutorial made me appreciate the language a bit and I am just astounded at how you can make a programming tutorial so fun and interesting. I just have to say thank you and keep doing what you're doing man!

@DiwashHCR2 Год назад

The video I needed to watch .. thanks

@jaimerojas6578 4 года назад

Precious job my dude UwU ♥️

@user-ms2fn7cq1g 2 месяца назад

I can't believe that it's it's it's juuuuuuuust 10 min I'm like WOW, Thank you so much 💖

@slavamelanko5992 4 года назад

Perfect tutorial 👌🏼

@sourishdutta9600 4 года назад

Classic one cover almost everything, Thanks 😊. I just wanted to request you for something like if it is possible then please make a video on Symbol in es6 and their use case in real time application like where it's suitable for use and in enterprise application how we can maintain this. Thank you much . Big fan of yours.

@tropicaljupiter 3 года назад

The key to getting this video is to pause it, try the shit out in vscode, and go "ohhhh"

@roshanjose7692 Год назад

You and theo are my fav tech content creators

@favouroyende1111 Месяц назад

Thank you so much!

@shriniwasrocks 4 года назад

OMG Object.entries will make my life easier to deep check an object. Amazing! Thanks man!

@xTiQ 4 года назад

But you need to use a polyfill to make it work in IE. It's a new browser thing.

@JoeWong81 4 года назад

That was a great video thanks

@klutch4198 3 года назад

Still one of the best! 🔥🔥🔥

@palachokrab5711 3 года назад

Amazing content..

@mhytos420 9 месяцев назад

dude, you are saving my ass rn. Thank you!

@reymarkandog1441 4 года назад

What text editor are you using? Or what extension you used for those icons between the ' ' ?

@arturomedina2055 3 года назад

What's the extension he's using here to print those console.log() ?

@joaomelo6642 4 года назад

tks for the awesome content

@dasdunetechnologies1695 4 года назад

nice video, as vintage clips try some from the invaders tv serie !

@alekseysoldatenkov5675 4 года назад

Seeing destructuring in the for...of loop, was my twilight zone moment. Whats the outro track dawg?

@rahulgharde7603 4 года назад

good one. objects are the origin on JS

@SahilKashyap64 4 года назад

How do you make your videos they are so elegent. Your channel content quality is awesome. It looks like vscode editor and probably some emoji extension. What is the font size?

@NikhilKumar-yn6jf 4 года назад

Are we an object ? #Existential101

@Fireship 4 года назад

Or are we a primitive?

@moonythm 4 года назад

@@Fireship we are a wrapper around a primitive

@Fireship 4 года назад

@@moonythm Deep, i like that!

@nick.h7566 2 года назад

Gleasons map, noice!

@JohnDoe-fe3zw 4 года назад

That was a great video

@ShounenKaze 4 года назад

How do you have those cool icons in your code, like the trex and comet?

@yauul 4 года назад

Someone seems to be excited for Halloween

@edwardrhodes1518 4 года назад

You unlock this door with the key of imagination - yep, thanks for providing the door

@yash3827 4 года назад

Ultra use of object

@chittiphonglasunon8166 4 года назад

what extension you use to show the result of console.log ??

@sojumoscow 2 года назад

After watching this especially the last part, I am confused, so can I use function instead of a class? (Currently i dont know class)

@FabricioLoupias 4 года назад

what theme do you use for vs code?

@anonwithamnesia 4 года назад

Thanks 🙏

@archeron3004 11 месяцев назад

thank you

@YinonOved 4 года назад

Jeff what are these Emojis you use in your code? doesn't look typical

@RoughSubset 4 года назад

How do you get the emojis in you editor?

@ChumX100 4 года назад

Well that escalated quickly...

@eshaan7_ 4 года назад

I spent 4 hours parsing/escaping a JSON file, because a particular library kept rejecting it. Then when it finally worked, I used another library. And people say frontend dev is easy :)

@Ryu53898 4 года назад

So you stopped using Monokai pro ?

@edumorlom 4 года назад

what is the extension that displays the return as a comment on the right side called

@johnscale102 3 года назад

what font you are using?

@zemariagp 3 года назад

This is da bomb

@sarthakdalabehera3664 4 года назад

May I know the ending music?

@gamesseries7300 4 года назад

What theme you are using.?

@onee Год назад

4:01 This gives an error that says "Cannot redeclare block-scoped variable 'spider'." and "Cannot redeclare block-scoped variable 'legs'."

@pladimir_vutin 4 года назад

nicee. very helpful and very nice intro and music... btw what's your ide?

@jeffreyjdesir 3 года назад

{ neo: 'I know OOP.' }

@nagakrushnay4254 4 года назад

Which plugin you are using for getting console log outputs in ide ? Good video

@tartarus1322 4 года назад

I second that

@bgpratheep 4 года назад

I too want to know that....

@zaturntarto3814 2 года назад

Are you just using the "CTRL+Z" throughout the video or its video editing ?

@luis96xd 4 года назад

This was an excellent video! 😄 Great Quality! What if I came from Java and C# and I have and array of objects: clients[i] = new Client(name, lastName, phoneNumber); And I want to create a new object and assign its properties. How would it be in Javascript? And if I have other object which gets data of each client object. How would it be in Javascript? Because I'm getting problem getting property values from other objects

@chawker67 4 года назад

In 9:40 shouldn't the method be defined on the prototype?

@Ndzzle 4 года назад

First time I've actually slowed a video down just go catch all the content haha

@jazzz4988 Год назад

Fireship, could you please link me to the sound effect/music that plays from 0:15 to 0:25? That spacey, wide sounding music with some harp plucks? Thanks! (Also this video helped me a lot as a Javascript student)