Introduction to Prototypes in JS

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

КОМЕНТАРІ •

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

    Steve comin in clutch again 3 years later. Thank you so much. You've been here with me through my entire Programming Journey.

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

      A few other videos to help with prototypes
      ua-cam.com/video/01jVgCK-HX4/v-deo.html
      ua-cam.com/video/GhJTy5-X3kA/v-deo.html
      ua-cam.com/video/XoQKXDWbL1M/v-deo.html

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

    I've been watching your tutorials on javascript from last 2 days, you explained everything so clearly, and i gotta say your explanation about protottypal inheritance is the best by far, thank you.

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

    Thank you as always for creating all these magic tutorials. Please, please do not stop. Your addicts are increasing.

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

    Excellent and clear explanation, you deserve a subscribe ...

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

    You are amazing
    I watched almost all the videos on prototype in JavaScript but I didn't understood. But after watching your video I just started making my app with prototypes without any hassle.
    Keep it up and love you 👍❤️

  • @RajeshSahu-qp6cc
    @RajeshSahu-qp6cc 4 роки тому

    Steve you explain the concepts so simple...

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

    This thing is literally the Gold dust♥♥♥♥♥♥♥ I have been looking for thanks a lot

  • @emcsquared9
    @emcsquared9 2 роки тому +1

    These videos are so so good. Thank you so much for explaining things so clearly.

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

    Thanks a lot!
    Your explanations are just brilliant! Love it.
    and You're a great teacher!

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

    Precise and on point content! Thank you Sir

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

    that was really useful, thank you so much, u deserve millions of watching

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

    I truly thank you for making great contents. Please don't stop

  • @rongrongie5668
    @rongrongie5668 6 років тому +5

    Thanks Steve your courses had been excellent so far :)
    I've had a clear understanding i must say by far it's the best course i've ever had.
    Please keep up the good work Steve.
    And btw Steve do you have Node.js full course? it would be great if you had one.
    I want to learn from ground up.

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

      I don't have any videos that focus on server-side nodeJS yet. However, the fundamentals of all the JavaScript that I'm writing work with NodeJS, with the exception of anything to do with the DOM. There is no document object model in NodeJS because there is no browser. If you want to do AJAX things then you need to install node-fetch and include it in your JS files.
      I will eventually have some server-side specific NodeJS but that won't happen until May or June.
      Thanks for following.

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

    Simple and concise. I loved the content!

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

    Excellent explanation

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

    excellent explanation.

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

    Another very cool tutorial !

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

    Excellent as always! Thank you!

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

    Clear and concise ... Danke!

  • @mkamalkayani
    @mkamalkayani 6 років тому

    Great explanation.

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

    Can one object have many prototypes or is it a direct 1 to 1 chain?

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

    Well explained. Thanks

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

    Hi Steve , it's me again

  • @deylenergy5761
    @deylenergy5761 6 років тому

    Nice explanation. However, in my opinion it would be better to show prototype chain in Chrome Developer Tools. Anyway, valuable content.

    • @SteveGriffith-Prof3ssorSt3v3
      @SteveGriffith-Prof3ssorSt3v3  6 років тому

      Hi Del, thanks for your note. No single explanation will work for everyone. The Chrome Dev tool console is a good place to get a visual reference for what is in the Prototype though. Thanks for the suggestion. Hope it helps some people.

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

    Amazing!!

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

    thank you sir

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

    I like your voice too😺😺 I feel attracted to you😸

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

    I'm confused at the beginning here. You say the prop1 property "is a function which writes out 'prop1'" in which case I would have expected you to write obj = {prop1: ()=> {console.log(prop1)}} . It's confusing that you left out the {} on the body because of the implied return statement. prop1 is actually a function that returns the return value of console.log() . I would think you'd be more careful about this sort of thing when teaching beginners... very important from them to know the difference between () => {foo()} and () => foo() . Actually I stopped watching there because I lost trust in your instruction.

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

      I have lots of other videos about functions, arrow functions and other es6 features. I also have other videos explaining a lot more about prototypes in greater detail. This video is only about the concept behind prototypes, not about arrow functions.
      As for my instruction, I have been teaching web development for over 20 years and have taught thousands of students with great success. Sorry you got hung up on that unrelated point.

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

    Hello Steve, how have you been? I made this from the video. If you can proof read it I'd appreciate. You can use it any way you'd like.
    let obj1 = {
    prop1: () => console.log("prop1"),
    };
    obj1.prop1(); //prop1
    obj1.toString(); //no error because it's attached
    let obj2 = {
    prop2: () => console.log("prop2"),
    };
    Object.setPrototypeOf(obj2, obj1);
    // Sets the prototype of a specified object o to object proto or null. Returns the object o.
    // @param o - The object to change its prototype.
    // @param proto - The value of the new prototype or null.
    // obj2 uses obj1 as it's prototype
    obj2.prop2(); // prop2
    obj2.prop1(); // prop1
    obj2.toString(); //no error because it's also built in. Creates pointers and copies.
    for (let prop in obj2) {
    console.log(prop);
    }
    Object.getPrototypeOf(obj2);
    // Returns the prototype of an object
    Object.getPrototypeOf(obj2).prop1;
    // This will work because it points to obj1
    // To Dissern between methods that belong to the Object itself vs. methods that belongs to it's prototype, we use a method called getOwnPropertyNames()
    console.log(Object.getOwnPropertyNames(obj2)); // ["prop2"]
    console.log(Object.getOwnPropertyNames(obj1)); // ["prop1"]
    console.log(Object.getOwnPropertyNames(Object.getPrototypeOf(obj1)));
    /*
    These belong to every object.
    [
    ("constructor",
    "__defineGetter__",
    "__defineSetter__",
    "hasOwnProperty",
    "__lookupGetter__",
    "__lookupSetter__",
    "isPrototypeOf",
    "propertyIsEnumerable",
    "toString",
    "valueOf",
    "__proto__",
    "toLocaleString")
    ];
    */
    Object.create(); //Pass in the prototype we want to use and provide provide properties and specify if they are enumerable, among other specific factors.
    Object.assign(); //Pass in the prototype we want to use and a list of properties.