Prototypes & The Prototype Chain

8. Practice Problems

1. Show that Object.getPrototypeOf({}) is Object.prototype.
   ✨ Show Answer

   a1.js

   console.log(Object.getPrototypeOf({}) === Object.prototype);

   Run Copy

2. Use Object.create to share a method across two objects.
   ✨ Show Answer

   a2.js

   const base = { say() { return `hi, ${this.name}`; } };
   const a = Object.create(base); a.name = "Arif";
   const b = Object.create(base); b.name = "Karim";
   console.log(a.say(), b.say());

   Run Copy

3. Build a constructor function Vehicle(type) with a describe method on the prototype.
   ✨ Show Answer

   a3.js

   function Vehicle(type) { this.type = type; }
   Vehicle.prototype.describe = function () { return `a ${this.type}`; };
   console.log(new Vehicle("car").describe());

   Run Copy

4. Verify that all instances of Person share the same prototype method.
   ✨ Show Answer

   a4.js

   function Person(n) { this.n = n; }
   Person.prototype.say = function () { return this.n; };
   const a = new Person("a"), b = new Person("b");
   console.log(a.say === b.say);   // true

   Run Copy

5. Use instanceof to test array vs plain object.
   ✨ Show Answer

   a5.js

   console.log([] instanceof Array);
   console.log([] instanceof Object);
   console.log({} instanceof Array);

   Run Copy

6. Inherit one constructor from another the pre-class way.
   ✨ Show Answer

   a6.js

   function Animal(s) { this.s = s; }
   Animal.prototype.describe = function () { return this.s; };
   
   function Dog(name) { Animal.call(this, "dog"); this.name = name; }
   Dog.prototype = Object.create(Animal.prototype);
   Dog.prototype.constructor = Dog;
   
   const d = new Dog("Tom");
   console.log(d.describe(), d.name);

   Run Copy

7. Demonstrate prototype lookup by reading arr.toString.
   ✨ Show Answer

   a7.js

   const a = [1,2,3];
   console.log(a.toString());  // "1,2,3"
   console.log(a.hasOwnProperty("toString"));   // false

   Run Copy

8. Show shadowing — own property hiding a prototype property.
   ✨ Show Answer

   a8.js

   const p = { hi: "proto" };
   const o = Object.create(p);
   o.hi = "own";
   console.log(o.hi);
   delete o.hi;
   console.log(o.hi);

   Run Copy

9. Show that Object.create(null) has no prototype (and no toString).
   ✨ Show Answer

   a9.js

   const bare = Object.create(null);
   console.log(Object.getPrototypeOf(bare));    // null
   console.log(bare.toString);                  // undefined

   Run Copy

10. Why is monkey-patching Array.prototype dangerous?
    ✨ Show Answer

    Answer: Adding new methods to a built-in prototype affects every array in the entire program — your code, library code, and any future feature. for...in on an array will pick up your method as an enumerable key, breaking unrelated code. Future spec methods may collide with your name. Treat built-in prototypes as read-only.

11. Build a safe object using Object.create(null) and put a "__proto__" key on it.
    ✨ Show Answer

    a11.js

    const safe = Object.create(null);
    safe["__proto__"] = "just a key";
    console.log(safe["__proto__"]);     // "just a key"

    Run Copy

12. Detect own properties only with Object.hasOwn.
    ✨ Show Answer

    a12.js

    const a = { x: 1 };
    console.log(Object.hasOwn(a, "x"));         // true
    console.log(Object.hasOwn(a, "toString"));  // false

    Run Copy

13. Override toString on a custom object.
    ✨ Show Answer

    a13.js

    function Money(n) { this.n = n; }
    Money.prototype.toString = function () { return `৳${this.n}`; };
    console.log(`Total: ${new Money(99)}`);

    Run Copy

14. Compare __proto__ vs prototype in two sentences.
    ✨ Show Answer

    Answer: obj.__proto__ is the parent of an existing instance — the lookup target. Fn.prototype is a property on the function that becomes the __proto__ of any instance produced by new Fn().

15. Show that walking the chain reaches null.
    ✨ Show Answer

    a15.js

    let p = {};
    while (p) {
        console.log(p);
        p = Object.getPrototypeOf(p);
    }

    Run Copy

16. Build a tiny prototype-based mixin: copy methods from an object onto a target's prototype.
    ✨ Show Answer

    a16.js

    const serializable = {
        toJSON() { return { ...this }; }
    };
    function User(n) { this.name = n; }
    Object.assign(User.prototype, serializable);
    console.log(JSON.stringify(new User("Arif")));

    Run Copy

17. Use Object.setPrototypeOf to change an object's parent — and explain why it's slow.
    ✨ Show Answer

    a17.js

    const base = { hi() { return "hi"; } };
    const obj = {};
    Object.setPrototypeOf(obj, base);
    console.log(obj.hi());

    Run Copy

    Engines optimize property lookups by caching the object's shape. Mutating the prototype invalidates those caches and forces deoptimization — that's why Object.create at construction is preferred to setPrototypeOf later.

18. In one paragraph, explain inheritance in JS to a Java programmer.
    ✨ Show Answer

    Answer: Java has classes — compile-time blueprints. JavaScript has only objects, but each object can link to another object as its parent through a hidden [[Prototype]]. Method calls walk that chain at runtime; there are no compile-time class declarations under the hood. ES6 class syntax is sugar over this same chain — even extends just sets up the chain via Object.create.