JavaScript Objects (JS-07)

Track: JavaScript Basics
Lesson: JS-07 / JS-10

🎯 Lesson Goal

By the end of this lesson, you will understand how JavaScript objects work, how to create and access them, and how to use objects to represent real-world data in applications.

---

📌 Prerequisites

• JS-01: Variables and Data Types
• JS-02: Operators and Expressions
• JS-03: Conditional Statements
• JS-04: Loops
• JS-05: Functions
• JS-06: Arrays

You should already understand:

• Variables, arrays, and functions

---

📘 What is an Object in JavaScript?

An object is a collection of key–value pairs.

Each key is called a property, and the value can be:

• Number
• String
• Boolean
• Array
• Function
• Another object

Real-world analogy

A student has:

• name
• age
• course
• marks

All these belong together → perfect use case for an object.

---

🔹 Creating an Object (Object Literal)

let student = {
  name: "Riya",
  age: 21,
  course: "BCA",
  isActive: true
};

---

🔹 Accessing Object Properties

Dot notation (recommended)

console.log(student.name);
console.log(student.course);

Bracket notation

console.log(student["age"]);

✔ Bracket notation is useful when keys are dynamic.

---

🔹 Modifying Object Properties

student.age = 22;
student.city = "Delhi";

console.log(student);

---

🔹 Objects with Functions (Methods)

When a function is inside an object, it is called a method.

let user = {
  name: "Aman",
  login: function () {
    console.log("User logged in");
  }
};

user.login();

---

🔹 Using this Keyword

The this keyword refers to the current object.

let employee = {
  name: "Neha",
  salary: 50000,
  showDetails: function () {
    console.log(this.name + " earns " + this.salary);
  }
};

employee.showDetails();

---

🔹 Objects Inside Arrays (Very Common!)

let students = [
  { name: "Aman", marks: 85 },
  { name: "Riya", marks: 92 },
  { name: "Karan", marks: 76 }
];

Looping through objects

for (let i = 0; i < students.length; i++) {
  console.log(students[i].name, students[i].marks);
}

---

🔹 Nested Objects

Objects can contain other objects.

let order = {
  orderId: 101,
  customer: {
    name: "Rahul",
    city: "Mumbai"
  },
  amount: 2500
};

console.log(order.customer.name);

---

🔹 Checking if Property Exists

console.log("name" in student); // true
console.log("grade" in student); // false

---

🔹 Object vs Array (Important Difference)

Feature	Object	Array
Structure	Key–value	Indexed
Use case	Real-world entities	Lists
Access	By key	By index

---

🔹 Real-World Example (API-style Object)

let product = {
  id: 1,
  title: "Laptop",
  price: 55000,
  tags: ["electronics", "computer"],
  available: true
};

This structure looks like JSON, which is heavily used in APIs and MERN apps.

---

⚠️ Common Mistakes

• Forgetting commas between properties
• Using = instead of :
• Confusing array and object syntax
• Forgetting this inside methods

---

🧠 Practice Tasks

1. Create an object for a book
2. Add a method to display book details
3. Modify a property value
4. Create an array of student objects
5. Loop and print names of all students

---

🧪 Mini Coding Challenge

let employee = {
  name: "Suresh",
  department: "IT",
  salary: 40000
};

Tasks:

• Add a method to increase salary by 10%
• Display updated salary
• Add a new property location

---

📝 Summary

• Objects store related data together
• Properties use key–value format
• Methods are functions inside objects
• Objects model real-world entities
• Objects are the foundation of APIs & MERN

---

➡️ Next Lesson

JavaScript Array Methods (JS-08)
(map, filter, reduce — very important!)

---

🏅 Quiz & Badge

Quiz and badges will be enabled soon.