Summary of how to define and use JavaScript classes

We will explain how to define and use JavaScript’s “class”.

What is “class”?

A class is a concept in object-oriented programming that is a template for creating objects with similar properties and methods.

What is a “class”? Advantages of using “classes”

　A “class” is a concept in object-oriented programming in JavaScript. A class is like a blueprint for creating a particular type of object.

By using “classes”, you can easily create objects with similar properties and methods. Classes are efficient for creating large numbers of objects.

How to define “class”

Definition using the “class” keyword

　The way to define a “class” using the “class” keyword is as follows.

class className {
  constructor() {
    // Processing to be executed in the constructor
  }
  // Methods and properties in a class
}

About the “constructor” method

The “constructor” method is a method for initializing objects created from a “class”.

A “constructor” method is automatically created when you define a “class” using the “class” keyword. In the “constructor” method, you can set the properties and methods necessary for the object created from the “class”.

class Car {
  constructor(make, model) {
    this.make = make;
    this.model = model;
  }
}

const myCar = new Car("Toyota", "Corolla");
console.log(myCar.make); // Toyota
console.log(myCar.model); // Corolla

This sample code defines a class called “Car”. This class has two properties: “make” and “model”. Inside the “constructor” method, two properties can be initialized: “make” and “model”.

Finally, we use the “new” operator to create an instance of the “Car” class named “myCar” and use “console.log” to display the two properties “make” and “model”. Masu.

How to define a “method”

A “method” is a function defined within a class.

A “method” can be called from an instance created within a “class”. The “method” is written within the “class” block. It is defined in the following format:

class className {
  methodName(argument) {
    processing;
  }
}

“getter” “setter” methods

　A “getter” method is a method for obtaining a property value from an instance of a “class”. A “setter” method is a method for setting property values ​​of instances of a “class”. The “getter” and “setter” methods are defined as follows.

class className {
  get PropertyName() {
    return value;
  }
  set PropertyName(value) {
    processing;
  }
}

Sample program and explanation using “class”

Below is a sample program using “class”. This sample defines a “Person” class, creates an instance of the “Person” class, and calls the “greet” method of the “Person” class.

class Car {
  constructor(make, model) {
    this.make = make;
    this.model = model;
  }

  getDescription() {
    return `This car is a ${this.make} ${this.model}.`;
  }
}

const myCar = new Car('Toyota', 'Camry');
console.log(myCar.getDescription());  // This car is a Toyota Camry.

The explanation of this program is as follows.

Summary of this article

We explained how to define and use a “class”.

Now you know how to define “class”! 
It was easiest to understand by looking at sample programs.

By using “classes”, you can create objects more efficiently. 
Let’s continue to practice programming using “classes” and aim to improve our skills!