Master JavaScript OOP Basics: Objects, Constructors, Prototypes & Inheritance

1. Object Definition

In ECMAScript‑262 an object is defined as “an unordered collection of properties, whose values can be primitive values, objects, or functions.” In JavaScript this simply means an object is a set of key‑value pairs, where the value may be a primitive, another object, or a function.

2. Creating Objects

Objects can be created using the new operator:

Or by using an object literal:

Methods can be added to a literal object as shown:

3. Accessing Properties and Methods

Given a simple object, its properties can be accessed using dot notation or bracket notation:

If the property name is stored in a variable, bracket notation must be used:

This technique is crucial when handling complex data structures.

4. Factory Pattern

When many similar objects are needed, writing repetitive code becomes cumbersome. The factory pattern provides a template (a “factory”) that can generate multiple objects with shared structure.

Factory functions simplify object creation, but they do not identify an object's type. The instanceof operator can be used for that purpose:

5. Constructor Functions

The new keyword turns a regular function into a constructor. It creates an intermediate object, sets its prototype, binds this to the new object, and finally returns the instance.

Internally, the following transformation occurs:

var p1 = New(Person, 'tom', 20); is equivalent to var p1 = new Person('tom', 20); .

6. Prototype

Every function has a prototype property that points to an object. Instances created with new have an internal __proto__ that references this prototype, allowing shared methods.

When both the constructor and its prototype define the same method, the instance’s own method takes precedence.

The in operator can check whether a property exists on an object or its prototype chain:

7. Prototype Chain

All objects can serve as prototypes, forming a chain that ends at Object.prototype. Functions inherit from Function.prototype, which in turn inherits from Object.prototype, creating a prototype chain that enables property lookup.

8. Inheritance

Combining constructors and prototypes allows inheritance. A child constructor can call the parent constructor with Parent.call(this, …) to inherit instance properties, while setting the child’s prototype to a new instance of the parent links shared methods.

9. Summary

The article covered the basics of JavaScript object‑oriented programming: object creation, factory pattern, constructor functions, prototypes, prototype chains, and inheritance. Understanding these concepts helps developers organize code efficiently, choose the right pattern for a given scenario, and avoid common pitfalls when dealing with objects and their relationships.