# Inside JavaScript's new: How Objects Are Really Created

Understanding the new Keyword in JavaScript (With Simple Examples)

When you first learn JavaScript, creating objects feels straightforward. But things get interesting when you see this:

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

const user = new Person("Vaibhav");

That mysterious new keyword does a lot behind the scenes.

In this article, we’ll break it down step by step so you actually understand what’s happening — not just memorize syntax.

🚀 What Does the new Keyword Do?

The new keyword is used to create an instance of a constructor function.

In simple terms:

It creates a brand new object and connects it to a function.

🧱 Constructor Functions

A constructor function is just a normal function used to create objects.

By convention:

It starts with a capital letter It uses this to assign properties function Car(brand, year) { this.brand = brand; this.year = year; }

Now, creating objects becomes reusable:

const car1 = new Car("Toyota", 2022); const car2 = new Car("Honda", 2021);

⚙️ What Happens When You Use new?

When you run:

const car1 = new Car("Toyota", 2022);

JavaScript internally performs 4 steps:

1.  🆕 Create an Empty Object const obj = {};
    
2.  🔗 Link Object to Prototype obj.**proto** = Car.prototype;
    

This allows the object to access shared methods.

3.  📌 Bind this to the Object Car.call(obj, "Toyota", 2022);
    

Inside the constructor:

this.brand = "Toyota"; this.year = 2022;

4.  📦 Return the Object return obj;
    

✅ Final Result { brand: "Toyota", year: 2022 }

🧠 Visual Flow (Constructor → Instance)

new Car("Toyota", 2022) 
 │
 ▼ 
\[Empty Object Created\] 
│ 
▼ 
Linked to Car.prototype 
│ 
▼
 Constructor runs (this = object) 
│ 
▼ 
Object returned → car1

🔗 How new Links Prototypes

Every function in JavaScript has a prototype property.

Car.prototype.drive = function() { console.log("Driving..."); };

Now all instances share this method:

car1.drive(); // Driving... car2.drive(); // Driving...

🧠 Prototype Linking Visualization

car1 ───► Car.prototype ───► Object.prototype ───► null

This is called the prototype chain.

🧩 Instances Created from Constructors

Each time you use new:

const car1 = new Car("Toyota", 2022); const car2 = new Car("Honda", 2021);

You get:

Separate objects (independent data) Shared methods (via prototype) 🧠 Key Insight car1 === car2 // false car1.drive === car2.drive // true

👉 Data is unique, behavior is shared.

⚠️ What If You Forget new? const car1 = Car("Toyota", 2022);

Now:

No object is created this may point to global object (or be undefined in strict mode)

👉 This leads to bugs.

🛠️ Safer Pattern

You can guard against missing new:

function Car(brand, year) { if (!(this instanceof Car)) { return new Car(brand, year); } this.brand = brand; this.year = year; }

💡 Real-World Mental Model

Think of:

Constructor → Blueprint new → Factory machine Instance → Final product

🎯 Summary new creates a new object It links the object to the constructor’s prototype It binds this to the new object It returns the object automatically Enables reusable object creation patterns

📌 Final Thought

Understanding new is key to mastering:

Prototypes Classes (which are just syntactic sugar over this) JavaScript’s object system