Skip to main content

Command Palette

Search for a command to run...

Understanding Objects in JavaScript

Published
4 min read
Understanding Objects in JavaScript

As your JavaScript programs grow, you often need to store related pieces of information together.

For example, imagine storing details about a person:

  • Name

  • Age

  • City

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:

  • updating a user's age

  • changing a user's city

  • updating account information

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:

  • key represents the property name

  • person[key] gives its value

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:

  • Arrays → ordered lists

  • Objects → structured data with named properties