class Keyword

Site: Saylor Academy
Course: PRDV401: Introduction to JavaScript I
Book: class Keyword
Printed by: Guest user
Date: Saturday, May 18, 2024, 9:57 PM

class Keyword

The class declaration creates a new class with a given name using prototype-based inheritance.

Try It

Click here to try an example using Code Runner.

Syntax

class name [extends otherName] {
  // class body
}

Description

The class body of a class declaration is executed in strict mode. The constructor method is optional.

Class declarations are not hoisted (unlike function declarations).

Examples

A simple class declaration

In the following example, we first define a class named Rectangle, then extend it to create a class named FilledRectangle.

Note that super(), used in the constructor, can only be used in constructors, and must be called before the this keyword can be used.

class Rectangle {
  constructor(height, width) {
    this.name = 'Rectangle';
    this.height = height;
    this.width = width;
  }
}

class FilledRectangle extends Rectangle {
  constructor(height, width, color) {
    super(height, width);
    this.name = 'Filled rectangle';
    this.color = color;
  }
}


Attempting to declare a class twice

Re-declaring a class using the class declaration throws a SyntaxError.

class Foo {};
class Foo {}; // Uncaught SyntaxError: Identifier 'Foo' has already been declared

The same error is thrown when a class has been defined before using the class expression.

let Foo = class {};
class Foo {}; // Uncaught SyntaxError: Identifier 'Foo' has already been declared