Understanding Objects in JavaScript
In JavaScript, objects are one of the most powerful ways to store and organize data.
Sometimes storing values in separate variables is not practical.
Example:
let name = "Rahul";
let age = 21;
let city = "Delhi";
This works, but managing related information separately becomes difficult.
Instead, JavaScript provides objects, which allow us to store related data together.
What Are Objects?
An object is a collection of key-value pairs.
Example structure:
key : value
Example object:
let person = {
name: "Rahul",
age: 21,
city: "Delhi"
};
Here:
| Key | Value |
|---|---|
| name | Rahul |
| age | 21 |
| city | Delhi |
So the object groups related information together.
Why Objects Are Needed
Objects help developers:
Organize related data
Represent real-world entities
Make code more readable
Example: representing a person.
let person = {
name: "Amit",
age: 25,
city: "Mumbai"
};
Instead of multiple variables, everything is stored inside one object.
Creating Objects
Objects are created using curly braces {}.
Example:
let car = {
brand: "Toyota",
model: "Camry",
year: 2022
};
This object contains three properties.
Accessing Object Properties
We can access object values in two ways.
Dot Notation
The most common way.
let person = {
name: "Amit",
age: 25,
city: "Mumbai"
};
console.log(person.name);
Output:
Amit
Bracket Notation
Another way to access properties.
console.log(person["age"]);
Output:
25
Bracket notation is useful when property names are dynamic.
Updating Object Properties
We can change existing values easily.
Example:
let person = {
name: "Amit",
age: 25
};
person.age = 26;
console.log(person.age);
Output:
26
The value changed from 25 → 26.
Adding New Properties
Objects can grow by adding new properties.
Example:
let person = {
name: "Amit",
age: 25
};
person.city = "Mumbai";
console.log(person);
Output:
{
name: "Amit",
age: 25,
city: "Mumbai"
}
Deleting Properties
We can remove properties using the delete keyword.
Example:
let person = {
name: "Amit",
age: 25,
city: "Mumbai"
};
delete person.city;
console.log(person);
Output:
{
name: "Amit",
age: 25
}
Looping Through Object Keys
Sometimes we want to access all properties of an object.
We can use a for...in loop.
Example:
let person = {
name: "Amit",
age: 25,
city: "Mumbai"
};
for (let key in person) {
console.log(key + ": " + person[key]);
}
Output:
name: Amit
age: 25
city: Mumbai
This loop goes through every key in the object.
Difference Between Array and Object
| Feature | Array | Object |
|---|---|---|
| Structure | Ordered list | Key-value pairs |
| Access | Index (0,1,2) | Property name |
| Use Case | Lists of items | Structured data |
Example array:
let fruits = ["apple", "banana", "orange"];
Example object:
let fruit = {
name: "apple",
color: "red"
};
Arrays are used for lists, while objects are used for structured information.
Assignment Practice
Create a Student Object
let student = {
name: "Ravi",
age: 20,
course: "Computer Science"
};
Update a Property
student.age = 21;
Loop Through Keys and Values
for (let key in student) {
console.log(key + ": " + student[key]);
}
Output:
name: Ravi
age: 21
course: Computer Science
Visual Idea of Object Structure
Example object:
student
│
├── name → Ravi
├── age → 21
└── course → Computer Science
This shows how objects store data in key-value pairs.