javascript es6 数组功能 [...data, 0] “扩展运算符”

Posted 2023-02-22

【中文标题】javascript es6 数组功能 [...data, 0] “扩展运算符”

【英文标题】：javascript es6 array feature [...data, 0] "spread operator"

【发布时间】：2016-02-26 17:01:25

【问题描述】：

我在一些示例代码中遇到了这个问题，我完全迷路了。

const addCounter = (list) => 
    return [...list, 0];  // This is the bit I am lost on, and I don't know about [...list, 0]

显然以上等于以下：

const addCounter = (list) => 
    return list.concat([0]);

非常感谢任何建议或解释。

【问题讨论】：

这能回答你的问题吗？ Spread Syntax vs Rest Parameter in ES2015 / ES6

【参考方案1】：

...list 正在使用spread syntax 传播list 的元素。假设列表是[1, 2, 3]。因此[...list, 0] 变为：

[1, 2, 3, 0]

与list.concat([0]);的结果相同

这不是 ES6 中数组的特性，它只是用于数组连接。它还有其他用途。阅读更多on MDN，或查看this question。

【讨论】：

所以基本上它是一个concat？

它不是concat，但在这种情况下它具有相同的结果。见this answer。

它不是运算符（也不能是运算符）。这只是语法。

我认为在这种情况下，术语“语法”和“运算符”可以互换使用，至少只要语法被认为是语法糖抽象或隐藏一些复杂的逻辑javascript。然而，如果我们指的是 JavaScript 引擎的 native 能力将数组分散到其各个元素中，我更愿意称它为“运算符”，因为它不再只是语法上的差异，即可能存在具有潜在性能优势的内部实现差异。

@ibrahimmahrir 好的，谢谢。我正在更新我的答案，将其称为 syntax。甚至 Mozilla 也更新了他们的文档。

【参考方案2】：

...listspreads（布局）数组list中的所有元素。

所以[...list, 0]是列表的所有元素，末尾有一个0