Public Static Fields

[00:00:00]
>> Will Sentance: So we saw our class syntactic sugar, that's right, let's actually map through it. I will give a quick note on it first, because we're going to add a bunch of more features to it. What are our benefits? It's emerging as the new standard. Feels much more like the style of other languages. Python, for example, the ability to have our function that constructs the objects in the same position, in the same construct known as the class, that also allows us to put the functions that will be shared, the methods that will be shared by all those objects in that same structure, not have to separately define them in.

[00:00:39]
UserCreator.prototype, add login. UserCreator.prototype, increment. Instead we just list them. Instead we just list them, increment, login. There's our function constructor that does when run, and when we run UserCreator, we're going to run the constructor bit. But same as before. Problems, 99%, from 95 to 99% of developers have no idea how it works. I know it sounds a bit harsh here, and therefore fail in that, it's not too harsh, but this is a thing that really gives you an edge.

[00:01:14]
But you will not be one of those people. But I want to now expand into what class is beginning to give us that looks even more like our traditional open, I'll say the word, our traditional object-oriented programming languages. We are now able to, and these were added only in 2022. We're now able to add static, private, class, instance, fields. Those are the kind of different, those are the different things we're able to add.

[00:01:49]
So, with that in mind, I will say that we're going to walk through this code as before. And we're going to add our static field here, our static public field here, and we're going to see this one really is just going to be our extension of syntactic sugar. We're not actually going to be doing anything additional beyond the nature of our function object combo. But let's walk through it together, because on the next slide, we're going to add something that actually starts to add or alter exactly how our function object combo is working.

[00:02:37]
So, our last serious diagramming. Who wants to take the lead, let's create our global memory. Into it we go. Let's. What are we doing in line one? I'm going to turn to. I've been calling on almost everybody. Joe, what are we doing in line one? We're creating a function and object. Oh yes, exactly. User, what do I call it? UserCreator. It may say class, but it's actually just a function object combo, which in the object bit automatically has a property prototype, which is another big old object.

[00:03:27]
That's what we did when we defined a class, so we can call this piece here, let's say we can call this altogether a class. Beautiful. OK, let's start with our function piece, that there, the constructor piece, that's this function here. So we can call this bit here the constructor piece. Nothing's changed though, it's just a function saved. And now, whereas before we had to go UserCreator.prototype.

[00:04:02]
Increment save a function, Joe, what do we instead get to do below there with our increment method? On the second line. Let's jump, let's come back to the second line in a second. Yeah, let's do our two below just to maintain, we're just going to get back to where we were, then we'll add in our new piece. On the increment, we are going to create a property in the prototype. Or, or what, yeah, oh yeah, no, you're right, sorry.

[00:04:27]
I'm so sorry to interrupt. Joe's exactly right. Keep going, yep. Called increment, yes. And that is going to be a function. Yeah, sorry, Joe, Joe was so on point there, I almost couldn't believe that. Yes, I'm so glad you're following it so closely, Joe. Yes, the next line says, yeah, it's the same scope, we'll create that login inside of that prototype object. Yeah, or we'll create the login function.

[00:04:48]
Careful with the reference of scope there, I would just say within the prototype object on the UserCreator function object combo known as a class, or now known as a class, here, we create our login function. Beautiful, but we have one more thing here that looks a lot like other programming languages, and what is it doing? Look at the comment there, what are we going to add? It turns out that not only do we have on our UserCreator object will have another what on it?

[00:05:33]
A property. Yes, yes, named describe. Yes. Describe, which is what? A function, a function definition. Wow. Ask why you had us go to that. Oh, just because, no, no, we could definitely have done that bit first. I did it there because, well, for one thing, JavaScript is going to set up all of this together in one go, and the order it sets it up doesn't have any consequence, it's like when we declare a function.

[00:05:57]
There's the function object combo, create the object bit first or the function bit, no, it's all done within this class definition now, so it doesn't actually matter the order. The reason I did it was because I wanted to start with the bit we were familiar with and then add our described function definition. But nothing, this is some proper syntactic sugar. That fancy word static there, this is all, this is only going to add our described function to UserCreator, the object portion, not the prototype bit, but to the object directly, because it's a function we want to have related to the overall class.

[00:06:37]
In fact, we're going to have it describe when it gets called, what this class, what this overall function object combo class actually does, which is going to log, create users. OK, Michael, go ahead. Well, I mean, you say class UserCreator, you're saying that it has the function object that's created in memory, but I thought it would be just a straight up function definition under the hood that will like actually call and do all the other object stuff, right, because we're not instantiating an object with all those things at that point.

[00:07:12]
Right, we're setting up a function with this object that has all the information on it that's going to be shared by, to distinguish between this object as part of the function object combo, and what happens when we call UserCreator, where we're then going to run this function, and it's going to create our user1, our user2, that are going to have access back to this object here. So for now, no, we're not creating any objects.

[00:07:41]
Well, besides the function object combo that is fancily known as a class. All of this is just wrapping what we saw earlier, which was creating a function. If you remember before, we created a function, which automatically was a function and object, we added those shared functions, increment and login into the object bit under prototype, and when we ran UserCreator, we created a new object inside of it, that we then turned out into user1, and that user1 had access to increment and login.

[00:08:16]
Now we've decided, even this is too accurate, even this is too explicit, let's wrap this up and pretend even more that JavaScript is doing what some of you will be very familiar with from other languages, which is a native class, a class that is actually, you know, native to the language, pure syntactic sugar, it's still a function with an object on it, on the prototype property of the function in its object form.

[00:08:41]
It's just now wrapped in this fancy label class, but it's absolutely doing the same thing. JavaScript just has a, this is what I mean, like I don't think you could have a hard part of other languages, because other languages don't try and fake OOP by using an entirely different structure of prototypal design. It's like JavaScript's creators have this shame that they're not like other languages, or you could say it's wonderfully versatile and always patching, always being creative.

[00:09:18]
So, with that in mind, you can see it now allows us within this structure that's going to build out the function object combo, to also pretend that we're adding a public static field that you'll be maybe familiar with from other languages, but it ain't anything fancy, it's just saying on the UserCreator function object combo, wrapped in this fancy term class, when we define it, the class bit is, do all this stuff in the creation of a function object combo, including now add a describe function too, just UserCreator, the function object.

[00:09:56]
Now you might say to the class. Yes, except that the class is just the function object, as it always was. But now on that object, we can also add describe. Let's keep walking through this and see it play out exactly as we've done before, just because I don't think there's any harm in doing this again. And well, actually, let's not create our new user yet, let's do that on the next slide. Let's for now just do our UserCreator.describe.

[00:10:31]
So our UserCreator.describe. UserCreator, call to describe, I mean this really is the most, this is back to what we were doing before with multiplyBy2.stored. Right, we're now really just going to use a creator, well, let's talk about it. Who wants to be up, Joe? We're going to use a creator, and what are we looking for? A method called describe. And is it there? Yeah, exactly. Are we going back to the class, nah, that class wrapper, the curly braces around all the stuff in there, did one task, put the function bit under constructor as UserCreator's function.

[00:11:13]
Did another bit, take the functions listed below, and store them on the prototype object bit of the function object combo, as before, but it then did another bit. Take the describe function because it has static before it, and put it not in prototype, but directly on the object bit of the UserCreator function object combo. OK, and we're allowed to therefore execute it, and it will in console, in the console, it will log, create, creates users.

[00:11:55]
OK. Excellent, syntactic sugar that just adds functions directly to the class, otherwise known as the function object combo. Let's add the next one. The chance for us to add public instance fields. These are things that every new object that comes from running the UserCreator in its function form, now known as the constructor function, will automatically have attached to them. Now we start getting to things that are a little bit truly extending what this function object combo does.

[00:12:30]
These are actually new things added to function object combos known as classes that are not native to function objects in JavaScript. These were added recently in 2022, and these actually do change some stuff under the hood. So, we'll keep our, well, let's get rid of our describe, I just want to keep adding more code, let's get rid of our describe, we know that one now. And by the way, this stuff is extension people, we already have the map of class, but this stuff is extension, I want to add some new pieces.

[00:13:15]
What happens in our UserCreator declaration as a class, otherwise known as function object combo, what happens when we see this loggedIn is false. This is going to save onto our function object a new hidden property called fields into which we can store things that we want to have added to every object that gets returned out. In fact, when we call UserCreator, we'll do in a second, we're going to have this.name is the argument name, this.score is the argument score, and automatically inserted, we're going to have this.loggedIn is the value false.

[00:13:56]
OK, so we have a new. Now this starts to feel, I mean there's still, as you can tell, really having to hack it by adding new hidden properties, but now we have stuff that we know when we call the UserCreator function in its function object combo, known as a class. When we run the function, and with a new keyword, still need a new keyword, we get that auto-created object, it's not only going to get name and score added to it because of the work we do there, it's automatically going to insert another line.

[00:14:24]
So now let's do this one fully. I'm really impressed you're going this far, we've never gone this far before in Hard Parts. This is into new features only released in the last couple of years, so this is the new stuff that we're all, I'm very, you know, impressed, and I'm sure JavaScript's creators are delighted that we're doing. They're so proud, they put in all these new features to one day live up to their training in C++ and Java that they've been frustrated that they've never been able to put to good use.