Module 1: Advanced Objects

Object-Oriented Programming Fundamentals

Object-Oriented Programming (OOP) is a programming paradigm based on the concept of "objects", which can contain data and code that manipulates this data. In JavaScript, OOP revolves around creating and managing objects that model real-world entities.

Key Principles of OOP

Encapsulation

Bundling of data & methods that operate on that data into a single object

Inheritance

Creating new classes that inherit properties and methods from existing classes

Polymorphism

Using a single interface to represent different underlying forms (data types)

Abstraction

Hiding complex implementation details and showing only essential features

In JavaScript, objects can be created in several ways:

// Object literals
const person = {
  name: 'John',
  age: 30,
  greet() {
    console.log(`Hello, my name is ${this.name}`);
  }
};

// Constructor functions
function Person(name, age) {
  this.name = name;
  this.age = age;
  this.greet = function() {
    console.log(`Hello, my name is ${this.name}`);
  };
}
const john = new Person('John', 30);

The 'this' Keyword

In JavaScript objects, 'this' refers to the object the method belongs to. It allows methods to access other properties and methods within the same object. The value of 'this' depends on how a function is called, not where it is defined.

Prototypes and Inheritance

JavaScript is a prototype-based language, which means objects can inherit properties and methods from other objects through prototypes. Each object has a prototype object, which acts as a template from which the object inherits methods and properties.

// Prototype-based inheritance
function Animal(name) {
  this.name = name;
}

Animal.prototype.sound = function() {
  console.log('Animal makes a sound');
};

function Dog(name, breed) {
  Animal.call(this, name); // Call parent constructor
  this.breed = breed;
}

// Set up prototype chain
Dog.prototype = Object.create(Animal.prototype);
Dog.prototype.constructor = Dog;

// Override parent method
Dog.prototype.sound = function() {
  console.log('Woof! Woof!');
};

const rex = new Dog('Rex', 'German Shepherd');
rex.sound(); // Outputs: Woof! Woof!

Prototype Chain

When a property or method is accessed on an object, JavaScript first looks for it directly on the object. If not found, it looks up the prototype chain until the property is found or until it reaches the end of the chain (null).

Benefits of Prototypal Inheritance

Memory efficiency - methods defined on the prototype are shared among all instances
Dynamic nature - prototypes can be modified at runtime, affecting all objects that inherit from them
Flexible inheritance patterns - multiple inheritance patterns can be implemented

ES6 Classes

ES6 introduced class syntax to JavaScript, providing a cleaner, more familiar way to create objects and implement inheritance. Under the hood, ES6 classes still use prototypal inheritance but with a more intuitive syntax.

// ES6 Class Declaration
class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
  
  // Method on prototype
  greet() {
    console.log(`Hello, my name is ${this.name}`);
  }
  
  // Static method
  static createAnonymous() {
    return new Person('Anonymous', 0);
  }
}

// Inheritance using extends
class Employee extends Person {
  constructor(name, age, position, salary) {
    super(name, age); // Call parent constructor
    this.position = position;
    this.salary = salary;
  }
  
  // Override parent method
  greet() {
    super.greet(); // Call parent method
    console.log(`I work as a ${this.position}`);
  }
  
  // Additional method
  promote(newPosition) {
    this.position = newPosition;
    this.salary *= 1.1; // 10% raise
  }
}

const jane = new Employee('Jane', 35, 'Developer', 80000);
jane.greet();
// Output:
// Hello, my name is Jane
// I work as a Developer

Class Features

ES6 classes include several features for building robust object-oriented applications:

Constructor - Special method for initializing new objects
Instance methods - Methods available on object instances
Static methods - Methods called on the class itself, not instances
Extends - Keyword for creating a class that inherits from another class
Super - Keyword to call methods from the parent class

Private Class Features (ES2022)

Modern JavaScript now supports private class fields and methods using the # prefix:

class BankAccount {
  #balance = 0; // Private field
  
  constructor(owner, initialBalance) {
    this.owner = owner;
    this.#balance = initialBalance;
  }
  
  #validateAmount(amount) { // Private method
    return amount > 0 && amount <= this.#balance;
  }
  
  getBalance() {
    return this.#balance;
  }
  
  withdraw(amount) {
    if (this.#validateAmount(amount)) {
      this.#balance -= amount;
      return true;
    }
    return false;
  }
}

Guided Project

In this guided project, we'll build a complete inventory management system using ES6 classes. You'll create a class hierarchy that models different types of products and implement various operations like adding, removing, and searching for products.