Science Knowings: JavaScript Course For Social Media

Classes

**Previously on Let and Const:**

Let's recall the key differences between let and const:

let declares a block-scoped variable, while const declares a constant.

**Welcome to Classes:**

Classes are blueprints for creating objects with similar properties and behaviors. They provide a structured way to organize and manage code, making it easier to maintain and reuse.

**Why Use Classes?**

Classes offer several advantages:

  • Encapsulation: Classes allow you to bundle related data and methods together, hiding implementation details.
  • Reusability: You can create multiple objects from a single class, each with its own set of data.
  • Extensibility: Classes support inheritance, enabling you to create new classes that inherit properties and behaviors from existing ones.
  • Code Organization: Classes help structure your code, making it easier to read, understand, and maintain.

**Defining Classes with the **class** Keyword:**

You can define a class using the class keyword followed by the class name:

class Person { // Class definition }

**Properties and Methods:**

Classes can have properties (data) and methods (functions). Properties define the state of an object, while methods define its behavior.

class Person { constructor(name) { this.name = name; } // Constructor method sayHello() { console.log(`Hello, ${this.name}!`); } // Method }

**Constructor Function:**

The constructor function is called automatically when a new object is created. It is used to initialize properties:

class Person { constructor(name) { this.name = name; } // Constructor method }

**Class Inheritance (ES6):**

ES6 introduced class inheritance using the extends keyword:

class Employee extends Person { constructor(name, title) { super(name); this.title = title; } // Constructor method }

**extends Keyword:**

The extends keyword establishes a parent-child relationship between classes:

class Employee extends Person { // ... }

Employee inherits properties and methods from Person.

**Overriding Parent Methods:**

Child classes can override methods inherited from parent classes:

class Employee extends Person { sayHello() { super.sayHello(); console.log(`I'm an employee!`); } // Override parent method }

**Super Keyword:**

The super keyword refers to the parent class:

class Employee extends Person { constructor(name, title) { super(name); this.title = title; } // Use super in constructor }

**Static Methods and Properties:**

Static methods and properties are attached to the class itself, not to individual objects:

class Person { static create(name) { return new Person(name); } // Static method }

**Class Expressions:**

You can also define classes as expressions:

const Person = class { constructor(name) { this.name = name; } };

**Class Inheritance (ES5):**

Before ES6, inheritance was achieved using prototype-based inheritance:

function Person(name) { this.name = name; } Person.prototype.sayHello = function() { console.log(`Hello, ${this.name}!`); };

**Prototype-Based Inheritance:**

Each object has a prototype property that references the parent object:

const person1 = new Person('Alice'); person1.sayHello(); // Calls inherited method 

**Object.create():**

Object.create() can be used to create new objects with a specified prototype:

const person2 = Object.create(Person.prototype); person2.name = 'Bob'; person2.sayHello(); // Calls inherited method 

**Next Topic: **Inheritance**

In our next session, we'll dive into Inheritance, a fundamental concept in OOP. Inheritance allows you to create new classes that inherit properties and behaviors from existing ones. Follow us to continue your JavaScript journey!