Check out a free preview of the full TypeScript Fundamentals course:
The "Species" Lesson is part of the full, TypeScript Fundamentals course featured in this preview video. Here's what you'd learn in this lesson:

Mike reviews the species, which is a special property on classes when creating derived objects. Mike takes questions from students.

Get Unlimited Access Now

Transcript from the "Species" Lesson

[00:00:00]
>> Mike North: So there's a special property on some classes that is called species and it's used when we build derived objects. And in this example we have below where we're sort of using species is at work behind the scenes doing what it does by default. And we have an array that doesn't print private information whenever we console.log.

[00:00:26] And we want map and filter to return regular arrays that don't have this restriction. So what happens right now, if you're familiar with map and filter, map will return a new array of equal length and you specify a function that's used to transform each element, right. Filter will return a new array of equal or less length with a subset of the elements that pass a test that you provide, more or less.

[00:00:55] So in both of those cases a new array is being created, so the question is, when I pass a subclass of array in. What am I getting, and the default is, you're going to be getting an object of the same type that you passed in. Think of it like we're going to grab that instance, we're going to grab the instructor off of that instance and we will use that as the mechanism for creating a new ray.

[00:01:18] Now we can use the symbol species and just think of it as it is like a different type of string that will never collide with real strings, think of it that way. So it is the value of that symbol is species, not I'm using figurative quotes here, there are no quotes around there cuz it's no a string.

[00:01:39] But it is a legal property name, but it's not a string, so it will never collide with like a function whose property name is just species having nothing to do with symbols. Does that make sense to everyone? That's all it is, and it looks fancy, it looks confusing.

[00:01:57] Just think of it as like another type of string. Question?
>> Speaker 2: Yeah. Thank you. Just asking about the static keyword. Still doesn't understand that.
>> Mike North: So static calls directly on the class, but not available to on instances of a class. So static keyword would be, when something is not static, when something is an instance function.

[00:02:24] You have to create a new instance and then you can call, like, you can call functions on that instance. An example would be array to create, like, you would get the index of a particular element on an instance of an array. So a static key word would be like a static function would be like, trying to think of a good one that's familiar to everyone.

[00:03:00]
>> Mike North: It would just be pinned directly to the constructor. So let me take a pause here and let me kick out to show exactly what I mean here. So if we have a class like this.
>> Mike North: And we have a member function, that's called learn.
>> Mike North: I am learning, so in order to invoke this function, we need to invoke it on an instance of person.

[00:03:37]
>> Mike North: Right, so that'll work. Its type script is happy with that. A static function would be like this.
>> Mike North: And there if we did this.
>> Mike North: We have a problem. That function is not available on the instance. The reason is, it's available on the constructor. So in this situation, there is no new person.

[00:04:13] These are functions that are, think of them as just functions that are name spaced based on the class itself. But they had nothing to do with a particular instance, they are not on the prototype because the prototype has to do with instances, right. That's the fallback when an instance doesn't have any data directly.

[00:04:35] What this is, it will be something that is conceptually related to person, but it does not require a particular instance in order to work. You get the exact same thing if you did something like this. Up here if we comment this out.
>> Mike North: And here it's gonna be unhappy with me because I didn't say that I was gonna have a function here and really have to do something like this.

[00:05:18] We'll talk about function types in a moment.
>> Mike North: Now it's gonna be happy. It's only cuz it's type script that it was complaining to me about those kinds of things, right? This is just, this here is necessary only because the violation I was getting down here had to do with.

[00:05:41] I'm putting something on it and the shape did not have information about that like I'm adding a value and the shape is not there if this were JavaScript that would be fine so that is a static function. It's just it has nothing to do with an instance and it is directly available on the constructor or on the class.

[00:06:01] All right, so in this situation, so this is where we were to begin. And what we see is when we log the array out initially, before passing, before like doing anything with filter. We see that we get private and that's because two string has been implemented as so.

[00:06:21] When we get the result of a filter and log that out, it turns out that we see evidence, it has created a new MyArray, right? It has created a new instance that matches what I passed in. If we wanted to change that, we could create this static function that says when you access the species of this object, you get a regular array.

[00:06:45] So whenever you're deciding you wanna create a new similar object through something like map or filter, you'll get something like this don't worry about this too much. Tomorrow I'm gonna start talking about iterators, this will make a lot more sense, because it comes by way of a little bit simpler of an example.

[00:07:07] So I'm just planting a seed to make a mental bookmark later and we'll close that loop, I promise. All right, so if you've dealt with this concept of mix ins. So someone's asking me to describe what looks like an arrow function. So this is just a regular Java Script, let me create a Java Script file here.

[00:07:35]
>> Mike North: New file.
>> Mike North: I just don't want it to enforce all that type tracking stuff.
>> Mike North: Good. All right, so we can define a function like this.
>> Mike North: All this is a new way of defining a function from the 2015 version of the JavaScript language spec.
>> Mike North: These are both functions.

[00:08:14] These are both, both work in terms of saying a similar thing and we call this an arrow function. Some languages call this kinda thing a lambda expression and it's just sort of a shorthand that lets you without having to write this word function. Express arguments that are passed in and the output in a distinct way.

[00:08:39] The additional thing that arrow functions bring along for the ride, is when we create a function like this, there's this calling context. If you've dealt with the, this, keyword here. And typically, a function wherever it's defined like, so whatever this error function is defined, it will carry along its calling context into that function.

[00:09:10] So for example if I did something like this,
>> Mike North: And I did something like We did.
>> Mike North: Or getClickListener, and that returns a new function,
>> Mike North: That will have like a mass event here.
>> Mike North: This in here is gonna be, as you can see, I've got this getClickListener, it's auto completing it for me.

[00:09:46] It is giving me, the context is the instance of person, right? If I were to just do this as so.
>> Mike North: It's not going to give me anything like that. So, I did not get that calling context passed along for the ride. And if you are familiar with this kind of thing, it is basically the same as binding that calling context at the time that you have that aerofunction expression.