This course has been updated! We now recommend you take the Angular 9 Fundamentals course.
Transcript from the "Angular & TypeScript" Lesson
[00:00:00]
>> Lucas: So properties. So this is a few TypeScript things that I wanna point out. I've just gotten so used to them I forget they're not in ES6. And now that I've gotten used to it, I yearn for the day that this just becomes the standard. So what we have here is called field assignment.
[00:00:21]
>> Lucas: Is that we're just saying, here's these properties, attach them to the class. You cannot do this in ES6, this has to go in the constructor. Well TypeScript just says, look, you put it here, and we know enough. When you generate this, we just wire it up for you.
[00:00:35] So being able to define your properties outside of a constructor, really nice. As well as, we have obviously type typing. So we can say Item, or selectedItem, it's an item. And we can know things about that. As well as we can say we have items, we can say this is an array of items, or an array of item objects.
[00:00:59] We can know things about that. So what this does is it allows us to communicate intent not only to other developers. So it's really handy when you get to say, what does this thing do? What's coming down the pipeline? I can infer that this is an item object.
[00:01:14] But also, and this is really, really, important, is that it communicates intent to your IDE and your compilers. Because now they know this is exactly what it is and they can optimize not only your workflow but your end build.
>> Lucas: Last but not least, well, two things. So one, we have the interface.
[00:01:36] So by saying implements, we're basically saying this has to behave a certain way. And so if you get into design patterns that, say, favor composition over inheritance, and so being able to program to an interface instead of a concrete instance is really power. Because as long as something adheres to an interface or honors a contract, that we really don't care what it actually is in the concrete sense.
[00:02:05] You just know that I'm getting this thing, and it basically honors this contract, and therefore, I know there's this expected behavior. So let's take for instance Uber. We have Uber drivers. So every Uber driver, in a way, adheres to this Uber interface or contract. So I know that when an Uber driver pulls up, I have expectations about how that interaction is going to work.
[00:02:33] Now it doesn't matter if I'm in a Hyundai, a Honda, an Escalade, or whatever it is. I know, because they essentially are adhering to this contract, that, though the actual implementation's different every time, the experience is the same. So this is kind of a high software engineering, architecture discussion.
[00:02:55] But being able to program to an interface is super, super important. And it allows you to do some very interesting things with composition. And then finally, we are doing what is called constructor assignment. And so, in JavaScript, your parameters on a function is scoped to that function. So you can see here, I have ItemsService being is a parameter to the constructor.
[00:03:22] But down here, outside of the function, and in an another one, I'm able to use it. How is that happening? Well, by adding in an access modifier such as private or public TypeScript goes ahead and says, okay. We know that, because this is private or public, this is an instance on the class, let's go ahead and add it for you.
[00:03:48] So under the hood, it's basically saying this.itemsService equals ItemsService, the parameter, which then allows you to use it outside of the method. Super, super convenient. If I were to do AngularJS now, it would be with ES6, using the architecture. Because it is ES6, it gets really tedious. Seeing I have these four dependencies, and you're basically this.service equals service, this.another service equals service.
[00:04:20] But that's what you have to do to get it to work outside of the constructor. In this case, TypeScript does it for us, yes?
>> Speaker 2: If you do public, will it create a single instance of ItemsService?
>> Lucas: I do not believe so.
>> Lucas: Boom.
>> Lucas: So this is types, so this is an interface.
[00:04:44]
>> Lucas: Field assignment, dependency injection, interfaces.