What Is Prototypal Inheritance in JavaScript?
Learn how JavaScript's prototype chain works, how class syntax relates to it, and how property shadowing behaves.
Expected Interview Answer
Prototypal inheritance is JavaScript's mechanism where objects inherit properties and methods directly from other objects through a chain of internal [[Prototype]] links, rather than from fixed classes, so a property lookup that fails on an object automatically continues up its prototype chain until it is found or the chain ends at null.
Every JavaScript object has an internal link to another object, its prototype, accessible via Object.getPrototypeOf() or the legacy __proto__. When you access a property, the engine first checks the object's own properties; if it is not there, it walks up the prototype chain, checking each linked object in turn. Functions created normally have a .prototype property that becomes the prototype of any objects created with new, which is how constructor-function-based βclassesβ actually share methods across instances without duplicating them per object. Modern class syntax (class, extends) is syntactic sugar over this same prototype chain β under the hood, class methods still live on the prototype object, and extends still links one prototype to another. This matters practically because it explains why adding a method to a shared prototype instantly gives every existing instance access to it, and why shadowing a property on an instance hides, rather than deletes, the version further up the chain.
- Shares methods across many instances without duplicating memory per object
- Explains how the class/extends syntax actually works under the hood
- Allows dynamic extension β new prototype methods become available to existing instances
- Clarifies why property shadowing hides rather than removes a prototype property
AI Mentor Explanation
Prototypal inheritance is like a junior player who does not know a certain shot personally but automatically defers to their senior mentor's technique whenever asked, and if the mentor also does not know it, the question travels up to the mentor's own coach. The junior player never copies the shot into their own memory; they just have a live link to consult. If the junior later learns their own version of that shot, it simply overrides what the mentor would have answered, without erasing the mentor's version. That live, chained lookup β check yourself, then defer upward β is exactly how the prototype chain resolves property lookups.
Step-by-Step Explanation
Step 1
Object created with a linked prototype
Object.create(), a constructor function's .prototype, or class syntax links a new object to a prototype object.
Step 2
Property accessed on the object
JavaScript first checks the object's own properties for the requested key.
Step 3
Lookup walks the prototype chain
If not found locally, the engine checks the linked prototype, then that prototype's own prototype, and so on.
Step 4
Resolution ends at null or a match
The chain terminates at Object.prototype's prototype, which is null; if nothing matched, the result is undefined.
What Interviewer Expects
- Clear explanation of the internal [[Prototype]] link and chain walking on lookup
- Understanding that class/extends is sugar over the same prototype mechanism
- A concrete example using Object.create or a constructor function's .prototype
- Explanation of property shadowing when an instance defines its own property
Common Mistakes
- Confusing a function's .prototype property with an object's internal [[Prototype]] link
- Claiming JavaScript classes are fundamentally different from prototypes rather than sugar over them
- Believing prototype methods are copied per instance rather than shared via the chain
- Not knowing the chain terminates at null, causing infinite-loop misconceptions
Best Answer (HR Friendly)
βPrototypal inheritance means JavaScript objects can look things up on other linked objects instead of storing everything themselves. If a property is not found directly on an object, JavaScript automatically checks the object it is linked to, and so on, which is how many instances can share the same methods without copying them everywhere.β
Code Example
const animalPrototype = {
speak() {
return `${this.name} makes a sound`
},
}
const dog = Object.create(animalPrototype)
dog.name = 'Rex'
console.log(dog.speak()) // 'Rex makes a sound' - found on the prototype
function Cat(name) {
this.name = name
}
Cat.prototype.speak = function () {
return `${this.name} meows`
}
const whiskers = new Cat('Whiskers')
console.log(whiskers.speak()) // 'Whiskers meows' - shared via Cat.prototype
console.log(Object.getPrototypeOf(whiskers) === Cat.prototype) // trueFollow-up Questions
- How does the class/extends syntax map onto Object.create and the prototype chain internally?
- What is the difference between a function's .prototype property and __proto__?
- How does property shadowing work when an instance defines a property that also exists on its prototype?
- Why is Object.create considered a more direct way to set up prototypal inheritance than constructor functions?
MCQ Practice
1. What happens when a property lookup fails on an object's own properties?
A failed own-property lookup continues up the prototype chain until found or the chain ends at null.
2. What does modern JavaScript class syntax (class, extends) do under the hood?
class methods still live on the prototype object; extends still links one prototype to another.
3. If an instance defines its own property with the same name as one on its prototype, what happens?
Own properties are checked first, so they shadow (hide) a same-named property further up the chain.
Flash Cards
What is prototypal inheritance? β Objects inheriting properties via a chain of internal [[Prototype]] links, not fixed classes.
What happens on a failed property lookup? β The engine walks up the prototype chain until found or it reaches null.
Is class syntax a different mechanism from prototypes? β No β it is sugar over the same prototype chain.
What is shadowing? β An instance property hiding a same-named prototype property without deleting it.