Why Prototype inheritance in Javascript? - Purpose & Use Cases

The Big Idea

What if you could change one thing and instantly update hundreds of objects without touching each one?

The Scenario

Imagine you have many toy cars, and each car has some common features like wheels and color. If you want to give each car these features one by one, you have to repeat yourself a lot.

Now, think about if you want to change the color of all cars later. You would have to change each car separately, which is tiring and slow.

The Problem

Manually copying the same features to every object wastes time and space. It's easy to make mistakes, like forgetting to add a feature or adding it inconsistently.

Also, if you want to update a common feature, you must find and change it in every object, which is error-prone and frustrating.

The Solution

Prototype inheritance lets objects share common features automatically. Instead of copying, objects link to a shared prototype where common features live.

This means you write the shared features once, and all objects can use them. If you update the prototype, all linked objects see the change instantly.

Before vs After

✗ Before

function Car() {
  this.wheels = 4;
  this.color = 'red';
}

const car1 = new Car();
const car2 = new Car();

✓ After

const carPrototype = { wheels: 4, color: 'red' };
const car1 = Object.create(carPrototype);
const car2 = Object.create(carPrototype);

What It Enables

It enables efficient sharing of behavior and properties across many objects, making code easier to maintain and extend.

Real Life Example

Think of a video game where many characters share common actions like walking or jumping. Prototype inheritance lets all characters use the same action code without repeating it for each one.

Key Takeaways

Manual copying of features is slow and error-prone.

Prototype inheritance shares features through a linked prototype object.

Updating the prototype updates all linked objects automatically.