ECMAScript 文档中的 SpreadElement 是什么？ 和 MDN 上的 Spread 语法一样吗？

Question

在ECMAScript 规范中， SpreadElement被描述

SpreadElement[Yield]:
...AssignmentExpression[In, ?Yield]

这和Spread语法一样吗

扩展语法允许在预期零个或多个参数（对于函数调用）或元素（对于数组字面量）的地方扩展诸如数组表达式或字符串之类的可迭代对象，或者在零个或多个参数的地方扩展对象表达式键值对（用于对象文字）是预期的。

句法

对于函数调用：

 myFunction(...iterableObj);

对于数组文字：

 [...iterableObj, 4, 5, 6]

在MDN文档中描述？

SpreadElement和/或传播语法的用例是什么？ 如果SpreadElement和spread 语法不同，它们在哪些具体方式上有所不同？

Answer 1

术语“扩展运算符”是一种“伞形术语”，指的是 ES6 中的各种语法结构，它们看起来都像...x 。 MDN 也是如此。

然而，这是一种误导，因为...不是运算符（至少在 ECMAScript 规范使用术语“运算符”的意义上不是）。 它不会生成可用于进一步计算的值。 我宁愿将它与其他标点符号进行比较，例如,或; （它们也是相关的，但在不同的上下文中具有不同的含义）。

术语“传播运算符”可以指：

• 展开元素， var arr = [a, b, ...c]; : spread 元素将可迭代 ( c ) 扩展到新数组中。 它相当于[a,b].concat(c) 。

• 休息元素， [a, b, ...c] = arr; ^† ：在解构内部， ...构造具有相反的效果：它将剩余元素收集到数组中。 这里的例子相当于

  a = arr[0]; b = arr[1]; c = arr.slice(2);

  （请注意，这只是一个近似值，因为解构适用于任何可迭代值，而不仅仅是数组）

• fun(a, b, ...c) ：这个构造实际上在规范中没有名称。 但它的工作方式与扩展元素非常相似：它将可迭代对象扩展为参数列表。
  它相当于func.apply(null, [a, b].concat(c)) 。

  缺乏正式名称可能是人们开始使用“扩展运算符”的原因。 我可能会称之为“传播论点”。

• Rest 参数： function foo(a, b, ...c) ：与 rest 元素类似，rest 参数收集传递给函数的剩余参数，并使它们作为数组在c可用。 ES2015 规范实际上使用术语BindingRestElement来指代这个构造。

相关问题：

• ES2015/es6 中的扩展运算符与 Rest 参数
• 在javascript中多次使用传播运算符？

---

† ：如果我们非常迂腐，我们甚至必须区分变量声明（ var [a, b, ...c] = d; ）和简单赋值（ [a, b, ...c] = d; )，根据规范。

Answer 2

SpreadElement只是 ES6 语法中的一个名称，用于在数组字面量中扩展“运算符”及其参数：

SpreadElement[Yield]:
    ... AssignmentExpression[In, ?Yield]

因此， [a, b, ...c] SpreadElement是...c ； 传播“运算符”是... （恐吓引号，因为它不是与例如-相同意义上的真正运算符。）

函数调用中使用的语法规则的名称会有所不同，因为它是不同的语法上下文（它只是ArgumentList一种）。

Answer 3

另一个用例是替代 Object.assign 方法：

// 天真的使用 assign--覆盖 o 中的共享属性：

Object.assign(o, defaults); 

/* non-naive use of assign—prevents shared properties in o from being 
   overwritten */ 
o = Object.assign({}, defaults, o);  

或者，使用扩展运算符：

o = {...defaults, ...o} 

这是 ES2018 中最重要的功能之一

let position = { x: 0, y: 0 };  
let dimensions = { width: 100, height: 75 };  
let rect = { ...position, ...dimensions };  
rect.x + rect.y + rect.width + rect.height // => 175 

-MDA