jbx jbx - 24 days ago 10
Javascript Question

ES6 destructuring function parameter - naming root object

Is there a way to retain the name of a destructured function argument? I.e., the name of the root object?

In ES5, I might do this (using inheritance as a metaphor to make the point):

// ES5:
var setupParentClass5 = function(options) {
textEditor.setup(options.rows, options.columns);
};

var setupChildClass5 = function(options) {
rangeSlider.setup(options.minVal, options.maxVal);
setupParentClass5(options); // <= we pass the options object UP
};


I'm using the same
options
object to hold multiple configuration parameters. Some parameters are used by the parent class, and some are used by the subclass.

Is there a way to do this with destructured function arguments in ES6?

// ES6:
var setupParentClass6 = ({rows, columns}) => {
textEditor.setup(rows, columns);
};

var setupChildClass6 = ({minVal, maxVal}) => {
rangeSlider.setup(minVal, maxVal);
setupParentClass6( /* ??? */ ); // how to pass the root options object?
};


Or do I need to extract all of the options in
setupChildClass6()
so that they can be individually passed into
setupParentClass6()
?

// ugh.
var setupChildClass6b = ({minVal, maxVal, rows, columns}) => {
rangeSlider.setup(minVal, maxVal);
setupParentClass6({rows, columns});
};

Answer

I have the 'options' arguments on too many places myself. I would opt for 1 extra line of code. Not worthy in this example, but a good solution when having destructuring on more lines.

var setupChildClass6 = (options) => {
    var {minVal, maxVal} = options;
    rangeSlider.setup(minVal, maxVal);
    setupParentClass6(options); 
};