Babel ES6-Klasse mit Standard destructured Parameter sind nicht definiert

Question

ich eine ES6-Klasse mit Standardparameter wie folgt:

constructor({ 
    // defaults 
    defaultOne  = 'default value one', 
    defaultTwo  = ['default','value','two], 
    defaultThree = 'default value three, 
}) { 
    this.defaultOne = defaultOne 
    this.defaultTwo = defaultTwo 
    this.defaultThree = defaultThree 

    return this 
} 

Wenn ich eine Instanz der Klasse erstellen Sie es wie erwartet funktioniert, wenn ich Werte liefern.

new Class({defaultOne: 'one',defaultTwo: ['t','w','o'], defaultThree: 'three'}) 

Aber wenn ich eine Instanz ohne Werte instanziiert:

new Class() 

Es wirft einen undefinierten Fehler. Dieser Ansatz scheint mit Standardfunktionsdeklarationen/-ausdrücken gut zu funktionieren. Irgendeine Idee, was ich hier vermisse?

Vielen Dank im Voraus für jede Hilfe zu diesem Thema.

Answer 1

Es ist zwar nicht die Spezifikation scheint erlaubt Ihnen, eine Klasse Argumente direkt dekonstruieren, bietet diese Lösung eine sehr ähnliche Syntax:

class Test { 
    constructor(options) { 
     let { 
     defaultOne : defaultOne = 'default one value', 
     defaultTwo : defaultTwo = 'default two value', 
     defaultThree : defaultThree = 'default three value' 
     } = (options) ? options:{}; 

     this.defaultOne = defaultOne; 
     this.defaultTwo = defaultTwo; 
     this.defaultThree = defaultThree; 

     this.init(); 
    } 

    init() { 
    console.log(this.defaultOne); 
    console.log(this.defaultTwo); 
    console.log(this.defaultThree); 
    } 
} 

new Test({defaultOne: 'Override default one value'}); 
new Test(); 

ES6 Babel test

Compiled Babel ES5

Answer 2

Ich stimme es ist etwas hässlich, aber es passiert, weil babel transpiles zu etwas wie:

constructor(_ref) { 
    var _defaultOne = _ref.defaultOne; // « this is where it goes wrong. _ref = undefined 
} 

Sie legen Standardeinstellungen für die Objekteigenschaften fest, aber keine Standardeinstellungen für das Objekt selbst. Das ist also fixierbar. Es wäre schön, wenn Babel das für uns machen würde, aber das tut es nicht.

Um dies zu beheben, einen Standard für das Objekt Argument liefern, statt:

// es6 
const foo = ({ bar = 'baz' }) => {}; 

// transpiled 
var foo = function foo(_ref) { 
    var _ref$bar = _ref.bar; 
    var bar = _ref$bar === undefined ? 'baz' : _ref$bar; 
}; 

Sie müssen schreiben

// es6 
const foo = ({ bar = 'baz'} = {}) => {}; 

// transpiled 
var foo = function foo() { 
    var _ref = arguments.length <= 0 || arguments[0] === undefined ? {} : arguments[0]; 

    var _ref$bar = _ref.bar; 
    var bar = _ref$bar === undefined ? 'baz' : _ref$bar; 
}; 

Um vollständig zu sein, würde Ihr Beispiel werden:

constructor({ 
    // defaults 
    defaultOne  = 'default value one', 
    defaultTwo  = ['default','value','two'], 
    defaultThree = 'default value three', 
} = {}) { // « notice the change on this line 
    this.defaultOne = defaultOne 
    this.defaultTwo = defaultTwo 
    this.defaultThree = defaultThree 
} 

new Class({defaultOne: 'one',defaultTwo: ['t','w','o'], defaultThree: 'three'}) 
new Class()