（...）这三个点在JavaScript中意味着什么？

这篇文章的标题来自我在Quora上被要求回答的一个问题。下面是我试图解释JavaScript中三个点的做用。但愿这对于未来有相同问题的人来讲能够消除围绕这个概念的迷雾。

数组/对象扩展运算符

假设您有如下对象：

const adrian = {
  fullName: 'Adrian Oprea',
  occupation: 'Software developer',
  age: 31,
  website: 'https://oprea.rocks'
};

假设您要建立一个具备不一样名称和网站但具备相同职业和年龄的新对象（人）。

您能够经过仅指定所需的属性来执行此操做，并使用扩展运算符来完成其他操做，以下所示：

const bill = {
  ...adrian,
  fullName: 'Bill Gates',
 website: 'https://microsoft.com'
};

上面代码的做用是遍及adrian对象并获取其全部属性，而后用咱们传递的属性覆盖现有属性。能够将这种传播视为逐个提取全部单个属性并将它们传递给新对象。

在这种状况下，因为咱们在扩展运算符启动后指定了fullName和网站属性，所以JavaScript引擎知道咱们要覆盖来自原始对象的那些属性的原始值。

除了传播键和值以外，运算符不会传播索引(index)和值。与对象传播不一样的是，你不会有重复的属性，由于这是JavaScript对象的工做方式（你不能拥有一个具备两个fullName属性的对象），若是你计划实现相似的东西，那么对于数组你最终可能会有重复的值到咱们的对象示例。

这意味着下面的代码将致使您拥有包含重复元素的数组。

const numbers1 = [1, 2, 3, 4, 5];
const numbers2 = [ ...numbers1, 1, 2, 6,7,8]; // this will be [1, 2, 3, 4, 5, 1, 2, 6, 7, 8]

能够把它想象成Array.prototype.concat的替代品.

rest运算符

使用函数的参数时，不管是彻底替换参数仍是与函数的参数一块儿替换参数，这三个点也称为rest运算符。

当像这样使用它时，rest操做符使开发人员可以建立能够获取无限数量的参数的函数，也称为变量arity或可变函数。

这是这种功能最简单的例子。假设您要建立一个计算其全部参数之和的函数。请注意，它不是两个，三个或四个数字的总和，而是函数做为参数接收的全部数字的总和。

这有一个简单的实现，使用rest运算符：

function sum(...numbers) {
    return numbers.reduce((accumulator, current) => {
        return accumulator += current
    });
};

sum(1,2) // 3
sum(1,2,3,4,5) // 15

最简单的解释是，rest运算符接收函数接收的参数并将它们转储到之后可使用的实数数组中。

你可能会以为，你能够经过请求用户传递一组数字来完成此操做。这在技术上是可行的，可是这样的用户体验不好，由于用户但愿用普通数字而不是数字列表来调用sum函数。

您可能还认为可使用arguments数组。这也是事实，但要当心，参数不是真正的数组，而是相似数组的对象（具备length属性的对象）。对于咱们的sum函数的第一次调用，在前面的例子中，它实际上看起来像这样：

{
  '0': 1,
  '1': 2,
  'length': 2
}

要操做此对象并在其上使用数组方法，例如reduce，从我以前的示例中，您必须执行Array.prototype.slice.call（arguments，0）操做。就速度和内存使用而言，这表现不佳而且不优雅。这样的代码，容易让你的初级水平的同事感到困惑。

这应该是您须要了解的全部内容，以便在JavaScript中使用rest / spread运算符。