Create your First Object

Learning Objectives

• Understand objects and their purpose
• Learn object creation and property access
• Master object methods
• Apply objects to organize data
• Practice object-oriented thinking

Section 7.1: JavaScript and Objects

What is an Object?

An object is a collection of related properties and methods grouped together.

let person = {
    name: "Alice",
    age: 30,
    city: "New York"
};

console.log(person.name);  // Alice
console.log(person.age);   // 30

Why Use Objects?

• Organization: Group related data together
• Clarity: Code is easier to understand
• Management: Easier to work with related information
• Reusability: Create templates for similar data

Object Properties and Methods

Properties: Data inside an object
Methods: Functions inside an object

let car = {
    brand: "Toyota",
    model: "Camry",
    year: 2022,
    start: function() {
        console.log("Engine started");
    }
};

console.log(car.brand);  // Property
car.start();              // Method

Section 7.2: Programming with Objects

Creating Objects (Object Literal)

let student = {
    firstName: "John",
    lastName: "Doe",
    studentId: 12345,
    gpa: 3.8
};

console.log(student.firstName);  // John

Accessing Properties

let book = {
    title: "JavaScript Basics",
    author: "Jane Smith",
    pages: 250
};

console.log(book.title);   // JavaScript Basics
console.log(book.author);  // Jane Smith

console.log(book["title"]);   // JavaScript Basics
console.log(book["author"]);  // Jane Smith

Adding Properties

let person = { name: "Alice" };

person.age = 30;
person["city"] = "New York";

console.log(person);
// { name: "Alice", age: 30, city: "New York" }

Modifying Properties

let user = {
    username: "john_doe",
    email: "john@example.com"
};

user.email = "newemail@example.com";
user.username = "jane_doe";

console.log(user);

Deleting Properties

let obj = { a: 1, b: 2, c: 3 };

delete obj.b;

console.log(obj);  // { a: 1, c: 3 }

Methods (Functions in Objects)

let calculator = {
    num1: 10,
    num2: 5,
    add: function() {
        return this.num1 + this.num2;
    },
    subtract: function() {
        return this.num1 - this.num2;
    }
};

console.log(calculator.add());       // 15
console.log(calculator.subtract());  // 5

The this Keyword

let account = {
    balance: 1000,
    owner: "Alice",
    deposit: function(amount) {
        this.balance += amount;
        console.log(this.owner + " deposited 
quot; + amount);
    }
};

account.deposit(500);  // Alice deposited $500
console.log(account.balance);  // 1500

Objects in Objects (Nested)

let employee = {
    name: "Bob",
    position: "Developer",
    address: {
        street: "123 Main St",
        city: "Boston",
        zip: "02101"
    }
};

console.log(employee.address.city);  // Boston

Coding Challenges

Challenge 7.1: Adding a New Property to a Character

Task: Create a character object and add new properties dynamically

Example:

let hero = {
    name: "Superman",
    power: "Strength"
};

// Add new properties
hero.weakness = "Kryptonite";
hero.level = 100;

console.log(hero);

Challenge 7.2: Modeling a Dog

Task: Create a dog object with:

• Properties: name, breed, age, color
• Methods: bark(), eat(), sleep()

Challenge 7.3: Modeling a Circle

Task: Create a circle object with:

• Properties: radius
• Methods: calculateArea(), calculateCircumference()

Challenge 7.4: Modeling a Bank Account

Task: Create a bank account object with:

• Properties: accountHolder, balance
• Methods: deposit(), withdraw(), checkBalance()

Key Takeaways

✅ Objects group related data and functions
✅ Access properties with dot notation (obj.prop)
✅ Methods are functions inside objects
✅ Use this to reference object properties
✅ Objects can contain nested objects
✅ Objects organize code and improve readability

Quiz Questions

• What is the difference between a property and a method?
• How do you access an object property?
• What does the this keyword refer to?
• How do you add a new property to an object?
• What is the benefit of using objects over simple variables?

Next Module: Module 8 - Store Data in Arrays