The new Keyword in JavaScript

Hello readers,

Welcome to another blog in this JS series. In the previous blog, we explored String Polyfills and common interview methods—basically, how JavaScript works under the hood.

Today, we’re diving into something that looks simple but confuses a lot of developers: the new keyword

If you've ever written this:

const user = new User("Abhishek");

…and just moved on without thinking much — this blog is for you.

Because under the hood, a LOT is happening.

What does the new keyword actually do?

Whenever we use new keyword, then it does these 4 things:

1. Create a new object

2. Link it to a constructor function

3. Set up prototype inheritance

4. Return that object

But this is just a surface-level. Let's break it properly in depth.

Constructor functions

Before understanding new, you need to understand constructor functions.

function User(name) {
  this.name = name;
}

//now when we do:
const user1 = new User("abhishek"); 

This function behaves differently from a normal function because of new.

It is exactly the same as this code.

class User{
    constructor(name){
      this.name = name;
    }
}
const user1 = new User("abhishek")

This is the modern JS code using classes.

What happens when we use new?

Here is the step-by-step breakdown of what happens when we use new a keyword.

When we do this:

const user1 = new User("Abhishek");

1. Create an empty object

const obj = {};

2. Link prototype

obj.__proto__ = User.prototype;

Because of this step, methods get shared.

3. Bind this to this new object

User.call(obj, "Abhishek");

So inside the constructor:

this.name = "Abhishek";

4. Return the object

return obj;

Now, finally, the object is returned unless the constructor explicitly returns another object.

How new links prototypes

User.prototype.greet = function () {
  console.log(`Hello, ${this.name}`);
};

user1.greet(); //Hello, Abhishek

How this user1.greet() is working?

This is working because of the prototype chain, because in the second step of newWe do prototype linking, so

user1.__proto__ === User.prototype

And that's why user1 is able to find the greet in User prototype chain.

Instances created from constructors

const user1 = new User("Abhishek");
const user2 = new User("Agam");

Here, use1 and user2 are two instances created from a single constructor function. Here are the properties of these instances:

• Both have different data

• But these two share the same methods via prototype

• instanceof Operator: You can use the instanceof operator to verify if an object was created by a specific constructor.

To verify, you can do this:

console.log(user1 instanceof User); // true
console.log(user1.__proto__ === User.prototype); // true

What if you forget new?

const user1 = User("Abhishek"); //this is classic bug

In this case:

• this points to the global object (or undefined in strict mode)

• No object is created

Result: unexpected behavior

Some confusing part

You have also noticed that sometimes you can use Array() with new or without new. Also, the same happens with other built-in methods too.

So, let's understand this in a visual way.

This is for Array() only, but the same thing happens with other built-in methods too, like Object(), Number(), String(), etc.

TL;DR

If this is too long to read, then I have a visual diagram that summarizes this blog.

The new keyword is not just syntax — it’s a core concept that connects objects, prototypes, and inheritance in JavaScript.

Once you understand this, a lot of confusing behavior in JS suddenly makes sense.

In the next blog, we’ll move into something equally important:

Modules in JavaScript (import/export) — how modern JS organizes code.

Till then…

Stay consistent and keep grinding…

Peace ✌️