Welcome to the OOP station! Today, we're going to dive into constructors in TypeScript classes. Constructors play an essential role in creating and initializing objects. Picture a constructor as a blueprint — it details the components necessary for creating each object.
Just like JavaScript, if you don't provide a constructor in your TypeScript class, a default one will be supplied. Imagine this scenario as being given a blank blueprint sheet ready for you to customize!
In TypeScript, constructors are defined using the keyword constructor
within a class. These constructors can have parameters that initialize the properties of class instances. Think of this as specifying the components needed for a blueprint and their respective quantities. Let's exemplify this:
TypeScript1class Car { 2 brand: string; 3 model: string; 4 color: string; 5 6 constructor(brand: string, model: string, color: string) { 7 this.brand = brand; 8 this.model = model; 9 this.color = color; 10 console.log(`Instantiated a Car instance with brand=${brand}, model=${model}, color=${color}`); 11 } 12}
Note that in TypeScript, we have to declare the types of the class properties before assigning them in the constructor. Each time we create a new Car
object, we need these attributes to be supplied. You'll learn more about attributes in upcoming lessons.
Let's create our first Car
object using the new
keyword:
TypeScript1let myCar = new Car("Toyota", "Corolla", "red"); 2// Prints a message from the constructor: 3// Instantiated a Car instance with brand=Toyota, model=Corolla, color=red
myCar
is a Car
object, representing a red Toyota Corolla. This object has properties defined by the constructor!
Although a TypeScript class can host numerous methods, it is bound by one condition — it can only accommodate a single constructor. If we attempt to declare more than one constructor, TypeScript will raise a SyntaxError
.
In instances where no explicit constructor is defined, TypeScript provides a default one: constructor() {}
.
Furthermore, we can assign default values to parameters as shown below:
TypeScript1class Car { 2 brand: string; 3 model: string; 4 color: string; 5 6 // 'color' has a default value of "white" 7 constructor(brand: string, model: string, color: string = "white") { 8 this.brand = brand; 9 this.model = model; 10 this.color = color; 11 } 12}
Fantastic! You've now learned about TypeScript constructors, how to use them, their unique properties, and how they facilitate object creation when defining classes. Remember, practice is the key to mastery. Delve further into constructors and explore their potential. Happy coding!