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 propertiesname
andage
. - 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 thePerson
class and use thepresent
andgenerateId
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!