W3cubDocs

/JavaScript

constructor

The constructor method is a special method for creating and initializing an object created within a class.

Syntax

constructor([arguments]) { ... }

Description

There can be only one special method with the name "constructor" in a class. Having more than one occurrence of a constructor method in a class will throw a SyntaxError error.

A constructor can use the super keyword to call the constructor of a parent class.

If you do not specify a constructor method, a default constructor is used.

Examples

Using the constructor method

This code snippet is taken from the classes sample (live demo).

class Square extends Polygon {
  constructor(length) {
    // Here, it calls the parent class' constructor with lengths
    // provided for the Polygon's width and height
    super(length, length);
    // Note: In derived classes, super() must be called before you
    // can use 'this'. Leaving this out will cause a reference error.
    this.name = 'Square';
  }

  get area() {
    return this.height * this.width;
  }

  set area(value) {
    this.area = value;
  } 
}

Another example

Take a look at this code snippet

class Polygon {
    constructor() {
        this.name = "Polygon";
    }
}

class Square extends Polygon {
    constructor() {
        super();
    }
}

class Rectangle {}

Object.setPrototypeOf(Square.prototype, Rectangle.prototype);

console.log(Object.getPrototypeOf(Square.prototype) === Polygon.prototype); //false
console.log(Object.getPrototypeOf(Square.prototype) === Rectangle.prototype); //true

let newInstance = new Square();
console.log(newInstance.name); //Polygon

Here the prototype of Square class is changed but still the constructor of the previous base class Polygon is called when a new instance of a square is being created.

Default constructors

As stated, if you do not specify a constructor method a default constructor is used. For base classes the default constructor is:

constructor() {}

For derived classes, the default constructor is:

constructor(...args) {
  super(...args);
}

Specifications

Browser compatibilityUpdate compatibility data on GitHub

Desktop
Chrome Edge Firefox Internet Explorer Opera Safari
Basic support 49
49
From Chrome 42 to 48 strict mode is required. Non-strict mode support can be enabled using the flag "Enable Experimental JavaScript".
13 45 No 36 9
Mobile
Android webview Chrome for Android Edge Mobile Firefox for Android Opera for Android iOS Safari Samsung Internet
Basic support ? Yes 13 45 ? 9 Yes
Server
Node.js
Basic support 6.0.0
6.0.0
4.0.0
Disabled
Disabled From version 4.0.0: this feature is behind the --use_strict runtime flag.
5.0.0
Disabled
Disabled From version 5.0.0: this feature is behind the --harmony runtime flag.

See also

© 2005–2018 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/constructor