Unleashing the Power of Classes in TypeScript
Classes are the superheroes of object-oriented programming, bringing structure, organization, and reusability to our code. In this blog post, we'll embark on a thrilling adventure into the realm of classes in TypeScript. Get ready to wield the power of encapsulation, inheritance, and polymorphism as we dive deep into the world of TypeScript classes!
Class Basics
In TypeScript, classes provide a blueprint for creating objects with shared properties and behavior. Let's start with the basics of class syntax:
class Animal {
// Properties
name: string;
age: number;
// Constructor
constructor(name: string, age: number) {
this.name = name;
this.age = age;
}
// Methods
sayHello() {
console.log(`Hello, I'm ${this.name}!`);
}
}
In this example, we define a class called Animal
with two properties: name
and age
. The constructor is a special method that initializes the class properties when an object is created. We also have a sayHello
method that logs a greeting message.
To create an instance of the Animal
class, we use the new
keyword:
const dog = new Animal('Buddy', 3);
dog.sayHello(); // Output: Hello, I'm Buddy!
Challenges
Challenge 1: Create a Person Class
Create a class called Person
with the following properties: name
(string), age
(number), and email
(string). Implement a method called introduce
that logs a message introducing the person with their name and age.
class Person {
// Properties
name: string;
age: number;
email: string;
// Constructor
constructor(name: string, age: number, email: string) {
// Your code goes here
}
// Method
introduce() {
// Your code goes here
}
}
Hint: Inside the constructor, assign the parameter values to the class properties using the this
keyword.
Challenge 2: Create a Car Class
Create a class called Car
with the following properties: make
(string), model
(string), and year
(number). Implement a method called startEngine
that logs a message indicating that the car's engine has started.
class Car {
// Properties
make: string;
model: string;
year: number;
// Constructor
constructor(make: string, model: string, year: number) {
// Your code goes here
}
// Method
startEngine() {
// Your code goes here
}
}
Hint: Inside the startEngine
method, log a message using the console.log
function.
Inheritance: Supercharge Your Classes
One of the superpowers of classes is the ability to inherit properties and methods from a parent class. This allows us to create specialized classes while reusing common functionality. Let's explore inheritance in TypeScript:
class Vehicle {
// Properties
make: string;
model: string;
// Constructor
constructor(make: string, model: string) {
this.make = make;
this.model = model;
}
// Method
startEngine() {
console.log('Engine started!');
}
}
class Car extends Vehicle {
// Additional properties and methods
// ...
}
In this example, the Car
class extends the Vehicle
class using the extends
keyword. This means the Car
class inherits the make
and model
properties, as well as the startEngine
method. You can then add additional properties and methods specific to cars.
Challenges (Continued)
Challenge 3: Create a Student Class
Create a class called Student
that extends the Person
class from Challenge 1. Add a new property called grade
(string) to the Student
class. Override the introduce
method to include the student's name, age, and grade.
class Student extends Person {
// Additional property
grade: string;
// Constructor
constructor(name: string, age: number, email: string, grade: string) {
// Your code goes here
}
// Method override
introduce() {
// Your code goes here
}
}
Hint: Inside the introduce
method of the Student
class, call the introduce
method of the Person
class using the super
keyword.
Challenge 4: Create a SportsCar Class
Create a class called SportsCar
that extends the Car
class from Challenge 2. Add a new method called accelerate
that logs a message indicating that the sports car is accelerating.
class SportsCar extends Car {
// Additional methods
// ...
}
Hint: Inside the accelerate
method, log a message using the console.log
function.
Challenge Answers
Challenge 1: Create a Person Class
class Person {
// Properties
name: string;
age: number;
email: string;
// Constructor
constructor(name: string, age: number, email: string) {
this.name = name;
this.age = age;
this.email = email;
}
// Method
introduce() {
console.log(`Hi, I'm ${this.name} and I'm ${this.age} years old.`);
}
}
Challenge 2: Create a Car Class
class Car {
// Properties
make: string;
model: string;
year: number;
// Constructor
constructor(make: string, model: string, year: number) {
this.make = make;
this.model = model;
this.year = year;
}
// Method
startEngine() {
console.log('Engine started!');
}
}
Challenge 3: Create a Student Class
class Student extends Person {
// Additional property
grade: string;
// Constructor
constructor(name: string, age: number, email: string, grade: string) {
super(name, age, email);
this.grade = grade;
}
// Method override
introduce() {
super.introduce();
console.log(`I'm in grade ${this.grade}.`);
}
}
Challenge 4: Create a SportsCar Class
class SportsCar extends Car {
// Method
accelerate() {
console.log('Vroom! The sports car is accelerating!');
}
}
Congratulations on completing the challenges! Classes are powerful tools for creating reusable and organized code structures. With inheritance, you can build specialized classes on top of existing ones, unlocking endless possibilities for code design. Keep exploring the fascinating world of TypeScript classes and continue to level up your programming skills! ๐
Top comments (0)