The class declaration creates a new class with a given name using prototype-based inheritance.
You can also define a class using a class expression. But unlike a class expression, a class declaration doesn't allow an existing class to be declared again and will throw a SyntaxError
if attempted.
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 Polygon
, then extend it to create a class named Square
.
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 Polygon { constructor(height, width) { this.name = 'Polygon'; this.height = height; this.width = width; } } class Square extends Polygon { constructor(length) { super(length, length); this.name = 'Square'; } }
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
Specifications
Specification |
---|
ECMAScript (ECMA-262) The definition of 'Class definitions' in that specification. |
Browser compatibility
Desktop | Mobile | Server | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|
class | Chrome
Full support
49
| Edge Full support 13 | Firefox Full support 45 | IE No support No | Opera
Full support
36
| Safari Full support 10.1 | WebView Android
Full support
49
| Chrome Android
Full support
49
| Firefox Android Full support 45 | Opera Android
Full support
36
| Safari iOS Full support 10.3 | Samsung Internet Android
Full support
5.0
| nodejs Full support 6.0.0 |
Legend
- Full support
- Full support
- No support
- No support
- See implementation notes.
- See implementation notes.
- User must explicitly enable this feature.
- User must explicitly enable this feature.