Understanding Objects in JavaScript

Arrays store a list. Objects store a thing — with all its details in one place.

---

1. What Are Objects and Why Do We Need Them?

Say you're storing info about a student. With what you know so far, you'd probably do this:

let name = "Niti";
let age  = 19;
let city = "Bengaluru";

Three separate variables. Fine for one student. But what happens when you have 30? And each has 10 properties? That's 300 variables floating around with no clear connection to each other.

Objects fix this. You bundle all the related data into one structure, under one variable:

let student = {
  name: "Niti",
  age: 19,
  city: "Bengaluru"
};

Everything about this student — in one place. This is the entire point of objects.

---

2. What Is an Object?

An object is a collection of key-value pairs. Each piece of data has a label (the key) and a value.

key      value
─────    ─────────
name  →  "Niti"
age   →  19
city  →  "Bengaluru"

You can store any type of value — strings, numbers, booleans, arrays, even other objects:

let student = {
  name: "Niti",
  age: 19,
  isEnrolled: true,
  marks: [88, 92, 76],
};

Objects vs Arrays — the quick distinction:

• Use an array when you have a list of similar things: [88, 92, 76]

• Use an object when you have one thing with multiple properties: { name, age, city }

---

3. Creating an Object

The most common way is using object literal syntax — curly braces with key-value pairs:

let person = {
  name: "Aryan",
  age: 22,
  city: "Mumbai"
};

Each pair is separated by a comma. The last item can have a trailing comma too — JavaScript handles it fine.

You can also create an empty object and add properties later:

let person = {};
person.name = "Aryan";
person.age  = 22;

Same result, built piece by piece.

---

4. Accessing Properties

Two ways to read a value from an object:

Dot notation (most common)

let student = { name: "Niti", age: 19, city: "Bengaluru" };

console.log(student.name); // "Niti"
console.log(student.age);  // 19

Clean and readable. Use this by default.

Bracket notation

console.log(student["name"]); // "Niti"
console.log(student["city"]); // "Bengaluru"

Looks like array indexing, but you use the key string instead of a number.

When do you need bracket notation?

When the key is stored in a variable — dot notation can't handle that:

let key = "name";

console.log(student.key);    // undefined ← looks for property "key"
console.log(student[key]);   // "Niti"    ← uses the variable's value

Also useful for keys with spaces or special characters (though you should avoid those):

let obj = { "first name": "Niti" };
console.log(obj["first name"]); // "Niti"
// obj.first name ← syntax error

---

5. Updating Properties

Same syntax as accessing — just assign a new value:

let student = { name: "Niti", age: 19, city: "Bengaluru" };

student.age = 20; // Update age
student["city"] = "Hyderabad"; // Update city

console.log(student);
// { name: "Niti", age: 20, city: "Hyderabad" }

---

6. Adding and Deleting Properties

Adding

Simply assign to a key that doesn't exist yet:

let student = { name: "Niti", age: 19 };

student.course = "Computer Science"; // New property added
student.cgpa   = 9.2;

console.log(student);
// { name: "Niti", age: 19, course: "Computer Science", cgpa: 9.2 }

Deleting

Use the delete keyword:

delete student.cgpa;

console.log(student);
// { name: "Niti", age: 19, course: "Computer Science" }

delete removes both the key and its value permanently.

---

7. Looping Through Object Keys

Unlike arrays, you can't use a regular for loop on objects (there's no index). Instead, use for...in:

let student = {
  name: "Niti",
  age: 19,
  city: "Bengaluru",
  course: "CSE"
};

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

// name: Niti
// age: 19
// city: Bengaluru
// course: CSE

key holds the property name as a string each iteration — that's why you use student[key] (bracket notation) inside the loop. student.key wouldn't work here.

You can also use Object.keys() to get all keys as an array:

console.log(Object.keys(student));
// ["name", "age", "city", "course"]

---

8. Putting It All Together (Assignment)

// 1. Create a student object
let student = {
  name: "Niti",
  age: 19,
  course: "Computer Science"
};

// 2. Add more properties
student.college = "RVCE";
student.cgpa = 9.1;

// 3. Update one property
student.age = 20;

// 4. Print all keys and values using a loop
console.log("Student Profile:");
for (let key in student) {
  console.log("  " + key + ": " + student[key]);
}

// Student Profile:
//   name: Niti
//   age: 20
//   course: Computer Science
//   college: RVCE
//   cgpa: 9.1

---

Quick Recap

• Objects store key-value pairs — one thing with multiple named properties

• Create with {}, access with .key or ["key"]

• Bracket notation is needed when the key is in a variable

• Add properties by assigning to a new key, delete with delete

• Loop through keys with for...in, use bracket notation inside the loop

Once arrays and objects click together, you can model pretty much anything in JavaScript.

---