Techie BabajiLearn to Code. Build Real Skills.
JavaScript · Advanced

Prototypes

Behind every JavaScript object is a hidden link to another object — its prototype. This is how objects share behaviour, and what classes are built on.

Advanced 5 min Lesson 40 of 49 Runnable examples
Before you start:Classes
0/49 in JavaScript
On this page · 5 min · Advanced

On this page

  1. Learning objectives
  2. Explanation
  3. Code example
  4. Step by step
  5. Real-world use
  6. Common mistakes
  7. Best practices
  8. Remember this
  9. Practice exercise
  10. Mini quiz
  11. Related topics
  12. My notes
Reading time
5 min
Difficulty
Advanced
Updated
Oct 27, 2026

Related tutorials

Interview questions

Learning objectives#

  • Explain the prototype chain
  • Create objects with Object.create
  • Share methods through prototype
  • Connect classes to prototypes

Explanation#

When you read obj.prop and obj does not have it, JavaScript looks at obj’s prototype, then that object’s prototype, and so on. This is the prototype chain.

Object.create(proto) makes a new object whose prototype is proto.

Before classes, constructor functions put shared methods on Function.prototype so every instance could use one copy.

class syntax does exactly this under the hood — methods live on ClassName.prototype.

Code example: Following the chain#

JavaScriptFollowing the chain Runnable
const animal = {
  eats: true,
  describe() { return `${this.name} eats: ${this.eats}`; },
};


const dog = Object.create(animal);
dog.name = 'Bruno';
console.log(dog.describe());
console.log(Object.getPrototypeOf(dog) === animal, dog.hasOwnProperty('eats'));


function Person(name) { this.name = name; }
Person.prototype.hello = function () { return 'Hi, ' + this.name; };
const p = new Person('Asha');
console.log(p.hello(), p.hello === new Person('Ravi').hello);


class Cat {}
console.log(typeof Cat, Object.getPrototypeOf(new Cat()) === Cat.prototype);
Expected output
Bruno eats: true
true false
Hi, Asha true
function true
Opens this example in the full playground

Step-by-step explanation#

  1. dog has no describe or eats, so JavaScript finds them on animal.
  2. eats is inherited, not owned, so hasOwnProperty returns false.
  3. All Person instances share one hello function via the prototype.
  4. A class is really a function, and instances link to Class.prototype.

Real-world use case#

Understanding prototypes explains how array methods like map are available on every array (they live on Array.prototype) and helps when debugging inheritance.

Common mistakes#

Modifying built-in prototypes

Adding methods to Array.prototype can clash with future JavaScript features and other libraries. Don’t.

Defining methods inside constructors

this.hello = function… creates a new copy per object. Put shared methods on the prototype (or in a class).

Best practices#

  • Use class syntax for new code
  • Never modify built-in prototypes
  • Use Object.hasOwn(obj, key) to check own properties
  • Use Object.create(null) for pure dictionaries

Remember this#

Missing property? JavaScript asks the prototype, then its prototype… until null.

Classes are prototypes wearing nicer clothes.

Shared methods live on the prototype — one copy for everyone.

Practice exercise#

Your task: Create vehicle = { wheels: 4 } and car = Object.create(vehicle) with brand "Tata". Log car.wheels and whether wheels is car’s own property.

Show solution
JavaScript Runnable
const vehicle = { wheels: 4 };
const car = Object.create(vehicle);
car.brand = 'Tata';
console.log(car.wheels, Object.hasOwn(car, 'wheels')); // 4 false
Opens this example in the full playground

Mini quiz#

Prototypes quizMultiple choice Question 1 of 1

Where does [1, 2].map come from?

Score so far: 0/0

Want more? Practise all JavaScript MCQs · JavaScript interview questions

My notes#

Saved in this browser.

Progress is saved in this browser. Sign in to sync.