¿Cómo extender una clase sin tener que usar super en ES6?

¿Es posible extender una clase en ES6 sin llamar al supermétodo para invocar la clase principal?

EDITAR: La pregunta puede ser engañosa. ¿Es el estándar al que tenemos que llamar super()o me falta algo?

Por ejemplo:

class Character {
   constructor(){
      console.log('invoke character');
   }
}

class Hero extends Character{
  constructor(){
      super(); // exception thrown here when not called
      console.log('invoke hero');
  }
}

var hero = new Hero();

Cuando no llamo super()a la clase derivada, tengo un problema de alcance ->this is not defined

Estoy ejecutando esto con iojs --harmony en v2.3.0

Las reglas para las clases de ES2015 (ES6) básicamente se reducen a:

1. En un constructor de clases secundarias, thisno se puede usar hasta que superse llame.
2. Los constructores de la clase ES6 DEBEN llamar supersi son subclases, o deben devolver explícitamente algún objeto para tomar el lugar del que no se inicializó.

Esto se reduce a dos secciones importantes de la especificación ES2015.

La sección 8.1.1.3.4 define la lógica para decidir qué thishay en la función. La parte importante para las clases es que es posible thisestar en un "uninitialized"estado, y cuando se está en este estado, intentar usar thisarrojará una excepción.

Sección 9.2.2 , [[Construct]]que define el comportamiento de funciones llamadas vía newo super. Cuando se llama a un constructor de clase base, thisse inicializa en el paso # 8 de [[Construct]], pero para todos los demás casos, thisno se inicializa. Al final de la construcción, GetThisBindingse llama, por lo que si superaún no se ha llamado (por lo tanto, se está inicializando this), o no se ha devuelto un objeto de reemplazo explícito, la línea final de la llamada al constructor arrojará una excepción.

Ha habido múltiples respuestas y comentarios indicando que super DEBE ser la primera línea adentro constructor. Eso es simplemente incorrecto. La respuesta de @loganfsmyth tiene las referencias requeridas de los requisitos, pero se reduce a:

El extendsconstructor Inheriting ( ) debe llamar superantes de usar thisy antes de regresar, incluso si thisno se usa

Vea el fragmento a continuación (funciona en Chrome ...) para ver por qué podría tener sentido tener declaraciones (sin usar this) antes de llamar super.

'use strict';
var id = 1;
function idgen() {
  return 'ID:' + id++;
}

class Base {
  constructor(id) {
    this.id = id;
  }

  toString() { return JSON.stringify(this); }
}

class Derived1 extends Base {
  constructor() {
    var anID = idgen() + ':Derived1';
    super(anID);
    this.derivedProp = this.baseProp * 2;
  }
}

alert(new Derived1());

La nueva sintaxis de la clase es6 es sólo otra notación para las "viejas" clases "es5" con prototipos. Por lo tanto, no puede crear una instancia de una clase específica sin establecer su prototipo (la clase base).

Eso es como poner queso en tu sándwich sin hacerlo. Además, no puedes poner queso antes de hacer el sándwich, así que ...

... tampoco se permite usar una thispalabra clave antes de llamar a la superclase con super().

// valid: Add cheese after making the sandwich
class CheeseSandwich extend Sandwich {
    constructor() {
        super();
        this.supplement = "Cheese";
    }
}

// invalid: Add cheese before making sandwich
class CheeseSandwich extend Sandwich {
    constructor() {
        this.supplement = "Cheese";
        super();
    }
}

// invalid: Add cheese without making sandwich
class CheeseSandwich extend Sandwich {
    constructor() {
        this.supplement = "Cheese";
    }
}

Si no especifica un constructor para una clase base, se usa la siguiente definición:

constructor() {}

Para las clases derivadas, se utiliza el siguiente constructor predeterminado:

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

EDITAR: Encontré esto en developer.mozilla.org:

When used in a constructor, the super keyword appears alone and must be used before the this keyword can be used.

Fuente

Me acabo de registrar para publicar esta solución, ya que las respuestas aquí no me satisfacen en lo más mínimo, ya que en realidad hay una forma simple de evitar esto. Ajuste su patrón de creación de clases para sobrescribir su lógica en un submétodo mientras usa solo el superconstructor y le envía los argumentos del constructor.

Como en, no crea un constructor en sus subclases per se, sino solo una referencia a un método que se reemplaza en la subclase respectiva.

Eso significa que se libera de la funcionalidad de constructor que se le impone y se abstiene de usar un método regular , que puede ser anulado y no impone super () si se permite elegir si, dónde y cómo desea llamar a super (completamente opcional) por ejemplo:

super.ObjectConstructor(...)

class Observable {
  constructor() {
    return this.ObjectConstructor(arguments);
  }

  ObjectConstructor(defaultValue, options) {
    this.obj = { type: "Observable" };
    console.log("Observable ObjectConstructor called with arguments: ", arguments);
    console.log("obj is:", this.obj);
    return this.obj;
  }
}

