Classes were introduced in JS with ES6. They function the same as object constructors and prototypes.
Classes : Java vs JavaScript
Unlike the classes in Java with special mechanisms…
public class player
{
private String name;
private String job;
//other instance variables
public player(String name, String job /*other parameters*/)
{
this.name = name;
this.job = job;
}
public void playerInfo()
{
//definition goes here
}
}
Classes in JS are just a function [almost everything in this beautiful language is a function for some reason].
class Player
{
constructor(playerName, playerJob, /*other parameters*/)
{
this.playerName = playerName;
this.playerJob = playerJob;
//other properties
}
playerInfo()
{
//method definition goes here
}
}
We can verify our previous claim of classes being a function with this :
alert(typeof Player); //function
class Player
creates a function named Player
, whose code is derived from the constructor method.
The other class methods such as playerInfo()
are stored in the Player.prototype
so that when an object is created and a method is called using it, it is obtained from the Player.prototype
.
Then why not use an object constructor and be done with it?
There are a couple of reasons why classes were introduced by ES6. Here’s why :
A function created by class
[defining a class] is labelled by a property called [[IsClassConstructor]]: true
.
Its string representation is different from that of object constructors :
console.log(Player); //[class Player]
console.log(PlayerAlt); //[Function: PlayerAlt]
Class declaration can only be invoked using new
.
And many more.
Creating objects
After defining a class like the above one, we create an object and use methods with it :
let pOne = new Player("Jean Antonique", "Ranger", /*other args*/);
pOne.playerInfo(); //prints player info
Getters and setters
Getters are methods that return a value of the object. Setters are methods that set a value of the object to something else.
class Player
{
constructor(playerName, playerJob /*parameters*/)
{
this.playerName = playerName;
this.playerJob = playerJob;
//other properties
}
getName()
{
return this.playerName;
}
setName(newName)
{
this.playerName = newName;
}
}
Class expression
Just like functions, classes can be defined in a variable, passed as argument, returned, etc.
let Player = class
{
//definition
}
function makePlayerClass(details)
{
return class
{
playerInfo(details)
{
console.log(details);
}
}
}
let player = makePlayerClass(details);
new player().playerInfo();
extends
extends
is used to create a class which is the child of another pre-existing class. To put it shortly, it allows a class to extend a new class, just like an octopus extends its tentacles.
class playerInjuries extends Player
{
//definition
}
Private properties
Now JS has a feature similar to private
instance variables in Java.
class Player
{
#playerInfectionPercentage = 10.00;
#playerFullyInfected()
{
if (#playerInfectionPercentage==100.00)
{
#endGame("Infected");
}
}
}