JavaScript中的"..."运算符

Question

我在 JavaScript 中发现了以下案例。我不明白这里的'...'运算符是什么意思。我在 Google 上搜索了它，但没有找到任何关于它的信息。这个运算符还有其他用法吗？有人能帮我解决吗？

var x= [1,2,3];
var y = [4,5,6];

var z = [...x, ...y]; // z will be [1,2,3,4,5,6];

感谢您的选择。

- xiaoke

---

... 不是一个运算符！ - Felix Kling

@Felix Kling 如果它不是运算符，那它是什么？我问这个问题是因为在 MDN 文档中它被归类在“表达式和运算符”下。 - Pineda

@Pineda：这是一个标点符号。 - Felix Kling

@Pineda：实际上，规范为 ... 的大多数用例都指定了名称。例如，在此情况下，我们正在谈论 展开元素，而在解构时使用时，则是 剩余元素。这也使得 ... 在不同的上下文中执行不同的操作更加清晰。请参阅我第一条评论中的链接。基本上我想让人们明白，... 不是一个独立的东西，它是数组字面量语法、解构语法、函数调用语法等的一部分。 - Felix Kling

@FelixKling 我们也可以简单地称之为标记，但“标点符号”听起来不错 :-) - Bergi

Answer 1

我有一种思维方式，可以让理解和记忆“…”的工作原理变得非常容易。

var arr = [1,2,3] // this is arr which is the array

另一方面。

...arr            // this is whatever inside arr, which is 1,2,3

所以你也可以将其视为提取数组内部的内容。

---

请注意，仅使用...arr是无效的语法。您可以以多种方式使用它，我想到的两种方法是：

1- 将数组中的内容传递给函数

var arr = [ 1,2,3 ]
var myFunc = function(a,b,c) {
  console.log(a,b,c)
}
myFunc(..arr)   // logs 1 2 3

myFunc(1,2,3)   // logs 1 2 3

2 - 将数组中的内容取出并在另一个数组中使用。

var arr = [ 1,2,3 ]
var foo = [ ...arr, 4,5,6 ] // now foo is [ 1,2,3,4,5,6 ]

- FurkanO

---

对象扩展语法在ES7中也不可用。 - Bergi

谢谢指出。我找不到太多关于它的信息，已经删除了相关部分。 - FurkanO

然而，...arr本身并没有任何意义。...arr的含义取决于它是在数组字面量内部使用还是在解构内部使用等不同情况下。这就是为什么单独看...没有意义的原因。 - Felix Kling

我的回答是否误导了？我想不出这个类比不适用的情况。@Felix Kling - FurkanO

在 [foo, ...bar] = baz; 中，...bar 的意思不同。单独使用 ...arr 没有任何意义，这是语法错误。 - Felix Kling