# Understanding Objects in JavaScript

We have all filled out a form at some point. A school admission form, a job application, a signup page. What does it ask for? Your name, your age, your city, your course. Multiple pieces of information, all describing one single person.

Now imagine trying to store all of that in JavaScript using what we know so far. We could use separate variables:

```javascript
let name = "Gurjeet";
let age = 22;
let course = "Web Development";
let city = "Amritsar";
```

This works for one person. But the moment we need to handle ten students, or a hundred, this approach falls apart completely. There is no connection between these variables. Nothing groups them together and says "these four things all belong to the same person."

That is exactly the problem objects solve.

* * *

## What is an Object?

An object in JavaScript is a way to group related data together under one name. Instead of storing values by position, objects store values by name. Each value gets a label, and that label tells us exactly what the value means.

That label is called a key, and the data it points to is called a value. Together, they form a key-value pair. An object is just a collection of these key-value pairs.

```javascript
let student = {
  name: "Gurjeet",
  age: 22,
  course: "Web Development",
  city: "Amritsar"
};
```

Now every piece of data has a name attached to it. `name`, `age`, `course`, and `city` are the keys. `"Gurjeet"`, `22`, `"Web Development"`, and `"Amritsar"` are the values. Each key-value pair is called a property of the object.

Anyone reading this code immediately understands what each value represents. That clarity is what makes objects so useful.

* * *

## Accessing Properties

There are two ways to access the properties of an object: dot notation and bracket notation.

**Dot notation** is the one we will use most of the time. We write the object name, followed by a dot, followed by the key.

```javascript
let student = {
  name: "Gurjeet",
  age: 22,
  course: "Web Development"
};

console.log(student.name);   // Gurjeet
console.log(student.age);    // 22
console.log(student.course); // Web Development
```

**Bracket notation** works the same way, but we pass the key as a string inside square brackets.

```javascript
console.log(student["name"]);   // Gurjeet
console.log(student["course"]); // Web Development
```

Both give the same result. Dot notation is cleaner and more commonly used. Bracket notation becomes useful when the key is stored in a variable or when the key has spaces in it.

```javascript
let key = "age";
console.log(student[key]); // 22
```

Here we stored the key name in a variable and used bracket notation to access the property dynamically. This is something we cannot do with dot notation.

* * *

## Updating Object Properties

Updating a property works exactly like creating one. We just assign a new value to an existing key.

```javascript
let student = {
  name: "Gurjeet",
  age: 22,
  course: "Web Development"
};

student.age = 23;
student.course = "Full Stack Development";

console.log(student.age);    // 23
console.log(student.course); // Full Stack Development
```

We targeted the key using dot notation and assigned a new value. The rest of the object stays exactly as it was.

* * *

## Adding and Deleting Properties

We are not limited to the properties we define when we first create an object. We can add new ones at any time.

```javascript
let student = {
  name: "Gurjeet",
  age: 22
};

student.city = "Amritsar";
student.isEnrolled = true;

console.log(student);
// { name: "Gurjeet", age: 22, city: "Amritsar", isEnrolled: true }
```

We simply assigned a value to a key that did not exist before, and JavaScript added it to the object automatically.

To remove a property, we use the `delete` keyword.

```javascript
delete student.isEnrolled;

console.log(student);
// { name: "Gurjeet", age: 22, city: "Amritsar" }
```

The `isEnrolled` property is gone. The rest of the object remains untouched.

* * *

## Arrays vs Objects

A question that comes up naturally at this stage is: when do we use an object and when do we use something else to store data?

The clearest way to think about it is this. When we have a list of similar items where order matters, we use an array. When we are describing a single thing with multiple different characteristics, we use an object.

A list of city names is a collection of similar items. A single person with a name, age, and city is one thing with multiple characteristics.

```javascript
// A list of cities — order matters, items are similar
let cities = ["Amritsar", "Delhi", "Mumbai", "Bangalore"];

// A single person — multiple characteristics describing one thing
let person = {
  name: "Gurjeet",
  age: 22,
  city: "Amritsar"
};
```

In real programs, these two are often combined. An array of objects is one of the most common patterns in JavaScript.

```javascript
let students = [
  { name: "Gurjeet", age: 22 },
  { name: "Priya", age: 21 },
  { name: "Rahul", age: 23 }
];

console.log(students[0].name); // Gurjeet
console.log(students[1].age);  // 21
```

We access the array element using its index, then access the object property using dot notation. This pattern shows up constantly in real JavaScript projects, especially when working with data coming from a server or an API.

* * *

## Looping Through Object Keys

Sometimes we want to go through all the properties of an object and do something with each one. The `for...in` loop is built exactly for this purpose.

```javascript
let student = {
  name: "Gurjeet",
  age: 22,
  course: "Web Development",
  city: "Amritsar"
};

for (let key in student) {
  console.log(key + ": " + student[key]);
}

// Output:
// name: Gurjeet
// age: 22
// course: Web Development
// city: Amritsar
```

On each iteration, `key` holds the name of the current property. We use bracket notation with `student[key]` to get its value because the key is stored in a variable, and dot notation does not work with variables.

This becomes very practical whenever we want to display all the details of an object, check what properties exist, or process each value one by one without hardcoding every key manually.

* * *