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.