As your JavaScript programs grow, you often need to store related pieces of information together.
For example, imagine storing details about a person:
You could store them in separate variables, but that quickly becomes messy. This is where objects become useful.
Objects allow you to group related data together in a structured way.
1. What Objects Are and Why They Are Needed
An object in JavaScript is a collection of key–value pairs.
Here:
Key → the label (name, age, city)
Value → the actual data stored
Instead of storing everything separately like this:
let name = "Rahul";
let age = 25;
let city = "Guwahati";
You can group them into one object:
let person = {
name: "Rahul",
age: 25,
city: "Guwahati"
};
Now all related information is stored in one structure.
2. Creating Objects
Objects are created using curly braces {}.
Inside the braces, we write key-value pairs separated by commas.
Example:
let person = {
name: "Aman",
age: 22,
city: "Delhi"
};
In this object:
name is a key and "Aman" is its value
age is a key and 22 is its value
city is a key and "Delhi" is its value
You can think of an object as a container that organizes related information.
3. Accessing Object Properties
Once an object is created, you often want to read the values stored inside it.
There are two common ways to access object properties.
Dot Notation
This is the most common and readable way.
let person = {
name: "Aman",
age: 22,
city: "Delhi"
};
console.log(person.name);
console.log(person.age);
Output:
Aman
22
Here we access properties using:
object.property
Bracket Notation
Another way is using square brackets.
console.log(person["city"]);
Output:
Delhi
Bracket notation is useful when the property name is stored in a variable.
Example:
let key = "name";
console.log(person[key]);
4. Updating Object Properties
Object values can be updated anytime.
Example:
let person = {
name: "Aman",
age: 22,
city: "Delhi"
};
person.age = 23;
Now the object becomes:
{
name: "Aman",
age: 23,
city: "Delhi"
}
This is useful when information changes over time.
For example:
5. Adding and Deleting Properties
Objects are flexible. You can add new properties or remove existing ones.
Adding a Property
You can add a new property simply by assigning a value.
let person = {
name: "Aman",
age: 22
};
person.city = "Delhi";
Now the object becomes:
{
name: "Aman",
age: 22,
city: "Delhi"
}
Deleting a Property
To remove a property, use the delete keyword.
delete person.age;
Now the object becomes:
{
name: "Aman",
city: "Delhi"
}
6. Looping Through Object Keys
Sometimes you need to go through every property inside an object.
JavaScript provides a loop called for...in for this purpose.
Example:
let person = {
name: "Aman",
age: 22,
city: "Delhi"
};
for (let key in person) {
console.log(key, person[key]);
}
Output:
name Aman
age 22
city Delhi
Here:
This is useful when you want to process or display all object data.
Difference Between Array and Object
Beginners often confuse arrays and objects because both store multiple values.
The key difference is how the values are organized.
Array
Arrays store values using numeric indexes.
Example:
let colors = ["red", "green", "blue"];
Accessing values:
colors[0]; // red
Object
Objects store values using named keys.
Example:
let person = {
name: "Aman",
age: 22
};
Accessing values:
person.name; // Aman
So in simple terms:
