Rest/Spread 是 ES9（ECMAScript 2018） 引入的新特性，它们是通过三个连续的点（...）来实现的。这两个属性在 JavaScript 编程中提供了很多便利和灵活性。本文将介绍 Rest/Spread 的概念和用法，并提供一些实用示例。
Rest 属性
Rest 属性，也称为“剩余属性”，用于将多个参数作为数组传递给函数。这意味着您可以在函数中处理完全未知数量的参数。下面是一个示例：
function sum(...nums) {
return nums.reduce((total, num) => total + num);
}
console.log(sum(1, 2, 3)); // 6
console.log(sum(1, 2, 3, 4, 5)); // 15在这个示例中，Rest 属性将所有传递给函数的参数捆绑到一个名为“nums”的数组中。随着您传递的参数数量的增加，该数组的条目会相应地增加。在函数中，我们可以像处理常规数组一样使用该数组，例如使用 reduce 函数来计算所有数字的总和。
Rest 属性还可以与其他参数一起使用，例如：
function greet(greeting, ...names) {
return names.map(name => `${greeting} ${name}`);
}
console.log(greet('Hello', 'Alice', 'Bob', 'Charlie'));
// ["Hello Alice", "Hello Bob", "Hello Charlie"]在此示例中，我们使用 Rest 属性将剩余参数绑定到名为“names”的数组中。与其他参数一起传递的第一个参数是问候语，我们使用它来创建包含所有名称的新数组。
Spread 属性
Spread 属性，也称为“展开属性”，用于将数组或对象的内容作为参数传递给函数。它允许您快速传递不定数量的参数，并且可以方便地组合多个数组或对象。下面是一个示例：
const nums1 = [1, 2, 3]; const nums2 = [4, 5, 6]; const numsCombined = [...nums1, ...nums2]; console.log(numsCombined); // [1, 2, 3, 4, 5, 6]
在此示例中，我们创建了两个数组（nums1 和 nums2），然后使用 Spread 属性将它们组合成一个新的数组 numsCombined。Spread 属性允许我们在数组字面量中快速创建新的数组，或者将多个数组组合为单个数组。
除了使用在数组中，Spread 属性还可以用于对象。它允许您拆分对象，并将其属性扩展到新对象中。以下是一个示例：
-- -------------------- ---- ------- ----- ------ - - ----- -------- ---- --- -- ----- --------- - - ---------- ----------- ----------- -- ----------------------- -- - ----- -------- ---- --- ----------- ---------- -
在此示例中，我们使用 Spread 属性创建了一个新的对象 newPerson，该对象具有我们原始对象的所有属性和一个新的 occupation 属性。Spread 属性允许我们在不更改原始对象的情况下轻松地扩展对象。
Rest 和 Spread 的结合使用
Rest 和 Spread 属性通常结合在一起使用，以提供更高的灵活性。当您需要将一些参数传递给一个函数，但不知道这些参数的数量时，Rest 属性会在该函数中捆绑这些参数为数组。然后，使用 Spread 属性将该数组中的参数传递给另一个函数。以下是一个示例：
-- -------------------- ---- ------- -------- ---------------- -------- - ------ ------------ -- --- - -------- - -------- ------------ - ------ ------------------- ---- -- ----- - ----- - ----- ---- - --- -- -- --- ----- -------------- - ----------- --------- ---------------------------- -- --- -- -- -- ----- ------ - ----------------------- -------------------- -- --
在此示例中，我们使用 Rest 属性将所有数字捆绑到名为“nums”的数组中。然后，我们使用 Spread 属性将数组中的内容传递给 multiply 函数。该函数接受一个名为“factor”的参数，我们可以将其用于每个数字。使用 map 函数，我们将每个数字乘以因子并返回新的数字数组。
在第二个步骤中，我们使用 Spread 属性将 multiply 函数的输出传递给 sum 函数。该函数以常规方式计算传递给它的所有数字的总和。
结论
Rest/Spread 属性是一个强大而灵活的 JavaScript 特性，可以让您更轻松地编写代码。Rest 属性允许您处理未知数量的参数，而 Spread 属性则用于将数组或对象的内容传递给函数。结合使用 Rest/Spread 属性时，您可以构建更灵活的函数和应用程序，以便更好地满足您的需求。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6774872a6d66e0f9aaede027