Understanding Objects in JavaScript
In our previous post, we learned that Arrays are great for lists. But what if you want to describe a specific person? Using an array like ["InsideTech", 21, " Engineering"] is confusing. Does "21" mean age, or is it a roll number?
Objects solve this by using a Key-Value Pair structure. Instead of just storing data, we give every piece of data a label (a key).
Topics we are going to cover in this blog are as follows
Creating objects
Accessing properties (dot notation and bracket notation)
Updating object properties
Adding and deleting properties
Looping through object keys
What is an Object?
An object is a collection of related data and/or functionality. It is the closest thing in code to a real-world entity.
Creating an Object
We use curly braces {} to define an object literal.
const user = {
name: "InsideTech",
age: 21,
city: "Ahmedabad",
isStudent: true
};
Accessing Properties
There are two ways to get data out of an object:
Dot Notation (
.): This is the most common and readable method.console.log(user.name); // "InsideTech"
Bracket Notation (
[]): Essential if your key name is stored in a variable or has spaces.console.log(user["city"]); // "Ahmedabad"
Updating, Adding, and Deleting
Objects are dynamic. You can modify them even after they are created.
// 1. Updating
user.age = 20;
// 2. Adding a new property
user.hobby = "3D Modeling";
// 3. Deleting a property
delete user.isStudent;
Understand through the below Table diagram
Looping Through Objects
Unlike arrays, you can't use a standard for loop with an index. Instead, we use the for...in loop to iterate through the keys.
for (let key in user) {
console.log(key + ": " + user[key]);
}
// Output: name: InsideTech, age: 20, city: Ahmedabad, hobby: 3D Modeling
Conclusion
Objects are the "containers" of the JavaScript world. By mastering them, you can now structure complex data efficiently. This is a massive step you've moved from writing simple scripts to managing data structures that modern apps are built on.
