# The Truth About new in JavaScript (Stop Memorizing, Start Understanding)

Alright… today we are going to talk about something which most beginners **memorise… but never actually understand**.

And that is 👉 **the** `new` **keyword in JavaScript**

You might have seen code like this:

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

const user1 = new User("Barun");
```

And someone told you:

> "Use `new` to create objects"

Bas… khatam… story over.

But **how does it actually work?** Aree bhai… JavaScript koi magic show thodi hai 😄

Let’s break this properly.

* * *

# So what does `new` actually do?

Technically (MDN type definition incoming 😅):

> The `new` keyword creates an instance of an object from a constructor function.

Again… too technical.

* * *

## In Simple Words

👉 `new` is like a **factory machine**

You give it a constructor… It gives you a ready-made object.

Just like:

*   You go to Domino’s
    
*   You order pizza
    
*   You don’t build it… they build it
    

Same thing here.

* * *

# Step by Step: What happens behind the scenes?

Whenever you write:

```js
const user1 = new User("Barun");
```

JavaScript secretly does 4 steps.

And THIS is where real understanding starts.

* * *

## Step 1: Empty object is created

```js
const obj = {};
```

JavaScript creates a blank object.

* * *

## Step 2: `this` points to that object

Inside constructor:

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

👉 `this` now refers to that empty object

So internally:

```js
obj.name = "Barun";
```

* * *

## Step 3: Prototype is linked

This is where most people cry 😭

```js
obj.__proto__ = User.prototype;
```

Don’t worry… we will understand this slowly.

* * *

## Step 4: Object is returned

```js
return obj;
```

And finally:

```js
const user1 = obj;
```

* * *

# Final Visual Flow (IMPORTANT)

Constructor → Object Creation → Return

```plaintext
User("Barun")
     ↓
[ empty object ]
     ↓
this → object
     ↓
prototype linked
     ↓
return object
```

* * *

# Let’s build a real example

Because theory se zyada **real life samajh aata hai**

* * *

## Example: Student System

```js
function Student(name, marks) {
  this.name = name;
  this.marks = marks;

  this.print = function () {
    console.log(`${this.name} scored ${this.marks}`);
  };
}

const s1 = new Student("Ravi", 80);
const s2 = new Student("Ankit", 60);

s1.print();
s2.print();
```

* * *

## Real life understanding

Think like this:

*   Constructor = **Blueprint**
    
*   `new` = **Machine**
    
*   Object = **Final product**
    

Like:

*   Blueprint → "Make a chair"
    
*   Machine → Factory
    
*   Output → Chair
    

* * *

# But wait… what is a Constructor?

Aree haan… yeh toh define hi nahi kiya 😅

* * *

## Constructor Function

👉 A normal function… 👉 But used to create objects

Convention:

*   First letter capital (not mandatory but important)
    

```js
function Car(brand, price) {
  this.brand = brand;
  this.price = price;
}
```

* * *

## Creating objects

```js
const car1 = new Car("BMW", 5000000);
const car2 = new Car("Audi", 4000000);
```

Now tell me…

Did we manually create objects?

NO ❌

`new` did everything for us.

* * *

# Now comes the REAL hero: Prototype

Most people skip this… and regret later.

* * *

## Why prototypes?

Look at this:

```js
function Student(name) {
  this.name = name;

  this.sayHi = function () {
    console.log("Hello");
  };
}
```

If you create 100 students…

👉 100 copies of `sayHi` will be created 😵

Memory waste.

* * *

## Solution: Prototype

```js
function Student(name) {
  this.name = name;
}

Student.prototype.sayHi = function () {
  console.log("Hello");
};
```

Now:

*   Only ONE copy of `sayHi`
    
*   All objects share it
    

* * *

## How linking works?

When you do:

```js
const s1 = new Student("Barun");
```

Behind the scenes:

```js
s1.__proto__ === Student.prototype // true
```

* * *

# Visual Understanding of Prototype Linking

```plaintext
Student Constructor
        ↓
Student.prototype  ---> sayHi()
        ↑
        |
      s1 object
```

👉 If `s1` doesn’t find something… 👉 It looks into prototype

Like:

> "Mere paas nahi hai… prototype bhai se puchta hu"

* * *

# Important Observation (VERY IMPORTANT)

```js
console.log(s1.sayHi());
```

Even though:

❌ `sayHi` is not inside `s1` ✅ Still works

Because of prototype chain.

* * *

# Constructor vs Instance (Clear this once and for all)

| Concept | Meaning |
| --- | --- |
| Constructor | Blueprint |
| Instance | Actual object |

Example:

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

const u1 = new User("Barun");
```

*   `User` → constructor
    
*   `u1` → instance
    

* * *

# Common Beginner Mistake 😭

```js
const user = User("Barun"); // ❌ forgot new
```

What happens?

👉 `this` becomes `window` (or undefined in strict mode)

👉 Bugs start

* * *

## Always remember

👉 If constructor → ALWAYS use `new`

* * *

# Mental Model (Golden Rule)

Whenever you see `new` think:

👉 "Object ban raha hai internally"

Not:

👉 "Function call ho raha hai"

* * *

# Quick Recap

*   `new` creates object
    
*   Sets `this`
    
*   Links prototype
    
*   Returns object
    

* * *

# Homework (haan bhai… bhagna mat 😏)

### Q1: Create a constructor `Book`

*   title
    
*   author
    

Add a method:

```js
printDetails()
```

* * *

### Q2: Move method to prototype

* * *

### Q3: Check

```js
book1.__proto__ === Book.prototype
```

* * *

# Final Thought

Most people:

👉 Learn `new` in 5 minutes 👉 Struggle with it for 2 years

Because they never understood **what happens behind the scenes**

Now you know:

👉 JavaScript is not magic 👉 It’s just hidden steps

* * *

Agar yeh samajh gaya…

👉 Classes (ES6) will feel like **child’s play**

And trust me…

👉 80% devs skip this depth

Don’t be that dev. 🚀
