# The new Keyword in JavaScript

In JavaScript, creating objects is extremely common.

You create objects for:

*   Users
    
*   Products
    
*   Orders
    
*   Cars
    
*   Game characters
    
*   Tasks
    

Sometimes you only need one object.

But what if you need:

*   Hundreds of similar objects?
    

Instead of manually writing each object again and again, JavaScript provides:

*   Constructor functions
    
*   The `new` keyword
    

The `new` keyword helps create objects automatically using a reusable blueprint.

In this blog, you’ll learn:

*   What the `new` keyword does
    
*   Constructor functions
    
*   Step-by-step object creation
    
*   Prototype linking
    
*   Instances created from constructors
    

* * *

# The Problem Without `new`

Imagine manually creating multiple user objects.

```javascript
const user1 = {
  name: "Alex",
  age: 22
};

const user2 = {
  name: "John",
  age: 25
};
```

This works…

But repeating the same structure again and again becomes inefficient.

We need a reusable way to create objects.

* * *

# Constructor Functions

A constructor function acts like:

> A blueprint for creating objects.

* * *

# Simple Constructor Example

```javascript
function User(name, age) {
  this.name = name;
  this.age = age;
}
```

This function describes:

*   How user objects should be created
    

* * *

# Creating Objects with `new`

```javascript
const user1 = new User("Alex", 22);

console.log(user1);
```

## Output

```javascript
{
  name: "Alex",
  age: 22
}
```

* * *

# What Does the `new` Keyword Do?

When you use:

```javascript
new User()
```

JavaScript performs several hidden steps automatically.

This is the core idea to understand.

* * *

# Step-by-Step Object Creation Process

When `new` is used:

## Step 1: Create Empty Object

JavaScript secretly creates:

```javascript
{}
```

* * *

# Step 2: Link Prototype

The object is linked to:

*   The constructor’s prototype
    

* * *

# Step 3: Bind `this`

Inside the constructor:

```javascript
this
```

now points to the new object.

* * *

# Step 4: Add Properties

```javascript
this.name = name;
this.age = age;
```

Properties are added to the object.

* * *

# Step 5: Return the Object

The completed object is returned automatically.

* * *

# Constructor → Instance Creation Flow

```text
Constructor Function
        ↓
      new
        ↓
Create Empty Object
        ↓
Add Properties
        ↓
Return Instance
```

* * *

# Understanding `this` with `new`

Inside constructor functions:

```javascript
this
```

refers to:

*   The newly created object
    

* * *

# Example

```javascript
function Car(brand) {
  this.brand = brand;
}

const car1 = new Car("Toyota");

console.log(car1);
```

## Output

```javascript
{
  brand: "Toyota"
}
```

* * *

# Why Constructor Functions Start with Capital Letters

By convention:

*   Constructor function names start with capital letters
    

Example:

```javascript
function User() {}
function Car() {}
function Product() {}
```

This helps developers recognize:

*   “This function should be used with `new`.”
    

* * *

# Instances Created from Constructors

Objects created using constructors are called:

> Instances

* * *

# Example

```javascript
const user1 = new User("Alex", 22);
const user2 = new User("John", 25);
```

Both:

*   `user1`
    
*   `user2`
    

are instances of `User`.

* * *

# Visual Understanding

```text
User Constructor
      │
      ├── user1
      ├── user2
      └── user3
```

One constructor can create many objects.

* * *

# Adding Methods to Constructor Objects

You can also add methods.

* * *

# Example

```javascript
function User(name) {
  this.name = name;

  this.sayHello = function() {
    console.log(`Hello ${this.name}`);
  };
}

const user1 = new User("Alex");

user1.sayHello();
```

## Output

```text
Hello Alex
```

* * *

# How `new` Links Prototypes

This is one of the most important concepts in JavaScript.

Every constructor function has:

*   A prototype object
    

Objects created with `new` automatically connect to it.

* * *

# Example

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

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

const user1 = new User("Alex");

user1.sayHello();
```

* * *

# What Happened Here?

`sayHello()` is not directly inside `user1`.

Instead:

*   JavaScript looks inside the prototype
    

This saves memory because:

*   All instances share the same method
    

* * *

# Prototype Linking Visual

```text
user1
  │
  ↓
User.prototype
  │
  └── sayHello()
```

* * *

# Why Prototypes Matter

Without prototypes:

*   Every object would create duplicate methods
    

That wastes memory.

Prototypes allow:

*   Shared behavior
    

* * *

# Real-Life Analogy

Think of constructors like:

*   Cookie cutters
    

Each cookie:

*   Is a separate object
    

But all cookies:

*   Come from the same mold
    

* * *

# Simple Constructor Example

```javascript
function Product(name, price) {
  this.name = name;
  this.price = price;
}

const phone = new Product("iPhone", 80000);

console.log(phone);
```

## Output

```javascript
{
  name: "iPhone",
  price: 80000
}
```

* * *

# Common Beginner Mistake: Forgetting `new`

This is extremely common.

* * *

# Wrong

```javascript
const user = User("Alex", 22);
```

Without `new`:

*   JavaScript does not create a new object properly
    

This often causes bugs.

* * *

# Correct

```javascript
const user = new User("Alex", 22);
```

* * *

# How to Identify Constructor Functions

Usually:

*   Capitalized names
    
*   Used with `new`
    

Example:

```javascript
new Date()
new Array()
new User()
```

* * *

# Built-In JavaScript Constructors

JavaScript itself uses constructors internally.

Examples:

```javascript
new Date()
new Array()
new Object()
```

You’ve probably already used `new` before without realizing it.

* * *

# Modern JavaScript and Classes

Modern JavaScript introduced:

*   Classes
    

But classes internally still use:

*   Constructor logic
    
*   Prototypes
    
*   `new`
    

So understanding `new` is still extremely important.

* * *

# Mental Model for Beginners

The easiest way to think about `new`:

```text
new = “Create a new object using this blueprint.”
```

That’s the core idea.

* * *

# Complete Object Creation Flow

```text
Constructor Function
       ↓
new keyword
       ↓
Create empty object
       ↓
Attach properties
       ↓
Link prototype
       ↓
Return instance
```

* * *

# Practice Exercises

## Exercise 1

Create a constructor:

```javascript
function Animal(name) {
  this.name = name;
}
```

Create two instances.

* * *

# Exercise 2

Add a method using prototype:

```javascript
Animal.prototype.sound = function() {
  console.log("Animal sound");
};
```

* * *

# Exercise 3

Try creating objects both:

*   With `new`
    
*   Without `new`
    

Observe the difference.

* * *

# Final Thoughts

The `new` keyword is one of the most important object creation concepts in JavaScript.

The key ideas are:

| Concept | Meaning |
| --- | --- |
| Constructor Function | Blueprint for objects |
| `new` Keyword | Creates object instances |
| Instance | Object created from constructor |
| Prototype Link | Shared behavior between instances |

Even though modern JavaScript uses classes heavily, the underlying concepts still depend on:

*   Constructors
    
*   Prototypes
    
*   The `new` keyword
    

Understanding these concepts gives you a much deeper understanding of how JavaScript actually works behind the scenes.