The 'new' Keyword in JavaScript

Introduction

Hey there! If you’ve read my previous blog on Understanding Object-Oriented Programming in JavaScript, you already know how powerful classes and objects are in JS. We saw how the new keyword creates instances from classes and got a quick peek at its internal magic.

But today, we’re going deeper. We’re pulling back the curtain on the new keyword itself—especially when used with traditional constructor functions. No bluf, no repetition of OOP pillars or class syntax. Just a crystal-clear, step-by-step look at what new actually does internally, how it creates objects, and why it’s the glue that connects constructors to prototypes and instances.

---

What Does the new Keyword Actually Do?

At its core, new is a special operator that tells JavaScript:

“Hey, I want you to treat this function as a constructor and create a brand-new object instance for me from this function.”

Without new, calling a constructor function just runs it like a regular function (and this usually points to the global object or undefined in strict mode — not what we want). In the other cases like when the function is returning properties by using return keyword and no new keyword been used to create instances, then that will act as the factory methods.

With new, JavaScript performs a whole orchestrated dance behind the scenes. That’s what we’re about to break down.

---

Constructor Functions — The Blueprints

Before we see new in action, let’s quickly understand constructor functions. They are regular functions that, by convention, start with a capital letter, no need of return keyword and are designed to be called with new.

Here’s a super simple example:

function Person(name, age) {
  this.name = name;
  this.age = age;
}

That’s it. No class, no constructor keyword — just a plain old function that uses this to attach properties.

---

The Object Creation Process — Step by Step

This is the heart of the blog. Here’s exactly what happens when you write:

const ritam = new Person("Ritam", 22);

JavaScript executes these five steps (in order):

1. Creates a brand new empty object
   
   {} — let’s call it newObj.

2. Links the new object’s prototype
   
   Sets newObj.__proto__ (or more accurately, [[Prototype]]) to Person.prototype.
   
   This is the prototype linking we’ll explore more in a moment.

3. Binds this to the new object
   
   Inside the constructor function, this now refers to newObj.

4. Executes the constructor body
   
   The code inside Person() runs, attaching name and age value to newObj.

5. Returns the new object (automatically)
   
   No need to mention return explicitly, JavaScript returns newObj for you automatically and implicitly.

Result? ritam is now a fully-formed instance with its own properties, but it’s linked to the shared prototype.

Want to see it visually? Here’s the exact flow:

---

How new Links Prototypes (The Real Superpower)

This step #2 is what makes JavaScript’s inheritance work so efficiently.

After new runs, every instance has an internal [[Prototype]] link pointing to the constructor’s .prototype object.

Visualize it like this:

• Person.prototype = one shared object that holds methods (e.g., sayHello).
• Every instance created with new Person() has instance.__proto__ = Person.prototype.

So if you add a method:

Person.prototype.sayHello = function() {
  console.log(`Hi, I'm ${this.name}`);
};

…then ritam.sayHello() and priya.sayHello() both work, but the method exists in only one place in memory.

---

Instances Created from Constructors

Every time you use new, you get a unique instance:

const ritam = new Person("Ritam", 22);
const priya = new Person("Priya", 20);

console.log(ritam.name);     // "Ritam"
console.log(priya.age);      // 20
console.log(ritam.sayHello === priya.sayHello); // true → same function reference in memory!

Each instance has its own properties (name, age), but they share the same prototype methods. That’s the perfect balance of individuality and efficiency.

Remember! If it's an factory function then will have different copies, thus would be false in that case.

---

Wrapping It Up: Why This Matters

Understanding the new keyword isn’t just trivia — it’s the foundation of how JavaScript’s entire object system works under the hood. Once you internalize these five steps and the prototype linking mechanism, debugging prototype chains, fixing this binding issues, and even writing your own advanced patterns becomes second nature.

In my previous OOP blog, we saw the high-level picture with classes. Here, we went microscopic and saw the actual machinery that powers new and how it works under the hood. Together, these two posts give you the complete picture — from surface-level usage to deep internal workings.

So next time you type new, you won’t just be creating an object.

You’ll know exactly what JavaScript is doing for you.