Understanding the JavaScript Prototype Chain

Поділитися
Вставка
  • Опубліковано 19 гру 2024

КОМЕНТАРІ • 44

  • @islombekhasanov
    @islombekhasanov Рік тому

    The part where we both just sat looking at the console thinking WHY IT WORKS 😂😂😂 hilarious. Honestly thanks for the videos! Lots of respect from Uzbekistan 🇺🇿

  • @pupdoggify
    @pupdoggify 5 років тому +15

    I must say that you have the most genuine, easy to understand, well explained/high-quality tutorials on concepts that've been foreign to me forever! Now, who remembers Prototype.js from the good ol' days ;)

  • @aravindm6124
    @aravindm6124 4 роки тому +4

    Eventhough this prototype concept is bit difficult to understand , watching it again and again ,slowly understanding the purpose of prototype, Thank you Sir , you are a legend at Java Script

  • @foysalmohammad3278
    @foysalmohammad3278 3 роки тому

    I don’t understand why you are so underrated!!! This guy is so precise and clear.

  • @saifullahmansur6607
    @saifullahmansur6607 Рік тому

    You've made that hard to get around topic so easy to me. Thank you Professor

  • @rotrose7531
    @rotrose7531 4 роки тому

    I owe you a lot that the fact I can write some javascript from scratch now is all because you have assisted me along the way, Thank you. Now the subscribers are 28K, when it reaches 30k, then you can do the patron program, I will be the first to participate.

  • @hey.............
    @hey............. 3 роки тому

    I have not seen a better explanation for this topic. Quality Content💯. Thanks Steve, this really helped me.

  • @osamagamal495
    @osamagamal495 5 років тому +1

    as always you simplify every topic in js. and make it look easy!
    keep it up, you're really a great teacher.

  • @alexsilva820
    @alexsilva820 5 років тому +2

    The best explanation as always. Thanks sir

  • @maxtayebwa8987
    @maxtayebwa8987 5 років тому +8

    Amazing, prof! Thanks so much for this. Have you ever considered creating a patron program for this channel where subscribers could say contribute $5 a month to you as a token of appreciation for these great classes? I gladly would consider this without a second thought, you, Prof, alone, rectified my javascript singlehandedly!
    I am open to suggestions from you and other subscribers!
    Please keep doing this, blessings!

    • @SteveGriffith-Prof3ssorSt3v3
      @SteveGriffith-Prof3ssorSt3v3  5 років тому +7

      I have thought about sponsorships (as UA-cam calls them). But I need 30k subscribers before I can do that.

  • @kaiansaari7398
    @kaiansaari7398 5 років тому

    This is by far the best vid on js proto's. Thank you!

  • @swaroopbhave651
    @swaroopbhave651 5 років тому +2

    That was a very clean explanation of prototype and __proto__. Could you please add a video on classical inheritance vs prototypal inheritance. Its a big confusion!

  • @Nick-we5wg
    @Nick-we5wg 4 роки тому

    Each video - best explanation !

  • @richochet
    @richochet Рік тому

    Brilliant thank you very much for this another great tutorial

  • @JosephPachuau
    @JosephPachuau Рік тому

    In 1:52, you said "this object obj has its prototype as otherProto" but when i run the code : console.log(Object.getPrototypeOf(obj)); it just returns {} in VS Code...why?

  • @chesterxp508
    @chesterxp508 3 роки тому

    Another very cool tutorial!

  • @walltack8826
    @walltack8826 3 роки тому +1

    I love how you just sit there in silent disbelief for a few seconds at 5:40 when obj.__proto__.someMethod() works

  • @Snoo29293
    @Snoo29293 4 роки тому +1

    Is there any difference in the prototype chain for map objects, set objects and arrays? Also, when you create an object with a class, is the prototype chain of that object similar to how it is when you create an object with a constructor?

    • @SteveGriffith-Prof3ssorSt3v3
      @SteveGriffith-Prof3ssorSt3v3  4 роки тому

      Maps, Sets, and Arrays all have their own constructor with their own prototype object. Then they are all connected to the Object prototype. Whether you use `class` or `object.create` or `new` you are doing the same thing with a constructor and it's prototype.
      You might also be interested in my other videos about the prototype chain and classes - ua-cam.com/video/XoQKXDWbL1M/v-deo.html
      ua-cam.com/video/01jVgCK-HX4/v-deo.html

  • @juanyang838
    @juanyang838 5 років тому

    2:30 Are there any ways to inspect in the dev console that all the prototypes chain is heading to null? That part is the only part that I can't understand.

    • @SteveGriffith-Prof3ssorSt3v3
      @SteveGriffith-Prof3ssorSt3v3  5 років тому +1

      You can always use the Object.getPrototypeOf( obj ) method to get the prototype of an object. You can write that in the console.log. Here is a sample that creates an object with its own custom prototype object. It's prototype object then links to the Object prototype and then it links to null.
      let myObjProto = {
      f: function() {
      return 42;
      }
      };
      let myObj = Object.create(myObjProto, {
      prop: {
      value: "value"
      }
      });
      let protoT = Object.getPrototypeOf(myObj);
      console.log("prototype is", protoT);
      while (protoT !== null) {
      protoT = Object.getPrototypeOf(protoT);
      console.log("prototype is", protoT);
      }

  • @beatrixdevine4101
    @beatrixdevine4101 2 роки тому

    Really helped, thank you so much!

  • @kaos092
    @kaos092 4 роки тому

    When I create an object it does not have a prototype object on it. It has a reference to object with proto.

  • @totfosk
    @totfosk Рік тому +1

    thank you Steve!!

  • @MatterAAA
    @MatterAAA 4 роки тому

    Hi Steve, I am a little new to this. Is prototypes only a ES5 thing? Is it relevant to ES6?

    • @SteveGriffith-Prof3ssorSt3v3
      @SteveGriffith-Prof3ssorSt3v3  4 роки тому

      prototypes are a core part of JS that goes back to version 1 and they will always be part of JS. They are incredibly relevant regardless of which version features you are looking at.

    • @MatterAAA
      @MatterAAA 4 роки тому +1

      @@SteveGriffith-Prof3ssorSt3v3 Thank you

  • @maksymantoshkin2896
    @maksymantoshkin2896 5 років тому

    Hmm🤔, is it possible to point Object.prototype to some custom object? Will it extend every instance of Object?

    • @SteveGriffith-Prof3ssorSt3v3
      @SteveGriffith-Prof3ssorSt3v3  5 років тому +2

      Object is the built in top of the chain. Its prototype points to null. You can't change it. But you can build as many custom objects as you like and extend them. It all leads back to Object.prototype and /or null. You can point your object prototypes to null if you want.

    • @SteveGriffith-Prof3ssorSt3v3
      @SteveGriffith-Prof3ssorSt3v3  5 років тому +2

      This is the error that you get if you try to overwrite the Object prototype:
      TypeError: Cannot assign to read only property 'prototype' of function 'function Object() { [native code] }'

    • @SteveGriffith-Prof3ssorSt3v3
      @SteveGriffith-Prof3ssorSt3v3  5 років тому +1

      Here is a good reference to read about __proto__ developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/proto
      Along with the recommendations to avoid changing the prototype of an Object for performance reasons.
      Using Object.create( protoObj ) when you create an Object is fine. Try to avoid changing prototypes after the fact and especially with built-in objects.
      This link too - developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/prototype

  • @michael.knight
    @michael.knight 5 років тому

    Got a question, something that I'm trying to understand, so you write otherProto.prototype.someMethod instead of otherProto.someMethod, because if you wrote the latter, the method would not become available to obj? So modifying otherProto does not automatically modify its prototype?

    • @SteveGriffith-Prof3ssorSt3v3
      @SteveGriffith-Prof3ssorSt3v3  5 років тому +1

      When you create an Object, that object will automatically have a prototype object. The prototypes are what gets linked to create the prototype chain. If you want methods to be available to the objects that are below then you typically place them on the prototype. The prototypes then get connected to form the prototype chain.
      You can alternatively create an object to specifically be the prototype of your object. In this case you would put the methods inside the object and then set the object as the prototype for your other object.

  • @bikramchettri9405
    @bikramchettri9405 5 років тому

    Hey Steve can you please explain two sum algorithm?

    • @SteveGriffith-Prof3ssorSt3v3
      @SteveGriffith-Prof3ssorSt3v3  5 років тому +1

      Please post requests for tutorials on my tutorial request video - ua-cam.com/video/LCezax2uN3c/v-deo.html

  • @pythonfinance8607
    @pythonfinance8607 4 роки тому

    that was a great video. I also create simillar content.

  • @56BAK
    @56BAK 5 років тому

    thanks

  • @anagabriele7340
    @anagabriele7340 4 роки тому

    thanks, would be awesome if you had a course on udemy!!!!

  • @Retrofire-47
    @Retrofire-47 3 роки тому +1

    i have to be honest JavaScript kind of feels retarded sometimes because of systems like this. it's like an object is creating an object using another object? it's just weird and confusing. but i guess it works

  • @alexvass
    @alexvass 2 роки тому

    Thanks