TypeScript builds on top of JavaScript. First, you write the TypeScript code. Then, you compile the TypeScript code into plain JavaScript code using a TypeScript compiler.
Once you have the simple JavaScript code, you can deploy it to any environment that JavaScript runs.
TypeScript files use the .ts extension rather than the .js extension of Javascript files.
One of the most crucial parts of designing programmes is to create reusable components. This guarantees the program's long-term flexibility and scalability.
Abstraction in TypeScript
Abstraction is a method of modelling objects in a system that separates the responsibilities of the class or type from the code that inherits it. As we'll see later in this blog, it is also a mechanism to enforce a concept known as contract-based development.
A developer constructs a type, such as a class or an interface that specifies ‘what’ but not ‘how’ the calling code should implement. So the abstract type's role is to define what has to be done, but it's up to the consuming kinds to perform it. Inheriting or implementing abstract classes and interfaces are done to enforce abstraction.
Abstraction refers to the process of masking lower-level details and revealing just the most important and relevant information to users.
The idea of abstraction is to hide the implementation complexity from inherited classes and allow them to implement the functionality on their own.
The abstract keyword, which can be applied to both classes and methods described in classes, can be used to achieve abstraction in TypeScript.
Abstract Classes in TypeScript
An abstract class is a class that includes both abstract and regular methods. It is a class that is inherited by multiple classes. We can not create objects of an abstract class.
An abstract class is declared by using the keyword abstract.
Syntax
abstract class ClassName{
//variables declaration;
//abstract or non-abstract methods;
}
An abstract class generally has one or more abstract methods.
An abstract method is one that doesn't have any implementation. It merely defines the method's signature and excludes the method body. In the derived class, an abstract method must be implemented.
Implementation of Abstract Classes in TypeScript
The Employee abstract class, which has the getStipend() abstract method, is shown below.
abstract class Employee {
constructor(private firstName: string, private lastName: string) {
}
abstract getStipend(): number
get fullName(): string {
return `${this.firstName} ${this.lastName}`;
}
compensationStatement(): string {
return `${this.fullName} makes ${this.getStipend()} a month.`;
}
}
The function Object() { [native code] } declares the firstName and lastName attributes in the Employee class.
The method getStipend() is an abstract method. The logic will be implemented in the derived class based on the employee type.
The compensationStatement() and getFullName() methods provide comprehensive implementation.
The getStipend() method is called by the compensationStatement() method.
You can't make a new object from the Employee class because it's abstract. An error occurs when the following statement is used.
let employee = new Employee('Pranay','Chauhan');
Error:
The following FullTimeEmployee class inherits from the Employee class:
The stipend is set in the constructor of this FullTimeEmployee class. The FullTimeEmployee class must implement the getStipend() method because it is an abstract method of the Employee class. It just returns the stipend in this case, with no calculations.
The Contractor class, which is derived from the Employee class, looks like this.
The construction manager of the Contractor class sets the rate and hours. The stipend is calculated using the getStipend() method, which multiplies the rate by the number of hours worked.
The following code first generates a FullTimeEmployee and a Contractor object before displaying the compensation statements on the console.
let pc = new FullTimeEmployee('Pranay', 'Chauhan', 15000);
let cn = new Contractor('Code', 'Ninja', 100, 200);
console.log(pc.compensationStatement());
console.log(cn.compensationStatement());
Output:
When you wish to reuse code among several related classes, it's a smart idea to utilise abstract classes.
Interfaces and Abstract Classes in TypeScript
Let us have a look at the difference between the interface and Abstract class in TypeScript.
Interface
Abstract Class
Interfaces support multiple inheritances.
Abstract class does not support multiple inheritances.
All of the participants are abstract.
Some members are abstract, while others are completely functional.
Interfaces are generic in nature. They can be implemented by any class. For example, the IClone interface can be implemented by any class like business objects, database classes.
Abstract classes are related. For example, ViewModelBase is abstract; the class then we know this class will only inherit by ViewModels.
TypeScript Interface has zero JavaScript code that means it is only available in TypeScript and does not produce any code in compiled JavaScript file.
Abstract class compile JavaScript functions.
Frequently Asked Questions (FAQs)
What is typescript?
TypeScript is a JavaScript-based, strongly typed programming language that provides improved tooling at any size.
What is abstraction?
Abstraction means hiding lower-level details and exposing only the essential and relevant details to the users.
What are abstract classes?
An abstract class is a class that includes both abstract and regular methods. It is a class that is inherited by multiple classes. We cannot create objects of an abstract class.
Key Takeaways
In this article, we learned about abstraction in Typescript. We learnt about the syntax of abstract classes in Typescript. We also learned how to implement abstract classes in TypeScript along with an example. We saw the difference between interfaces and abstract classes.
You can refer to more articles available on Typescript.
34+ registered 
