ES6解构函数参数 - 命名根对象

Question

有没有办法保留析构函数参数的名称？即,根对象的名称？

在ES5中,我可能会这样做(使用继承作为隐喻来说明问题):

// 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
};

我使用相同的options对象来保存多个配置参数.一些参数由父类使用,一些参数由子类使用.

有没有办法在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?
};

或者我是否需要提取所有选项setupChildClass6()以便可以单独传递setupParentClass6()？

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

Answer 1

我自己在很多地方都有'选项'论点.我会选择额外的一行代码.在这个例子中不值得,但在更多线路上进行解构时是一个很好的解决方案.

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

Answer 2

您不能直接在参数中执行此操作,但您可以在以后提取值:

function myFun(allVals) {
    const { val1, val2, val3 } = allVals;
    console.log("easy access to individual entries:", val2);
    console.log("easy access to all entries:", allVals);
}

Answer 3

您不能同时对同一参数使用解构和简单命名位置参数.你可以做什么:

1. 使用解构setupParentClass6功能,但旧的ES6方法setupChildClass6(我认为这是最好的选择,只是缩短名称):

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

2. 使用旧arguments对象.但是arguments可以减慢功能(特别是V8),所以我认为这是一个糟糕的方法:

   var setupChildClass6 = ({minVal, maxVal}) => {
     rangeSlider.setup(minVal, maxVal);
     setupParentClass6(arguments[0]); 
   };
   

3. ES7提出了休息/传播属性的建议(如果你不需要minVal和maxVal在setupParentCalss6功能上):

   var setupChildClass6b = ({minVal, maxVal, ...rest}) => {
     rangeSlider.setup(minVal, maxVal);
     setupParentClass6(rest);
   };
   

   不幸的是,它不是ES6.