Skip to content

JavaScript Prototype Inheritance Error Fix

DodaTech Updated 2026-06-24 3 min read

In this tutorial, you'll learn about JavaScript Prototype Inheritance Error Fix. We cover key concepts, practical examples, and best practices.

The Problem

Prototype inheritance in JavaScript can produce confusing errors when you try to access a property that exists on the prototype but not on the instance, or when a prototype method is shadowed by an instance property.

Quick Fix

Step 1: Understand the prototype chain

Properties assigned directly to an instance shadow prototype properties:

function Animal(name) {
    this.name = name;
}
Animal.prototype.speak = function() {
    return this.name + ' makes a sound';
};

const dog = new Animal('Rex');
dog.speak = 'bark'; // Wrong — shadows prototype method

console.log(dog.speak()); // TypeError: dog.speak is not a function

Right — remove the shadowing or use a different property name:

function Animal(name) {
    this.name = name;
}
Animal.prototype.speak = function() {
    return this.name + ' makes a sound';
};

const dog = new Animal('Rex');
console.log(dog.speak()); // Rex makes a sound

Step 2: Check own vs inherited properties

function Parent() {
    this.ownProp = 'owned';
}
Parent.prototype.sharedProp = 'shared';

const child = new Parent();

console.log(child.ownProp);     // owned
console.log(child.sharedProp);  // shared
console.log(child.hasOwnProperty('ownProp'));    // true
console.log(child.hasOwnProperty('sharedProp')); // false

// Wrong — iterating inherited properties
for (let key in child) {
    console.log(key); // ownProp, sharedProp (includes prototype)
}

// Right — filter with hasOwnProperty
for (let key in child) {
    if (child.hasOwnProperty(key)) {
        console.log(key); // only ownProp
    }
}

Step 3: Use Object.create for clean delegation

const animalMethods = {
    speak() {
        return this.name + ' speaks';
    }
};

// Wrong — direct mutation
const cat = { name: 'Whiskers' };
cat.__proto__ = animalMethods;

// Right — use Object.create
const cat = Object.create(animalMethods);
cat.name = 'Whiskers';
console.log(cat.speak()); // Whiskers speaks

Step 4: Fix constructor reference after prototype reassignment

function Car(model) {
    this.model = model;
}
Car.prototype = {
    start() {
        return this.model + ' started';
    }
};
// Wrong — constructor is now Object, not Car
const car = new Car('Sedan');
console.log(car.constructor === Car); // false

// Right — restore constructor
Car.prototype = {
    constructor: Car,
    start() {
        return this.model + ' started';
    }
};
const car = new Car('Sedan');
console.log(car.constructor === Car); // true

Prevention

  • Use hasOwnProperty when iterating object keys in for...in loops
  • Avoid assigning properties that shadow prototype methods
  • Use Object.create for explicit prototype delegation
  • Always restore the constructor property after reassigning a prototype object
  • Prefer class syntax in modern JavaScript to avoid manual prototype management

Common Mistakes with prototype error

  1. Using head and tail instead of pattern matching, causing runtime errors on empty lists
  2. Forgetting that lazy evaluation defers computation until the value is forced, causing space leaks with unevaluated thunks
  3. Using return to exit a function early instead of wrapping a pure value in the monad

These mistakes appear frequently in real-world JS code. DodaTech's contributors have identified these patterns through analysis of open-source projects and production systems.

Practice Exercise

Write a pure function that safely divides two integers using Maybe, then test it with edge cases like division by zero and negative numbers.

This exercise reinforces the concepts covered in this guide. Try implementing it before checking online solutions.

FAQ

### Why does `hasOwnProperty` return false for a property I can access?

The property exists on the prototype, not on the instance. hasOwnProperty only returns true for properties directly on the object. Access still works through the prototype chain.

How do I check if a property exists anywhere in the prototype chain?

Use the in operator: 'toString' in obj returns true even though toString is on Object.prototype. Combine with hasOwnProperty to distinguish own from inherited.

Does class syntax avoid prototype issues?

class syntax uses prototypes under the hood but manages constructor automatically and prevents common mistakes like prototype shadowing. It is the recommended approach for new code.

← Previous Cum sa folosesti Promise-uri in JavaScript Next → JavaScript Proxy Handler Trap Error Fix

Built by the developers of DodaTech

Doda Browser, DodaZIP & Durga Antivirus Pro

Home Browse Quick Fix