Skip to main content

Command Palette

Search for a command to run...

The new Keyword in JavaScript

Published
4 min read
The new Keyword in JavaScript

At some point in JavaScript, you’ll come across code like this:

const user = new User("Alex", 25);

That small word new is doing a lot more than it seems.

Understanding what new actually does will give you a much deeper understanding of how objects are created in JavaScript. It also connects directly to concepts like constructors, prototypes, and object-oriented programming.

Let’s break it down step by step in a simple way.


What the new Keyword Does

The new keyword is used to create a new object from a constructor function.

It does four important things behind the scenes:

  1. Creates a new empty object

  2. Links that object to a prototype

  3. Calls the constructor function

  4. Returns the newly created object

You don’t see these steps directly, but they happen every time you use new.


Constructor Functions

Before classes became common, JavaScript used constructor functions to create objects.

A constructor function is just a normal function, but by convention, its name starts with a capital letter.

Example:

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

This function doesn’t return anything explicitly. Instead, it assigns values to this.


Creating Objects Using new

Now let’s use the constructor.

const person1 = new Person("Alice", 25);

This single line creates a new object.

The result looks like this:

{
  name: "Alice",
  age: 25
}

But how did it happen? Let’s break it down.


Object Creation Process (Step by Step)

When you write:

const person1 = new Person("Alice", 25);

JavaScript internally does something like this:

Step 1: Create an empty object

let obj = {};

obj.__proto__ = Person.prototype;

This allows the object to access shared methods.


Step 3: Call the constructor function

Person.call(obj, "Alice", 25);

Inside the function:

this.name = "Alice";
this.age = 25;

So now obj becomes:

{
  name: "Alice",
  age: 25
}

Step 4: Return the object

return obj;

This is what gets stored in person1.


How new Links Prototypes

Every function in JavaScript has a special property called prototype.

When you create an object using new, the object is linked to that prototype.

Example:

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

Person.prototype.greet = function () {
  console.log("Hello, my name is " + this.name);
};

const person1 = new Person("Alice");

person1.greet();

Output:

Hello, my name is Alice

Even though greet is not inside the object itself, it works because:

person1 → Person.prototype → greet()

This is called prototype chaining.


Instances Created from Constructors

When you use new, the object created is called an instance of the constructor.

Example:

const person1 = new Person("Alice");
const person2 = new Person("Bob");

Here:

  • person1 is an instance of Person

  • person2 is another instance of Person

Both objects share the same structure but hold different values.


Relationship Between Constructor and Object

You can think of the relationship like this:

  • Constructor → blueprint

  • Instance → actual object

Example:

function Car(brand, color) {
  this.brand = brand;
  this.color = color;
}

const car1 = new Car("Toyota", "Red");
const car2 = new Car("BMW", "Black");

Both car1 and car2:

  • Are created from the same constructor

  • Have the same properties

  • Store different values


Why the new Keyword Matters

Without new, the constructor function behaves like a normal function.

Example:

const person = Person("Alice", 25);

This will not create a proper object and can lead to unexpected results.

Using new ensures:

  • A new object is created

  • this refers to that object

  • The object is returned automatically


A Simple Mental Model

Whenever you see:

new Something()

Think:

“Create a new object based on this blueprint and return it.”


Final Thoughts

The new keyword is a core part of how JavaScript creates objects. While it may look simple, it performs multiple steps behind the scenes—creating an object, linking prototypes, and executing the constructor.

Understanding how new works gives you clarity on how objects, constructors, and prototypes are connected. This knowledge becomes especially useful as you move deeper into JavaScript and start working with classes, inheritance, and more advanced patterns.

For now, focus on the basics: how objects are created, how constructors work, and how new ties everything together.