What is prototypal inheritance?

JavaScript

The short answer

Prototypal inheritance is JavaScript's way of sharing properties and methods between objects. Instead of using classes like Java or C++, JavaScript objects can directly inherit from other objects through a hidden link called the prototype.

How it works

Every object in JavaScript has an internal link to another object called its prototype. When you try to access a property on an object and it does not exist on that object, JavaScript looks at its prototype. If it is not there either, JavaScript looks at the prototype's prototype. This continues until it reaches an object with a null prototype, which is the end of the chain.

Let me show you a simple example:

const animal = {
  eat() {
    console.log('Eating...');
  },
};
const dog = Object.create(animal);
dog.bark = function () {
  console.log('Woof!');
};
dog.bark(); // "Woof!" — found on dog itself
dog.eat(); // "Eating..." — found on dog's prototype (animal)

Here is what happened:

  1. We created an animal object with an eat method
  2. We created a dog object using Object.create(animal). This sets animal as the prototype of dog
  3. When we call dog.eat(), JavaScript does not find eat on dog, so it looks at dog's prototype, which is animal. It finds eat there and runs it

The dog object did not copy the eat method. It is using the one from animal through the prototype link. This is prototypal inheritance.

proto vs prototype

This is a part that confuses a lot of people. There are two different things here:

  • __proto__ — Every object has this. It points to the object's prototype (the object it inherits from).
  • prototype — Only functions have this. It is the object that will become the __proto__ of objects created using new with that function.
function Person(name) {
  this.name = name;
}
Person.prototype.greet = function () {
  console.log(`Hi, I am ${this.name}`);
};
const john = new Person('John');
john.greet(); // "Hi, I am John"
// john.__proto__ === Person.prototype → true
// Person.prototype.__proto__ === Object.prototype → true

When we call new Person('John'), JavaScript creates a new object and sets its __proto__ to Person.prototype. That is how john gets access to the greet method.

Object.create vs new

There are two main ways to set up prototypal inheritance:

Using Object.create:

const parent = {
  sayHello() {
    console.log('Hello');
  },
};
const child = Object.create(parent);
child.sayHello(); // "Hello"

Object.create is the simplest way. It creates a new object and sets its prototype to whatever you pass in.

Using constructor functions with new:

function Parent() {}
Parent.prototype.sayHello = function () {
  console.log('Hello');
};
const child = new Parent();
child.sayHello(); // "Hello"

Both do the same thing — they set up a prototype link so the child object can access the parent's methods.

How ES6 classes use prototypes

ES6 classes are just a cleaner syntax on top of prototypal inheritance. Under the hood, they work exactly the same way.

class Animal {
  eat() {
    console.log('Eating...');
  }
}
class Dog extends Animal {
  bark() {
    console.log('Woof!');
  }
}
const dog = new Dog();
dog.eat(); // "Eating..."
dog.bark(); // "Woof!"
// Under the hood:
// dog.__proto__ === Dog.prototype → true
// Dog.prototype.__proto__ === Animal.prototype → true

The class and extends keywords are just making it easier to write. The prototype chain underneath is exactly the same as what we saw earlier.

Common Pitfalls

A common mistake is thinking that ES6 classes work like classes in Java or C++. They do not. JavaScript does not have real classes — it only has objects and prototypes. The class keyword is syntactic sugar. If an interviewer asks "Does JavaScript have classes?", the correct answer is that it has the class syntax, but it still uses prototypal inheritance under the hood.

Interview Tip

When explaining prototypal inheritance, use a simple example like the animal/dog one above. Draw the prototype chain step by step — show where JavaScript looks first, then where it goes next. If the interviewer asks about __proto__ vs prototype, explain that __proto__ is the actual link on every object, while prototype is a property on functions that becomes the __proto__ of objects created with new.

Why interviewers ask this

Prototypal inheritance is one of the core concepts of JavaScript. It is how the language works. When interviewers ask about this, they want to see if you understand how objects share behavior in JavaScript, how the prototype chain works, and whether you know that ES6 classes are just syntax sugar on top of prototypes. A candidate who can explain this clearly shows they understand JavaScript at a deep level, not just the surface.

Table of Contents