logo

NJP

Classes - Let's Learn ECMAScript 2021 with Earl Duque

Import · Jan 25, 2024 · video

Okay, so this one's an important one. It is about JavaScript classes. JavaScript classes were introduced in ES6,
so back in 2015. They provide a clear syntax
for creating objects, and they are all about handling
inheritance correctly. They have constructors for initializing
the state of them. They have methods
for adding functionality. They have inheritance mechanisms. It's just generally classes
make it easier for us to build scalable and organized code. So the basic class structure
looks like this. So you're going to say class and
then you can name it whatever you want. So I'm going to name this one incident. I'm going to make a new incident class. And from there, we want to say,
how are we constructing it? And we're going to construct it
via two parameters. One is the ID and one is the description. This is what I'm determining. And then in that the this ID is based off of the ID and then the this description is based off
a description. You can see that I'm intentionally
building the actual structure of the class. And then next I'm going to go ahead
and add a function to this class. and I'm going to add a log statement,
and this one is going to simply say what the ID and description is. I'm going to go ahead
and close that class out. And then now in my actual script, I'm going to say I have a new incident. And how that works is I actually say new incident. I'm going to say incident 001. And the description is a login failure. So notice that this is similar to a script includes that you are probably familiar
with within ServiceNow. Script includes is very much like this. We're creating classes. But this time I am creating
that class on my own within my own script in a way
where I can quickly expand on this and I can quickly add to my class
as I see fit. So it keeps things very scalable,
keeps things organized. And I know that within this instantiation of my incident class,
I know what's available to it, and I know what I have access to, etc.. yeah. Access. Perfect. So I got to make sure I say this inside
of these template literals. So let's go ahead and call this. We're going to say incident.logDetails
and let's run the script. There you go. Exactly what I expected. And I created that class entirely. All right.
So let's dive in a little bit more. One of the powerful things about classes
is its idea of inheritance and how you can extend classes
into other classes. So I'm going to keep my incident class and I'm going to create a new class called SecurityIncident. And instead of building
an entirely new class, I know security incidents include all the things
that are already in incident. So what I'm going to do
is simply say, I'm extending the incident. So in this
class, I still need to do a constructor. But in this one
I not only have ID and description, but I also have security level. And then from there, if I want to inherit my constructors from my parent class,
I use this keyword called Super. I'm going to pass it in the variables
that I want to inherit through. And then I need to set my new one security level as securityLevel. From there, I'm going to add a new function called logSecurityDetails. And this one I'm going to copy the previous one, but then add an additional item that says this.securityLevel. Now, let's go ahead and create
a new security incident. new SecurityIncident and pass it
in all of my parameters: INC002, unauthorized access. And the security level is high. And let's go ahead and call that log function. logSecurityDetails and run it. I think I said extends earlier. It's extends not extend. Okay.
And there we go. Ran the new log statement
and it provided the security level. The fun part is because I extended the
previous class, I can actually go ahead and use all of the functionality
from that previous class, too. So if I change the logSecurityDetails
to the original one logDetails, it's the same thing. And it still runs. I still had access to all of the previous
class functionality. Classes is very classy.

View original source

https://www.youtube.com/watch?v=gRxRgAAXh8c