ES6 JS中的传播语法如何作为函数参数工作? [英] How does the spread syntax in ES6 JS work as a function argument?

查看:181
本文介绍了ES6 JS中的传播语法如何作为函数参数工作?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

好的,所以我试图了解新的价差如何作为函数参数工作.想象一下一个带有未知数量参数的函数,并将它们全部加在一起.

OK, so I'm trying to understand how the new spread works as a function parameter. Imagine a function with an unknown number of parameters and adds them all together.

let addNums = ...a => a.reduce ((a,b) => a+b);

此功能显然有效.那我有什么问题好吧,这里有一些观察,然后是我的问题:

This function obviously works. So, what's my problem? Well here's some observations, followed by my problem:

  1. 作为函数参数/参数的传播语法似乎旨在将值数组传播"为单独的参数:

根据我所做的研究,可以使用传播语法将数组传递给不接受数组作为标准参数的函数,例如Array.prototype.push(),而不必使用apply:

Based on the research I've done, the spread syntax can be used to pass arrays to functions that will not accept arrays as arguments as standard, e.g. Array.prototype.push(), without having to use apply:

var x = [];
var y = [1,2,3];
// where Array.push(arg1,arg2,...) requires separate arguments this is now possible:
x.push(...y);
// which 'spreads' 'y' into separate arguments: x.push (arg1,arg2,...)

,但是在这种情况下传递给push的数组需要事先声明/定义(在这种情况下为y)

but the Array passed to push in this case needs to be declared/defined beforehand (in this case y)

  1. 这可以通过查看函数内部的arguments对象的长度来确认

如果我使用addNums(1,2,3,4),则arguments.length仍==4.因此,似乎该函数仍仍被称为addNums(1,2,3,4)

if I use addNums(1,2,3,4), arguments.length is still == 4. So, it seems that the function is also still being called as addNums(1,2,3,4)

问题

我的问题是我没有使用数组作为处理扩展语法的参数调用addNums.我没有打电话给addNums([1,2,3,...])我要努力理解的行为是,似乎有一个秘密的隐藏步骤,在该步骤中,给定一个以spread语法作为其单独参数声明的函数:

My problem is that I'm not calling addNums with an array as an argument for the spread syntax to process. I'm NOT calling addNums([1,2,3,...]) The behaviour I'm struggling to understand is that there seems to be a secret hidden step where, given a function declared with the spread syntax as its single argument:

let x =  ...someSetOfValues => return something ;

,然后使用参数列表进行调用:

and then called with a list of arguments:

x(1,2,3,4,...);

生成了arguments对象,并且还创建了 类型为Array的变量,该变量的名称与函数参数相同,并且带有传播语法.

there's the generation of the arguments object AND a variable of type Array is also created with the same name as the function parameter with the spread syntax.

对于经验丰富的编码人员来说,这也许是显而易见的或微不足道的,但是在我看来,这与迄今为止提出的用例是相反的,例如在一组未知长度的参数中分布值数组.

Perhaps this is obvious or trivial to more experienced coders, but this seems to me to be counter-intuitive to the use cases put forward so far like spreading an array of values across a set of parameters of unknown length.

事实上,当一个函数被多个参数调用,但使用一个扩展语法用单个参数定义时,我会说的不是跨参数读取和拆分 ,传播语法实际上类似于:Array.apply(null, arguments)var a = [arg1, arg2, ...]-**它是创建者而不是传播者**

In fact, I would go so far to say as rather than reading and splitting an array across parameters, when a function is called with multiple parameters, but defined with a single parameter with the spread syntax, the spread syntax actually acts as something similar to : Array.apply(null, arguments) or var a = [arg1, arg2, ...] - ** it is a creator not a spreader **

我的研究来源:

  • http://es6-features.org/#SpreadOperator
  • https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Spread_Syntax
  • Spread Syntax ES6

特别是对以下问题的评论:"@ void主要用于函数调用,即,如果myFunc接受未知数量的参数,我们可以将其参数作为具有散列的数组.像这样:myFunc(... dynamicallyGeneratedArgs)

particularly the comment on the question "@void Mostly for use in function calls, I.e. if myFunc takes an unknown number of arguments, we can give it arguments as an array with spread. Like this: myFunc(...dynamicallyGeneratedArgs)"

推荐答案

在进行了更多研究之后,我能够找到对所谓的 rest 参数的引用.

After doing more research, I was able to find a reference to what are called rest parameters.

其他参数看起来像它们使用...扩展语法作为参数的一部分,但行为有所不同.实际上,它们将收集无限数量的参数/参数,然后将其作为函数内部的数组使用.

Rest parameters look like they use the ... spread syntax as part of the parameter, but behave differently. They will in fact collect an indefinite number of arguments/parameters and then make them available as an array inside the function.

来源:链接到其余"参数的MDN描述

基本上是我最初观察到的行为!

Basically the behaviour that I observed in the first place!

这篇关于ES6 JS中的传播语法如何作为函数参数工作?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