class ArrayObservable extends Observable {
  ObjectConstructor(defaultValue, options, someMoreOptions) {
    this.obj = { type: "ArrayObservable" };
    console.log("ArrayObservable ObjectConstructor called with arguments: ", arguments);
    console.log("obj is:", this.obj);
    return this.obj;
  }
}

class DomainObservable extends ArrayObservable {
  ObjectConstructor(defaultValue, domainName, options, dependent1, dependent2) {
    this.obj = super.ObjectConstructor(defaultValue, options);
    console.log("DomainObservable ObjectConstructor called with arguments: ", arguments);
    console.log("obj is:", this.obj);
    return this.obj;
  }
}

var myBasicObservable = new Observable("Basic Value", "Basic Options");
var myArrayObservable = new ArrayObservable("Array Value", "Array Options", "Some More Array Options");
var myDomainObservable = new DomainObservable("Domain Value", "Domain Name", "Domain Options", "Dependency A", "Depenency B");

¡salud!

Puede omitir super () en su subclase, si omite el constructor por completo en su subclase. Un constructor predeterminado 'oculto' se incluirá automáticamente en su subclase. Sin embargo, si incluye el constructor en su subclase, debe llamarse super () en ese constructor.

class A{
   constructor(){
      this.name = 'hello';   
   }
}
class B extends A{
   constructor(){
      // console.log(this.name); // ReferenceError
      super();
      console.log(this.name);
   }
}
class C extends B{}  // see? no super(). no constructor()

var x = new B; // hello
var y = new C; // hello

Lea esto para obtener más información.

La respuesta con justyourimage es la forma más fácil, pero su ejemplo es un poco hinchado. Aquí está la versión genérica:

class Base {
    constructor(){
        return this._constructor(...arguments);
    }

    _constructor(){
        // just use this as the constructor, no super() restrictions
    }
}

class Ext extends Base {
    _constructor(){ // _constructor is automatically called, like the real constructor
        this.is = "easy"; // no need to call super();
    }
}

No extiendas lo real constructor(), solo usa lo falso _constructor()para la lógica de creación de instancias.

Tenga en cuenta que esta solución hace que la depuración sea molesta porque debe ingresar a un método adicional para cada instanciación.

Tratar:

class Character {
   constructor(){
     if(Object.getPrototypeOf(this) === Character.prototype){
       console.log('invoke character');
     }
   }
}


class Hero extends Character{
  constructor(){
      super(); // throws exception when not called
      console.log('invoke hero');
  }
}
var hero = new Hero();

console.log('now let\'s invoke Character');
var char = new Character();

Demo

Recomendaría usar OODK-JS si tiene la intención de desarrollar los siguientes conceptos de programación orientada a objetos.

OODK(function($, _){

var Character  = $.class(function ($, µ, _){

   $.public(function __initialize(){
      $.log('invoke character');
   });
});

var Hero = $.extends(Character).class(function ($, µ, _){

  $.public(function __initialize(){
      $.super.__initialize();
      $.log('invoke hero');
  });
});

var hero = $.new(Hero);
});

Solución simple: creo que está claro que no hay necesidad de explicación.

class ParentClass() {
    constructor(skipConstructor = false) { // default value is false
        if(skipConstructor) return;
        // code here only gets executed when 'super()' is called with false
    }
}
class SubClass extends ParentClass {
    constructor() {
        super(true) // true for skipping ParentClass's constructor.
        // code
    }
}

@Bergi mencionó new.target.prototype, pero estaba buscando un ejemplo concreto que demuestre que puede acceder this(o mejor, la referencia al objeto con el que está creando el código del cliente new, ver más abajo) sin tener que llamar super()en absoluto.

Hablar es barato, enséñame el código ... Así que aquí tienes un ejemplo:

class A { // Parent
    constructor() {
        this.a = 123;
    }

    parentMethod() {
        console.log("parentMethod()");
    }
}

class B extends A { // Child
    constructor() {
        var obj = Object.create(new.target.prototype)
        // You can interact with obj, which is effectively your `this` here, before returning
        // it to the caller.
        return obj;
    }

    childMethod(obj) {
        console.log('childMethod()');
        console.log('this === obj ?', this === obj)
        console.log('obj instanceof A ?', obj instanceof A);
        console.log('obj instanceof B ?',  obj instanceof B);
    }
}

b = new B()
b.parentMethod()
b.childMethod(b)

Que dará como resultado:

parentMethod()
childMethod()
this === obj ? true
obj instanceof A ? true
obj instanceof B ? true

Entonces, puede ver que estamos creando efectivamente un objeto de tipo B(la clase secundaria) que también es un objeto de tipo A(su clase principal) y dentro childMethod()del elemento secundario Btenemos thisapuntando al objeto objque creamos en B constructorcon Object.create(new.target.prototype).

Y todo esto sin importarle supernada.

Esto aprovecha el hecho de que en JS a constructorpuede devolver un objeto completamente diferente cuando el código del cliente construye una nueva instancia con new.

Espero que esto ayude a alguien.