Prototype Chain in JavaScript

JavaScript is a prototype-based language, which means objects can inherit properties and methods from other objects.

This inheritance happens through something called the Prototype Chain.

Understanding the prototype chain is essential because it explains how JavaScript objects share functionality and reuse code efficiently.

In this guide, we will explain the prototype chain in a simple way with practical examples, so developers at every level can understand it easily.

What is a Prototype in JavaScript?

Before understanding the prototype chain, we must understand what a prototype is.

In JavaScript, every object has an internal property called:

JavaScript
[[Prototype]]

This property points to another object.

That object is called the prototype.

The prototype allows objects to inherit properties and methods from other objects.

What is the Prototype Chain?

The prototype chain is the process JavaScript uses to search for a property or method when it is not found in the current object.

When you access a property:

  1. JavaScript first checks the object itself
  2. If not found, it checks the object’s prototype
  3. Then it checks the prototype’s prototype
  4. This continues until JavaScript reaches null

This sequence of prototypes is called the prototype chain.

Simple Example of Prototype Chain

JavaScript
function Person(name) {
  this.name = name;
}

Person.prototype.sayHello = function () {
  console.log("Hello " + this.name);
};

const user = new Person("Mickey");

user.sayHello();

How JavaScript Searches for sayHello()

When user.sayHello() runs, JavaScript checks:

JavaScript
user object

Person.prototype

Object.prototype

null

Since sayHello() exists inside Person.prototype, JavaScript executes the function.

Visual Representation of Prototype Chain

Example chain structure:

JavaScript
user

Person.prototype

Object.prototype

null

Every JavaScript object eventually inherits from Object.prototype, which is the top of the prototype chain.

Accessing an Object’s Prototype

You can check the prototype of an object using:

Modern Method

JavaScript
Object.getPrototypeOf(obj)

Example:

JavaScript
function Person(){}

const user = new Person();

console.log(Object.getPrototypeOf(user) === Person.prototype);

Output:

JavaScript
true

Older Method

JavaScript
obj.__proto__

However, __proto__ is considered deprecated, so developers should prefer Object.getPrototypeOf().

Why the Prototype Chain is Important

The prototype chain plays a major role in how JavaScript works.

1. Enables Inheritance

Objects can inherit properties and methods from other objects.

2. Improves Memory Efficiency

Instead of duplicating methods in every object, they are stored once in the prototype.

3. Promotes Code Reusability

Developers can reuse shared methods across multiple objects.

4. Core Concept of JavaScript

Many frameworks like React, Angular, and Node.js rely on prototype-based behavior internally.

Prototype Chain with Constructor Functions

Example:

JavaScript
function Animal(name) {
  this.name = name;
}

Animal.prototype.sound = function () {
  console.log("Animal makes sound");
};

const dog = new Animal("Tommy");

dog.sound();

Here the lookup chain becomes:

JavaScript
dog

Animal.prototype

Object.prototype

null

Common Interview Question

What happens when a property is not found in the object?

JavaScript automatically searches the prototype chain until it finds the property or reaches null.

Key Points to Remember

✔ Every JavaScript object has a prototype
✔ Prototypes create a chain of inheritance
✔ Property lookup travels up the prototype chain
✔ The chain always ends with null

Conclusion

The prototype chain is a fundamental concept that powers JavaScript’s inheritance system.

It allows objects to share properties and methods efficiently while keeping memory usage low. By understanding how the prototype chain works, developers can write cleaner, more efficient, and scalable JavaScript code.

Whether you are a beginner or an experienced developer, mastering the prototype chain will help you better understand JavaScript’s object model and inheritance system.