Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/apache-flex/4.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript ES6解构函数参数-命名根对象_Javascript_Function_Arguments_Ecmascript 6_Destructuring - Fatal编程技术网

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

Javascript ES6解构函数参数-命名根对象,javascript,function,arguments,ecmascript-6,destructuring,Javascript,Function,Arguments,Ecmascript 6,Destructuring,有没有办法保留解构函数参数的名称?例如,根对象的名称 在ES5中,我可能会这样做(使用继承作为隐喻来说明这一点): 或者我是否需要提取setupChildClass6()中的所有选项,以便将它们分别传递到setupParentClass6() 不能同时对同一参数使用解构和简单命名位置参数。您可以做什么: 对setupParentClass6函数使用解构,但对setupChildClass6使用旧的ES6方法(我认为这是最好的选择,只需缩短名称): 使用旧的参数对象。但是参数会减慢函数的速度(特

有没有办法保留解构函数参数的名称?例如,根对象的名称

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

或者我是否需要提取
setupChildClass6()
中的所有选项,以便将它们分别传递到
setupParentClass6()


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

  • setupParentClass6
    函数使用解构,但对
    setupChildClass6
    使用旧的ES6方法(我认为这是最好的选择,只需缩短名称):

  • 使用旧的
    参数
    对象。但是
    参数
    会减慢函数的速度(特别是V8),因此我认为这是一种不好的方法:

    var setupChildClass6 = ({minVal, maxVal}) => {
      rangeSlider.setup(minVal, maxVal);
      setupParentClass6(arguments[0]); 
    };
    
  • ES7建议(如果您不需要
    setupparentalss6
    功能中的
    minVal
    maxVal
    ):

    不幸的是,它不是ES6


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

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

    我自己在很多地方都有“选项”的论点。我会选择额外的一行代码。在本例中不值得,但在更多行上进行分解时,这是一个很好的解决方案

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

    这是我能想到的最好的了。不太好,但比在另一条线上进行破坏要好得多。它在某种程度上也给了您一个提示,您将首先提供
    选项
    ,并且您将在函数中对其进行解构

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

    谢谢,非常有帮助。实际上#2最接近目的,考虑到函数的使用方式,减速将不相关。目前,我正在使用Babel,因此它可能很快就会获得对象的rest属性。如#2所示,
    参数的使用实际上并不缓慢。但我认为它是不可读的。REST属性可能无法解决您的问题,因为它确实使用<代码> MyValu< /Calp>和 Max Value>代码> > <代码>选项>代码>对象。当心。你能详细说明一下为什么使用参数会降低函数的速度以及降低多少速度吗?如果我在arrow函数中使用方法2,我会得到“参数未定义”我认为你不能在arrow函数中使用
    参数,可以吗?
    参数[0]
    可以,但不行,你不能在解构的同时命名它们。要命名中间对象,请看,甚至更好,你可以在这里使用
    const
    :)哦,但这可能取决于他想用它们做什么,你不认为吗?有很多人认为
    const
    应该是默认值。当然,如果您希望重新分配,您需要
    let
    .tl;可怜的智商博士。这种方法的问题是,在使用MyFun时,您不会有任何关于allVals结构的指示,这是真的。如果您担心这一点,可以添加JSDoc。或者你可以做相反的事情(先解构参数,然后再在下面重新构造它们),但这会更详细一些,你必须重复每个变量两次。同意——这也是我一直在使用的。在过去的几个月里,我们都学会了更好地使用es6!谢谢早在ES6的早期,在我们休息和传播之前,我就写了我的原始问题。现在我们这样做了,我用上面Alex给出的答案的风格编写代码(示例3)
    var setupChildClass6 = ({minVal, maxVal}) => {
      rangeSlider.setup(minVal, maxVal);
      setupParentClass6(arguments[0]); 
    };
    
    var setupChildClass6b = ({minVal, maxVal, ...rest}) => {
      rangeSlider.setup(minVal, maxVal);
      setupParentClass6(rest);
    };
    
    function myFun(allVals) {
        const { val1, val2, val3 } = allVals;
        console.log("easy access to individual entries:", val2);
        console.log("easy access to all entries:", allVals);
    }
    
    const setupChildClass6 = options => {
        const {minVal, maxVal} = options;
        rangeSlider.setup(minVal, maxVal);
        setupParentClass6(options); 
    };
    
    var setupParentClass6 = options => (({rows, columns}) => {
        textEditor.setup(rows, columns);
    })(options);
    
    var setupChildClass6 = options => (({minVal, maxVal}) => {
        rangeSlider.setup(minVal, maxVal);
        setupParentClass6(options);
    })(options);