How to Create Class in JavaScript ES6

This JavaScript tutorial help to create class and method using ECMAScript 6. We will create a simple JavaScript class and extend it into another class.

The ECMAScript 5 does not have a class concept. it was introduced into ECMAScript 6.

We will implement oops concept into js application.You can create constructor, method and variable into class. It’s not fully supported object-oriented programming as like other languages java, python and C.

How to Define Class in JavaScript

We can define two ways to create class in JavaScript-

Create Class Using class keyword

We can define class into js application using Class keyword, We will create employee class using the below code –

class Employee {
	constructor(name, age, salary) {
	 this.name = name;
	 this.age = age;
	 this.salary = salary;
	}
}

As you can see, I have used constructor method to set property as the time of class instantiate.

Create Class Using class expression keyword

We can also create class using js class expression. We will use let keyword and store class into this variable. The class expression can be named or unnamed.

let Employee = class {
	constructor(name, age, salary) {
	 this.name = name;
	 this.age = age;
	 this.salary = salary;
	}
}

How to Define Method in Class JavaScript

We can also define the method into the JavaScript class. We will create two types of methods in class, One is a static method and the other non static method. The main difference between them is static method can be called without instantiate of class whereas the other method call with instance object of class.

How to Define Method in Class

We will define function into class like other programming languages.

class Employee {
	constructor(name, age, salary) {
	 this.name = name;
	 this.age = age;
	 this.salary = salary;
	}
	get name() {
	return this.name;
	}
	
	employeeDetails() {
	return {this.name, this.age, this.salary};
	}
}

in the above code, I have created one getter method name(), That is returning the name of the employee and a method which returns the employee whole details.

How to use Class method

We can call above method as like below –

let emp = new Employee('adam', 34, 4567);
console.log(emp.name());
console.log(emp.employeeDetails());

How to Define Static Method in JavaScript Class

We can also define the method as a static method into js class.The static keyword use to define static method into class.This method can call without instantiate of class.

class Helper {
	static testMethod() {
	return 'static method has been called.';
	}
}

How to class static method in JavaScript

We can call above method as like below –

console.log(Helper.testMethod());

How To Inherit Class in JavaScript

We can also extend base class into another class using extend. The ECMAScript 6 providing super() method to call base class constructor.

class Dept extends Employee {
    constructor(name, age, salary, dept) {
        // Chain constructor with super
        super(name, age, salary);

        // Add a new property
        this.dept = dept;
    }
}

We have extending Employee class and creating new class Dept.