Table of Contents
What does the new keyword do?
Constructor functions
The object creation process — step by step
How new links prototypes
Instances created from constructors
Summary & quick reference
JavaScript is an object-oriented language, but it does OOP in its own peculiar way. Before ES6 classes arrived, developers created "blueprint" objects using plain functions and a magic word: new. Even today, understanding new is essential because ES6 classes are just syntactic sugar over this same mechanism.
**
1. What does the**newkeyword do?
The new keyword is an operator that invokes a function in a special way. When you call a function with new, JavaScript doesn't just run the function — it does four distinct things behind the scenes automatically.
Definition
The new operator lets you use a regular function as a constructor — a factory that creates and returns new objects automatically, without you having to manually create or return anything.
Here's the simplest example to make this concrete:
function Greeting() {
this.message = "Hello, world!";
}
const greet = new Greeting();
console.log(greet.message); // "Hello, world!"
console.log(greet instanceof Greeting); // true
Without new, calling Greeting() would just run the function and this would refer to the global object (or be undefined in strict mode). With new, a fresh object is created and returned for you.
Notice we also get to use instanceof — that's the prototype link at work, which we'll explore in Section 4.
2. Constructor Functions
A constructor function is simply a regular JavaScript function designed to be called with new. By convention, constructor functions are named with a capital letter — this is not a language rule, just a strong community signal that says "call me with new".
// Constructor function — capital P is the convention
function Person(name, age) {
// 'this' refers to the new object being created
this.name = name;
this.age = age;
}
// Creating instances
const alice = new Person("Alice", 28);
const bob = new Person("Bob", 35);
console.log(alice.name); // "Alice"
console.log(bob.age); // 35
Each call to new Person(...) creates a completely separate object. alice and bob each have their own name and age — they don't share data.
Adding methods to the constructor
You can define methods directly inside the constructor body, but this is wasteful — a new copy of the function is created for every instance. The better approach is to add methods on the prototype (covered in Section 4).
/ ❌ Wasteful: new greet() function created per instance
function Person(name) {
this.name = name;
this.greet = function() { // new function object every time
console.log("Hi, I am " + this.name);
};
}
// ✅ Efficient: greet() lives on the prototype, shared by all instances
function Person(name) {
this.name = name;
}
Person.prototype.greet = function() {
console.log("Hi, I am " + this.name);
};
Common mistake
Calling a constructor without new is a silent bug. In non-strict mode, this becomes the global object and you accidentally pollute global scope. Always use new with constructors, or better yet, add 'use strict' at the top so JavaScript throws an error if you forget.
3. The Object Creation Process — Step by Step
When JavaScript executes new Person("Alice", 28), it performs exactly four steps internally. Understanding this sequence makes everything else about new click into place.
| 1 | A new empty object is created.
JavaScript creates a blank object — equivalent to {}. This is the object that will become your instance. |
| --- | --- |
| 2 | The object's prototype is linked.
The new object's internal [[Prototype]] slot is set to Person.prototype. This is what makes the prototype chain work — and how instanceof later knows what type this object is. |
| 3 | The constructor function runs with this bound to the new object.
The body of Person executes. Every time you write this.name = name, you're adding a property directly onto that fresh new object. |
| 4 | The new object is returned (automatically).
If the constructor doesn't explicitly return an object, JavaScript returns this — the newly created instance. If it does return a plain value or nothing, that return is ignored and the object is still returned. |
You can visualise what JavaScript is doing under the hood like this:
function simulateNew(Constructor, ...args) {
// Step 1: Create an empty object
const obj = {};
// Step 2: Link prototype
Object.setPrototypeOf(obj, Constructor.prototype);
// Step 3: Run the constructor with 'this' = obj
const result = Constructor.apply(obj, args);
// Step 4: Return the object (or the explicit return value if it's an object)
return result instanceof Object ? result : obj;
}
// This behaves identically to: new Person("Alice", 28)
const alice = simulateNew(Person, "Alice", 28);
This simulation is not just academic — it reveals exactly why new is powerful. The linkage in Step 2 is what enables inheritance through the prototype chain, and the auto-return in Step 4 is why your constructor doesn't need a return statement.S
4. HownewLinks Prototypes
Every function in JavaScript automatically gets a prototype property — an object. When you use new, the instance's internal prototype ([[Prototype]], accessible as __proto__) is pointed at this prototype object.
This creates the prototype chain: when you look up a property on an object and it isn't found directly on that object, JavaScript travels up the chain to the prototype looking for it. This is how all instances can share methods without each having their own copy.
function Animal(name) {
this.name = name; // own property — stored on the instance
}
// speak() lives on Animal.prototype — shared by all instances
Animal.prototype.speak = function() {
console.log(this.name + " makes a noise.");
};
const dog = new Animal("Dog");
const cat = new Animal("Cat");
dog.speak(); // "Dog makes a noise."
cat.speak(); // "Cat makes a noise."
// Verify: dog's prototype IS Animal.prototype
console.log(Object.getPrototypeOf(dog) === Animal.prototype); // true
// speak is NOT on the instance — it's on the prototype
console.log(dog.hasOwnProperty("name")); // true ← own property
console.log(dog.hasOwnProperty("speak")); // false ← inherited
This is memory-efficient and powerful: add a method to Animal.prototype after creating instances and they all immediately have access to it. The instances don't store the method — they simply look it up through the chain.
Key insightThe prototype chain is a live lookup. Instances don't copy methods — they reference the prototype. Mutating Animal.prototype is instantly visible in all existing and future instances.
5. Instances Created from Constructors
An instance is an object created by a constructor function via new. Each instance is independent — it has its own copy of properties assigned in the constructor body (own properties) — but all instances share methods defined on the prototype.
function Car(make, model, year) {
// Own properties — unique per instance
this.make = make;
this.model = model;
this.year = year;
this.speed = 0;
}
// Shared methods on the prototype
Car.prototype.accelerate = function(amount) {
this.speed += amount;
console.log(this.make + " is going " + this.speed + " km/h");
};
Car.prototype.describe = function() {
return this.year + " " + this.make + " " + this.model;
};
// Create instances
const tesla = new Car("Tesla", "Model S", 2024);
const honda = new Car("Honda", "Civic", 2022);
// Each instance has its own data
tesla.accelerate(100); // "Tesla is going 100 km/h"
honda.accelerate(60); // "Honda is going 60 km/h"
// But they share the same method (same reference in memory)
console.log(tesla.accelerate === honda.accelerate); // true
// instanceof checks the prototype chain
console.log(tesla instanceof Car); // true
console.log(tesla instanceof Object); // true (all objects inherit from Object)
The constructor property
By default, every prototype object has a constructor property that points back to the function itself. This lets instances know "who made me":
console.log(tesla.constructor); // [Function: Car]
console.log(tesla.constructor === Car); // true
// You can even create a sibling instance this way:
const twin = new tesla.constructor("Tesla", "Model 3", 2025);
console.log(twin.describe()); // "2025 Tesla Model 3"
ES6 classes — the same thing, nicer syntax
ES6 class syntax is just cleaner notation for everything we've covered. Under the hood it still uses constructor functions and prototype linking:
// ES6 class — identical to the Car constructor above
class Car {
constructor(make, model, year) {
this.make = make;
this.model = model;
this.year = year;
this.speed = 0;
}
// Methods go on Car.prototype automatically
accelerate(amount) {
this.speed += amount;
console.log(this.make + " is going " + this.speed + " km/h");
}
describe() {
return this.year + " " + this.make + " " + this.model;
}
}
// Usage is identical — new still works the same way
const tesla = new Car("Tesla", "Model S", 2024);
console.log(typeof Car); // "function" — classes are still functions!
Takeaway
Classes don't replace constructor functions — they are constructor functions. When you understand new at the level of this article, ES6 classes become completely transparent. No magic, just nicer syntax.
6. Summary & Quick Reference
Here's everything you need to remember about new in one table:
| Concept |
What it means |
Example |
new keyword |
Invokes a function as a constructor; runs the 4-step creation process |
new Person("Alice") |
| Constructor function |
A regular function designed to be called with new; capitalized by convention |
function Person(name) { this.name = name; } |
| Own property |
A property assigned via this.x = ... inside the constructor; unique to each instance |
this.name = name |
| Prototype method |
A method on Constructor.prototype; shared across all instances |
Person.prototype.greet = function(){...} |
[[Prototype]] link |
The internal chain connecting an instance to its constructor's prototype |
Object.getPrototypeOf(alice) === Person.prototype |
instanceof |
Checks if an object's prototype chain includes the constructor's prototype |
alice instanceof Person // true |
| Instance |
The object returned by new Constructor() |
const alice = new Person("Alice") |
ES6 class |
Sugar over constructor functions — still uses new and prototypes |
class Person { constructor(name){...} } |
"In JavaScript, objects don't inherit from classes — they inherit from other objects. The new keyword is just a convenient way to set up that relationship."
Once you internalize the four steps of new and the idea of a shared prototype, you have the mental model for everything JavaScript OOP builds on — inheritance chains, class extends, super(), and Object.create(). They're all variations on this same foundation.
