What is class in JavaScript full explain?

0 votes
29 views
Ravi Vishwakarma asked 13 days ago in Web Application by Ravi Vishwakarma

What is class in JavaScript full explain?    

1 Answer

0 votes
Ethan Karla answered 11 days ago by Ethan Karla
Classes are a template for creating objects. They encapsulate data with code to work on that data. Classes in JS are built on prototypes. Classes are in fact 'special functions', and just as you can define function expressions and function declarations.
Syntax
 class class-name [ extends other class] {
  //public or private fields
  // constructor
  //get and set property
  //function
 }
There are two way defining the class.
Class declarations
One way to define a class is using a class declaration. To declare a class, you use the class keyword with the name of the class ('Rectangle' here).
class Rectangle {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }
}
Class expressions
A class expression is another way to define a class. Class expressions can be named or unnamed. The name given to a named class expression is local to the class's body. However,
it can be accessed via the name property.
// unnamed class 
let Rectangle = class {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }
};console.log(Rectangle.name);
Constructor
The constructor method is a special method for creating and initializing an object created with a class. There can only be one special method with the name 'constructor' in a class. A SyntaxError will be thrown if the class contains more than one occurrence of a constructor method.
A constructor can use the super keyword to call the constructor of the super class.
class Rectangle {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }

  // Getter property
  get area() {
    return this.calcArea();
  }
  // Method
  calcArea() {
    return this.height * this.width;
  }
}
const square = new Rectangle(10, 10);
console.log(square.area);
Field declarations
Public field declarations
With the JavaScript field declaration syntax, the above example can be written as:
class Rectangle {
  height = 0;
  width;
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }
}
Private field declarations
Using private fields, the definition can be refined as below.
class Rectangle {
  #height = 0;
  #width;
  constructor(height, width) {
    this.#height = height;
    this.#width = width;
  }
}
Extend the super class
The extends keyword is used in class declarations or class expressions to create a class as a child of another class.
class Animal {
  constructor(name) {
    this.name = name;
  }
  speak() {
    console.log(`${this.name} makes a noise.`);
  }
}
class Cat extends Animal {
  constructor(name) {
    super(name); // call the super class constructor and pass in the name parameter
  }
  speak() {
    console.log(`${this.name} barks.`);
  }
}
let d = new Cat('Meow');
d.speak();