Creating Classes in JavaScript

Welcome to the second lesson of Module 6! In this journey, you’ll become an expert in creating classes in JavaScript, mastering the art of defining structures and behaviors of objects in an efficient and reusable way.

Get ready to explore the various features available to build robust and flexible classes, expanding your knowledge in OOP.

Mastering class creation:

Imagine a program that needs to manage information about different types of products, such as books, clothes, and electronics.

Instead of creating repetitive code for each type of product, you can use classes to define the specific characteristics and behaviors of each type, centralizing and organizing your code.

Defining classes:

• Use the keyword class to define the class name and the constructor.
• The constructor defines the initial properties of an object.

Example:

class Product {
  constructor(name, price) {
    this.name = name;
    this.price = price;
  }

  // Method to calculate the discount
  calculateDiscount(percent) {
    return this.price * (1 - percent);
  }
}

Creating objects

• Use the keyword new to create a new object from a class.

Example:

var book = new Product("The Lord of the Rings", 50);

console.log("Book name:", book.name); // The Lord of the Rings
console.log("Book price:", book.price); // 50

var discount = book.calculateDiscount(0.1);
console.log("Book discount:", discount); // 5

Access modifiers:

• Use public to make properties and methods accessible anywhere.
• Use private to make properties and methods accessible only within the class.
• Use protected to make properties and methods accessible only within the class and its child classes.

Example:

class Person {
  constructor(name) {
    this._name = name; // Private property
  }

  getName() { // Public method that returns the name
    return this._name;
  }

  setName(name) { // Public method that sets the name
    this._name = name;
  }
}

var person = new Person("John");

console.log("Person's name:", person.getName()); // John

// Directly accessing the _name property is not possible
// person._name = "Maria";

person.setName("Maria");

console.log("Person's name after modification:", person.getName()); // Maria

Static methods:

Use static methods to define functionalities that don’t depend on a specific object.

Example:

class Product {
  static calculateTax(value) {
    return value * 0.1;
  }
}

var tax = Product.calculateTax(100);
console.log("Tax:", tax); // 10

Challenge:

• Create a JavaScript script that defines a Person class with properties name and age.
• Create a method present that displays the person’s name and age.
• Create a static method generateId that generates a random number to identify each person.
• Create a person object from the Person class and use the present and generateId methods.

Now that you’ve learned about creating classes in JavaScript, let’s take a step further and explore the fundamental concepts of object-oriented programming: encapsulation, inheritance, polymorphism, and abstraction.

These concepts allow us to create more complex and flexible structures in our programs, providing organization, code reuse, and a better understanding of the system as a whole.

Get ready to dive into this fascinating world of object-oriented programming and discover how these concepts can elevate the quality and efficiency of your projects!

Compartilhar

Compartilhar

Siga-me