Check out a free preview of the full Professional JS: Features You Need to Know course

The "Class Syntax" Lesson is part of the full, Professional JS: Features You Need to Know course featured in this preview video. Here's what you'd learn in this lesson:

Maximiliano introduces the concept of class syntax in JavaScript. He explains how to define a class, create constructors, use getters and setters, and create subclasses. He also demonstrates how to access properties and methods of a class instance.

Preview
Close

Transcript from the "Class Syntax" Lesson

[00:00:00]
>> Maximiliano Firtman: Let's jump into the next one, class syntax, also, you can also click here Next to go to the next one. Again, I'm not going to explain all the OOP basic details here, but just to give a quick recap of where we are because then we will start adding new features that appear in the language in the last years.

[00:00:20]
So, if you run this, it's going to show you this, but let's try to understand what's going on. It's a class person. Okay, that has a constructor. You use the constructor keyword in JavaScript. And then by the way, can you create another constructor question for you? Can I create another constructor with less arguments?

[00:00:41]
Something like this in JavaScript.
>> Speaker 2: I have to [INAUDIBLE] but I've never tried.
>> Maximiliano Firtman: You never try. Well, actually, the answer is no, I cannot do that in JavaScript, why? Because we don't have function overload in JavaScript, because actually arguments are kind of not there. So, I mean they are there, but actually arguments are always, unless you're using error functions, are always, like a sure syntax, choose the arguments array.

[00:01:13]
So you can always say instead of this, here are arguments of zero and arguments of one. I'm not sure if you know that in JavaScript. So when you create arguments, they are just aliases to the arguments array in a normal function, not arrow function. But anyway, that's why there is no function overload.

[00:01:37]
That is something that is available in other languages because it's the same function. It doesn't matter how many arguments do you have, it's the constructor. And it's not just for constructor, it works also with other, the same idea works with normal methods or functions anyway. So that means that you will always have only one constructor.

[00:01:59]
And if you wanna receive different kind of arguments, you need to deal with the arguments and the type of the arguments, or do something that using the rest operator, things like that. And we will see that in a second anyway. So a class can contain getters and setters, not sure if you have used that.

[00:02:21]
For example, here we are creating an info property. Do I need to declare the info property somewhere? No, not in ecmascript6 at least. You should define that it's a property because we have the get prefix or the set prefix. The name of the function is the name of the property.

[00:02:43]
Okay, makes sense. Then we have methods, instance methods. They don't have the function, keyword. It's just the same without the function keyword. And then I can create a subclass, in this case an employee extending from person and this constructor can call the super constructor. Okay, and you can override a method.

[00:03:08]
There is no need for defining that this greet method is overriding the superclass. It has the same name. It's overriding it. Actually, it has to do with it prototype chain, something more advanced that we're not going to get into there today, but JavaScript is a very flexible language compared with other OOP languages.

[00:03:33]
So that's why we can do that. And now we can create a person and you can see here that we can do console log of person.info. And info is not really a variable, it's a property, so it's actually going to execute the getter, get info.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now