2. Classes | Object Oriented Programming in JavaScript | ES6 | JavaScript

Classes | ES6
JAGADEESH PATTA ( PJ )

Agenda
 Introduction
 Class Definition
 Static methods
 Inheritance
 Live Examples

Introduction
 A class is the blueprint / Template from which individual objects are
created.
 In JavaScript class is special kind of function.
Example
Honda CBR, Bajaj Pulsar, TVS Apache all are comes under Byk class.

Class Definition
In JavaScript there are two components available to define a class
just like define a function.
 Class Declaration
 Class Expression

Class Definition – Class Declaration
 One way to define a class.
 To declare a class use class keyword with class name.
Syntax
class class_name {
// class body with constructor
}

Class Definition – Class Declaration(cont…)
Example
class Vehicle {
constructor(name, model){
this.name = name;
this.model = model;
}
}

Class Definition – Class Expressions
 Another way to define a class.
 Class expressions may be named or unnamed.
Syntax
var class_name = class { // unnamed
};

Class Definition – Class Expressions(cont…)
Syntax
var exp_name = class class_name { // named
};

Example
var Vehicle = class {
this.name = name;
this.model = model;
}
}

Example
var Vehicle = class Vehicle{
this.name = name;
this.model = model;
}
}

Static Methods
 A method qualified with a qualifier static is called static method.
 We can access static methods without creating object.
Syntax
static method_name([params]){
// method body
}

Static Methods(cont…)
Example
class Vehicle {
static getVehicleName(company_name, modal){
return company_name + “ “ + modal;
}
}

Inheritance
 A class derived from another class.
 Using inheritance we can get all the base class properties.
Syntax
class class_name extends base_class_name{
// class body
}

Inheritance(cont…)
Example
Vehicle.js (Base class)
class Vehicle{
constructor(modalName){
console.log(‘This is from super class ‘+modalName);
}
}

Example
Honda.js (Derived class)
class Honda extends Vehicle{
constructor(modalName){
super(modalName);
console.log(‘This is from derived class ‘+modalName);
}
getModalName() { return this.modalName; }
}

Example
main.js
Var hondaObject = new Honda(‘CBR 250R’);
hondaObject. getModalName();

2. Classes | Object Oriented Programming in JavaScript | ES6 | JavaScript

More Related Content

What's hot(20)

Similar to 2. Classes | Object Oriented Programming in JavaScript | ES6 | JavaScript(20)

More from pcnmtutorials(18)

Recently uploaded(20)

2. Classes | Object Oriented Programming in JavaScript | ES6 | JavaScript