Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Lessons:14Length:1.2 hours
Typescript fundamentals 400x277
  • Overview
  • Transcript

2.2 Interfaces, Classes, and Objects

Hi, and welcome back to TypeScript Fundamentals. In this lesson, I'm going to introduce you to interfaces, classes, and objects. Let's revisit the object type I introduced in the last lesson, before we start talking about interfaces or classes. An object can hold key value pairs that also be structured into multiple levels. Here, I have an object with a type and value keys that hold string values, as well as a foo key that has another object with the var key and an array of numbers in it. If you look at the variable declaration, you can see that it is already a structured type, that contains all the keys and value types. Of course I haven't yet defined which type the variable has. It is implied to be a structured collection of data. You can access the values with the dot syntax. But if the key you're trying to access isn't there, the compiler gives you an error. If I declare the variable explicitly as an object, it becomes unstructured. I can still access the variables, but not but with the dot, but with the square brackets, like in a race. Instead of a position, I use a key. This also means that the object can now be expanded with additional keys, which wasn't possible before. There is a simple reason behind that. Before, the object didn't really act like any kind of object, it acted like an interface. In object oriented programming, interfaces define data structures and function signatures, that an object that is of this interface type is known to implement. You can see it as a contract of sorts between the part of the code that is using the interface, and the part that implements it. It would be terribly inefficient and almost useless, if you can't define interfaces in advanced of using them. So of course, TypeScript implements a way to do so. With the interface keyword, you can now define a named interface, like sample, that defines properties the object must have. If you are using interfaces to structure objects, those are the only properties allowed. Those interfaces can also define functions that must be defined on an object. Let's add the function to the obj variable, so it satisfies the interface. As you can see, it isn't really practical to add the function implementation every time you create an object. It is normally more efficient to define a class instead. If you have done object oriented program before, you will be aware of what a class is. If not, it is basically a template for objects, that include logic in the form of functions you can execute. Let's create the entity class, to continue our example. It also gets a type property that will default to generic entity. As well as a value one. Class is a very powerful because you can inherit all the properties and functions from other class to extend them. For instance, I might want to create a class human, that extends from entity. In this case, I'm going to overwrite the value of type, to make it specific to my class. Right now, there is a property that hasn't been set. And we can set it by using dot syntax, like with objects. Of course, if you have many properties you want to set, it is terribly inconvenient to set all of them individually. It would be better to set them all at once during initialization of the object. This is where constructors come in. They are special functions and we are going to talk about them more in the next lesson, that will be called when an object is being created. I'm going to define a constructor and a base class entity, so it is available to all class that inherit from it. I'm simply going to expect an argument that is of type string and set the value of it using the disk keyword. My human class now inherits the constructor, and will also accept an argument. Humans typically live in countries, so why not add a property for this to the class. To set it, we need another constructor. I say another, because we can't use the one in the base class. It doesn't know what a country is supposed to be. When I create a constructor for the human class, I also have to ask for the value of property. Since human inherits from entity, it must cause super to call the constructive to parent class. In this case, we also have to pass in the value variable, then we can set our own values. Super must be called before you can use this in the constructor. Now, our generic entity might not be able exist on possible to mark them as abstract. This means that it's no longer allowed to create this class. An abstract class is very similar to an interface. The major differences are that an abstract class can assign values to its properties, and define function implementations. Of course, you can also state that a class implements an interface. For instance, there might be a describable interface that requires a description function. If we state that a human implements this interface, we have to define the required function. When you write TypeScript code, it will happen quite often that you don't know or care what type of concrete objectives. All you're interested in instead of implements that interfaces you require. For instance, I can explicitly say that the variable me is something that implements describable. As soon as I do that, I no longer have access to the value or type properties, just a description function. To recap, objects are a collection of key-value pairs to structure data. Interfaces are a way to define structure and give it a name. A Class is a code template for objects that also can contain function implementations to avoid repetition. Classes can inherit from each other and also implement interfaces. Most of the time you only care if an object implements an interface, and not of which concrete class it is. In the next lesson, we are going to look at properties and functions within classes. See you there.

Back to the top