JavaScript objects are one of the most important building blocks in modern JavaScript. They allow developers to organize related data together in a structured way. Many real-world entities such as users, products, or students are represented using objects.

Understanding objects is essential before moving to advanced topics like APIs, databases, and frameworks.

---

What Are JavaScript Objects?

A JavaScript object is a collection of key–value pairs.

Each key represents a property, and each property stores a value.

Example:

const person = {
  name: "Sahil",
  age: 22,
  city: "Mandi"
};

Here:

Key	Value
name	"Sahil"
age	22
city	"Mandi"

This structure helps group related information together.

---

Visual Structure of an Object

key     value
----------------
name →  "Sahil"
age  →  22
city →  "Mandi"

In this structure:

• name, age, city are keys

• "Sahil", 22, "Mandi" are values

---

Why Objects Are Needed

Without objects, data would be stored separately:

const name = "Sahil";
const age = 22;
const city = "Mandi";

When applications grow, managing separate variables becomes difficult.

Objects solve this problem by grouping related data:

const person = {
  name: "Sahil",
  age: 22,
  city: "Mandi"
};

Benefits:

• Better organization of data

• Improved readability

• Easier data management

---

Creating Objects

Objects are created using curly braces {}.

const person = {
  name: "Sahil",
  age: 22,
  city: "Mandi"
};

Each property follows the structure:

key : value

Multiple properties are separated by commas.

---

Accessing Object Properties

JavaScript provides two main ways to access properties.

---

Dot Notation

This is the most common method.

console.log(person.name);
console.log(person.age);

Output

Sahil
22

---

Bracket Notation

Bracket notation is useful when property names are dynamic.

console.log(person["city"]);

Output

Mandi

Example using a variable:

const key = "name";
console.log(person[key]);

---

Updating Object Properties

Object properties can be updated easily.

person.age = 23;

console.log(person.age);

Output

23

Important note:

Even if an object is declared using const, its properties can still be modified.

const only prevents reassigning the entire object.

---

Adding New Properties

New properties can be added anytime.

person.country = "India";

console.log(person);

Updated object:

{
  name: "Sahil",
  age: 23,
  city: "Mandi",
  country: "India"
}

---

Deleting Properties

Properties can be removed using the delete keyword.

delete person.city;

console.log(person);

Result:

{
  name: "Sahil",
  age: 23,
  country: "India"
}

---

Looping Through Object Keys

Objects can be iterated using a for...in loop.

for (const key in person) {
  console.log(key, person[key]);
}

Output example

name Sahil
age 23
country India

Explanation:

key → property name
person[key] → property value

---

Diagram: Array vs Object

ARRAY (Index Based)

fruits = ["apple", "banana", "mango"]

index → value
0     → apple
1     → banana
2     → mango



OBJECT (Key Based)

person = {
  name: "Sahil",
  age: 22,
  city: "Mandi"
}

key  → value
name → Sahil
age  → 22
city → Mandi

Key Difference

Feature	Array	Object
Access	Index	Key
Structure	Ordered list	Key-value pairs
Use Case	Lists of items	Structured data

---

Final Thoughts

Objects are fundamental to JavaScript because they allow developers to represent real-world entities using structured data.

Once you are comfortable working with objects, the next important concepts to explore include:

• Arrays of objects

• Object methods

• JSON

• Working with APIs

• Database data structures

Practicing by creating objects that represent users, products, or students will help strengthen your understanding of JavaScript objects.