Open In App

When to use interfaces and when to use classes in TypeScript ?

Improve
Improve
Like Article
Like
Save
Share
Report

TypeScript supports object-oriented programming features like classes and interfaces etc. classes are the skeletons for the object. it encapsulates the data which is used in objects. Interfaces are just like types for classes in TypeScript. It is used for type checking. It only contains the declaration of members of the object. It helps in deriving the classes. 

When To Use Interface In TypeScript:

We should use Interface in TypeScript for validating the structure of an object in the case where we are creating an object, passing object as parameters. The interface is only available in TypeScript code when it compiles JavaScript code its existence disappears it doesn’t make our final Source code heavier. We should use Interface when we want to be Typed checking but we don’t want our code to become bulky. In such a case, we should use Interface in our code. 

Syntax:

// Declaring Interface
interface Interface_name {
    ...
} 

Example: The below example will illustrate the use of the interface in TypeScript.

Javascript




interface Example {
    Name_should: string;
    Number_should: number;
}
 
class Class_Example implements Example {
 
    Name_should: string;
    Number_should: number;
    constructor(Name_should: string,
    Number_should: number) {
        this.Name_should = Name_should;
        this.Number_should = Number_should;
    }
 
}
var k = new Class_Example("Interface", 1);
console.log(k);


Output:

Class_Example { Name_should: 'Interface', Number_should: 1 }

We have seen when to use Interface, let’s now discourse when to use classes in TypeScript:

When To Use Classes In TypeScript:

Case 1: Classes are as an object factory. The factory is something where all related Data and functions to one object or material are grouped in one place so that our flexibility in our work code and other work not related doesn’t interact and cause any problem. In such a case, we should use it when we need flexibility in complex code without interruption we should use Classes.

Syntax:

// Declaring Classes
class Class_name {
    ...
}

Example: The below example will illustrate the use of the classes in TypeScript.

Javascript




var Name = "Geeks1";
var Number1 = 33;
class Class_Example {
 
    Name: string;
    Number: number;
    constructor(Name: string, Number: number) {
        this.Name = Name;
        this.Number = Number1;
    }
 
 
}
var k = new Class_Example("Geeks2", 1);
 
console.log(k.Name);
console.log(Name);
console.log(k.Number);
console.log(Number1);


Output:

Geeks2
Geeks1
1
33

Case 2: Classes provide the features of Object-oriented programming So it makes our code more usable, maintainable, and scalable so is such a case we should use classes in TypeScript. Their functionality of classes is useful in handling the large code base with efficiency. So when we need to handle large code and want these functions of classes we should use classes. For example, we can see the example of inheritance of class. 

Example: The below example will illustrate the use of the classes in TypeScript.

Javascript




class vehicle {
 
    Company_Name: string;
    Number: number;
    constructor(Company_Name: string, Number: number) {
        this.Company_Nameclass vehicle {
 
            Company_Name: string;
            Number: number;
            constructor(Company_Name: string, Number: number) {
                this.Company_Name = Company_Name;
                this.Number = Number;
            }
        }
        class car extends vehicle {
            name: string;
            Number: number;
            wheel: number;
            fuel: string;
            constructor(name: string, Number: number,
                wheel: number, fuel: string) {
                super(name, Number);
                this.wheel = wheel;
                this.fuel = fuel;
            }
        }
        var k = new car("toyota", 9243, 4, "Geeks2");
        e = Company_Name;
        this.Number = Number;
    }
}
class car extends vehicle {
    name: string;
    Number: number;
    wheel: number;
    fuel: string;
    constructor(name: string, Number: number,
        wheel: number, fuel: string) {
        super(name, Number);
        this.wheel = wheel;
        this.fuel = fuel;
    }
}
var k = new car("toyota", 9243, 4, "Geeks2");


Output:

car { 
    Company_Name: 'toyota', 
    Number: 9243, 
    wheel: 4, 
    fuel: 'Geeks2' 
}

Advantage of Classes and Interface:

                                      Classes                                  Interface

Classes provide inheritance which enables classes to borrow property

of one class into another.

The interface also provides inheritance property. 
Classes support method overriding which helps in function redefining. It merges with the Interface with the same number.
Classes provide a static method that makes the function of classes to be used without declaration. It is doesn’t increase the size of the source file because it is a virtual structure. 


Last Updated : 12 Dec, 2022
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads