Introduction to Objects in JavaScript
Objects are among the most important constructs in JavaScript. In real applications, most of the data you work with is stored and managed using objects. They allow you to store data in key–value pairs, facilitating the grouping of related information.
For example, instead of using multiple variables like this:
let name = "Aman";
let age = 21;
let course = "BCA";
You can store everything inside one object:
let student = {
name: "Aman",
age: 21,
course: "BCA"
};
Objects help you organize your data cleanly and efficiently.
What Is an Object?
An object is a collection of key–value pairs.
Keys ? names of properties
Values ? the data stored inside those properties
Objects are written inside curly braces { }.
Example:
let person = {
name: "Riya",
age: 20,
city: "Delhi"
};
Accessing Object Values
There are two ways to access values:
1. Dot notation
console.log(person.name);
console.log(person.age);
2. Bracket notation
console.log(person["city"]);
Output:
Riya
20
Delhi
Bracket notation is useful when keys contain spaces or special characters.
Adding New Properties to an Object
You can add new values easily.
person.country = "India";
person["gender"] = "Female";
console.log(person);
Output:
{
name: "Riya",
age: 20,
city: "Delhi",
country: "India",
gender: "Female"
}
Updating Values in an Object
person.city = "Mumbai";
Deleting Properties
delete person.age;
console.log(person);
Objects Can Store Any Data Type
Objects can store:
Strings
Numbers
Booleans
Arrays
Functions
Other objects
Example:
let car = {
brand: "Honda",
model: "City",
year: 2020,
colors: ["black", "white"],
owner: {
name: "Karan",
age: 30
}
};
console.log(car.owner.name);
console.log(car.colors[1]);
Output:
Karan
white
Objects with Functions (Methods)
A function inside an object is called a method.
let student = {
name: "Meera",
age: 21,
greet() {
console.log("Hello, " + this.name);
}
};
student.greet();
Output:
Hello, Meera
this refers to the current object.
Looping Through Objects (for…in)
To print all keys and values:
let product = {
title: "Laptop",
price: 50000,
brand: "HP"
};
for (let key in product) {
console.log(key, ":", product[key]);
}
Output:
title : Laptop
price : 50000
brand : HP
Array of Objects (Very Important)
Used in real projects like APIs, databases, and UI lists.
let students = [
{ name: "Riya", marks: 85 },
{ name: "Aman", marks: 72 },
{ name: "Karan", marks: 90 }
];
for (let s of students) {
console.log(s.name, "-", s.marks);
}
Output:
Riya - 85
Aman - 72
Karan - 90
Real-Life Example: Order Details
let order = {
id: 101,
items: ["Laptop", "Mouse"],
total: 55000,
status: "Shipped"
};
console.log("Order ID:", order.id);
console.log("Total Amount:", order.total);
Why Objects Are Important
Objects are everywhere in JavaScript:
User details
Product info
API responses
Settings and configurations
DOM elements
Frameworks like React, Node.js
Understanding objects is essential for advanced JavaScript.
Common Mistakes Beginners Make
Forgetting commas between properties
Accessing keys incorrectly
Using dot notation for dynamic keys
Confusing arrays and objects
Using
thisinside arrow functions (not recommended)
Example Program (Complete)
let student = {
name: "Aman",
age: 22,
subjects: ["HTML", "CSS", "JS"],
details() {
console.log("Name:", this.name);
console.log("Age:", this.age);
console.log("Subjects:", this.subjects);
}
};
student.details();
Output:
Name: Aman
Age: 22
Subjects: HTML,CSS,JS
Practice Tasks (Do It Yourself)
Create an object for a student with name, age, course, and marks.
Add a new key to the student object after creating it.
Delete one property from the object.
Create an array of 3 product objects and print their names.
Create an object with a method that prints a message.