Classes

#JavaScript Notes
Oops Concept

Akash Technolabs www.akashsir.com

What is Oops Concept ?
 It stands for Object Oriented Programming.

 Object-Oriented Programming is a methodology (process) to design a

program using classes and objects.

 It simplifies the software development and maintenance by providing some

concepts.

 It also brought in similarities to different OOP-based programming languages

such as C++ and Java.

Akash Technolabs www.akashsir.com

Oops Concept
 Object

 Class

 Encapsulation

 Inheritance

 Polymorphism

Akash Technolabs www.akashsir.com

Advantages of OOP
 Code recycle and reuse.

 Wrapping data into a single unit.

 Message passing with external systems much simpler.

 Software Complexity can be easily handled.

 Data hiding is possible.

Akash Technolabs www.akashsir.com

Getter and Setter
(Encapsulation)

Akash Technolabs www.akashsir.com

Encapsulation
 One of the core concepts of OOP is encapsulation.
 An important part of encapsulation is that data (object properties) should
not be directly accessed or modified from outside the object.
 To access or modify a property we would use a getter (access) or a setter
(modify), which are specific methods we define in our class.
 In JavaScript, getter methods get the value of an object and setter methods
set the value of an object.
 Use the get keyword for getter methods and set for setter methods.

Akash Technolabs www.akashsir.com

Getters and Setters
class Person {
constructor(name) {
this.name = name;
}
// getter
get personName() {
return this.name;
}
// setter
set personName(x) {
this.name = x;
}
}

let person1 = new Person('Akash');

console.log(person1.name); // Akash

// changing the value of name property

person1.personName = 'Aarav';
console.log(person1.name); // Aarav

Akash Technolabs www.akashsir.com

Get & Set

class Car{
constructor(carname){
this.name = carname;
}
get CarName(){
return this.name;
}
set CarName(x){
this.name = x;
}
}
//Object
myobj = new Car("BMW");
console.log(myobj.CarName);
//Assign
myobj.CarName = "Audi";
//Get
console.log(myobj.CarName);
myobj.CarName = "Honda";
//Get
console.log(myobj.CarName);

Akash Technolabs www.akashsir.com

Example
class Car{
constructor(model){
this.model = model;
}
//Method
get ModelDetails()
{
return this.model;
}
set ModelDetails(value){
this.model = value;
}
}
//Object
tata = new Car("Nexon");
//Print Default Value
console.log(`Intial Value is ${tata.model}`)
//Print Method
var a = tata.ModelDetails;
console.log(`Get Name Value is ${a}`);
//Assign New Value
tata.ModelDetails = "Tiago";
//Print Method
var a = tata.ModelDetails;
console.log(`New Value is ${a}`);

Akash Technolabs www.akashsir.com

Example

Akash Technolabs www.akashsir.com

Inheritance

Akash Technolabs www.akashsir.com

Class Inheritance
 Classes can also inherit from other classes.
 The class being inherited from is called the parent, and the class inheriting
from the parent is called the child.
 When the properties and the methods of the parent class are accessed by
the child class, we call the concept has inheritance.
 To use class inheritance, you use the extends keyword.
 Inheritance is a useful feature that allows code reusability.

Akash Technolabs www.akashsir.com

Cont…
 Inheritance enables you to define a class that takes all the functionality from
a parent class and allows you to add more.
 Using class inheritance, a class can inherit all the methods and properties of
another class.

Akash Technolabs www.akashsir.com

Cont…
Sub Class: The class that inherits properties from another class is called Child
class or Derived class or Sub class.

Super Class:The class whose properties are inherited by sub class is called
Parent class or Base class or Super class.

Inheritance represents the IS-A relationship, also known as parent-

child relationship.

Akash Technolabs www.akashsir.com

Class Inheritance
 Student class inherits all the methods and properties of the Person class. Hence, the
Student class will now have the name property and the greet() method.
// parent class
class Person {
constructor(name) {
this.name = name;
}

greet() {
console.log(`Hello ${this.name}`);
}
}

// inheriting parent class

class Student extends Person {

//Object of Student Class

let student1 = new Student('Akash');
student1.greet();

Akash Technolabs www.akashsir.com

Extends to Multiple Class
// parent class
class Person {
constructor(name) {
this.name = name;
}
greet() {
console.log(`Hello ${this.name}`);
}
}

// inheriting parent class

class Student extends Person {
}

// inheriting parent class

class Professor extends Person {
subject(){
console.log(`I Teach Es6`);
}
}

//Object of Student Class

let student1 = new Student('Akash');
student1.greet();

let professor1 = new Professor('AkashSir');

professor1.greet();
professor1.subject();

Akash Technolabs www.akashsir.com

JavaScript super() keyword
 The super keyword used inside a child class denotes its parent class.
 The super keyword is used to refer to the immediate parent of a class.

Akash Technolabs www.akashsir.com

Example
// parent class
class Person {
constructor(name) {
this.name = name;
}
greet() {
console.log(`Hello ${this.name}`);
}
}

// inheriting parent class

class Student extends Person {

constructor(name) {
console.log("Creating student class");
// call the super class constructor and pass in the name parameter
super(name);
}

let student1 = new Student('Akash');

student1.greet();
//Output
//Creating student class
//Hello Akash

Akash Technolabs www.akashsir.com

Polymorphism

Akash Technolabs www.akashsir.com

Polymorphism
 Polymorphism is another special feature of object-oriented programming
(OOPs).
 The meaning of polymorphism is having multiple forms.
 The term Polymorphism get derived from the Greek word where poly +
morphos where poly means many and morphos means forms.

Akash Technolabs www.akashsir.com

Cont…
 Polymorphism is also known as Method Overriding in some languages.

 This means that if the class is inherited from its parent class and both have
the same methods, so the child class methods can be overridden or rewritten
according to its functionality.

Akash Technolabs www.akashsir.com

Cont…
 Rules for Method Overriding

 Method must have same name as in the parent class.

 Method must have same parameter as in the parent class.

 Must be IS-A relationship (inheritance).

Akash Technolabs www.akashsir.com

Example
// parent class
class Person {
greet() {
console.log("Hello, This is Person class's greet method...");
}
}

// inheriting parent class

class Student extends Person {
greet() {
console.log("Hello, This is Student class's greet method...");
}
}

//Object of Student Class

let student1 = new Student();
student1.greet();

Akash Technolabs www.akashsir.com

Example with Super Keyword
 To call parent class method we have used super keyword.

// parent class
class Person {
greet() {
console.log("Hello, This is Person class's greet method...");
}
}
// inheriting parent class
class Student extends Person {
greet() {
//Calling Parent class method
super.greet();
console.log("Hello, This is Student class's greet method...");
}
}
//Object of Student Class
let student1 = new Student();
student1.greet();

Akash Technolabs www.akashsir.com

Get Exclusive
Video Tutorials

www.aptutorials.com
https://www.youtube.com/user/Akashtips
www.akashsir.com
Rating Us Now

Just Dial
https://www.justdial.com/Ahmedabad/Akash-Technolabs-
Navrangpura-Bus-Stop-Navrangpura/079PXX79-XX79-
170615221520-S5C4_BZDET

Sulekha
https://www.sulekha.com/akash-technolabs-navrangpura-
ahmedabad-contact-address/ahmedabad
Connect With Me
# Social Info

Akash.padhiyar
Akashpadhiyar
Akash Padhiyar
#AkashSir Akash_padhiyar

+91 99786-21654

www.akashsir.com
www.akashtechnolabs.com #Akashpadhiyar
www.akashpadhiyar.com #aptutorials
www.aptutorials.com