ES6 带来了一些新的优化和改进，其中最显著的是新的函数参数处理方式。在这篇文章中，我们将重点介绍 rest 参数和展开语法，并解释如何使用它们来简化函数参数处理。
Rest 参数
Rest 参数是指使用三个点（...）作为函数参数的前缀，例如以下代码：
function myFunction(...args) {
console.log(args);
}
myFunction(1, 2, 3);在这个例子中，我们定义了一个名为 myFunction 的函数，并使用了 rest 参数 ...args。当我们传递三个数值作为参数调用该函数时，它们被展开并作为一个数组对象 args 的元素进行输出。输出结果应该是 [1, 2, 3]。
Rest 参数是一个包含所有剩余参数的数组，因此我们可以应用一些数组方法对其进行操作，如下面的例子：
function myFunction(first, ...rest) {
console.log(first);
console.log(rest);
}
myFunction(1, 2, 3, 4);在这个例子中，我们定义了 myFunction 函数，并传递了四个参数。由于我们只想要第一个参数作为 first 参数，所以我们使用 ...rest 表示剩余的参数。在函数体中，我们分别打印 first 和 rest 参数，输出结果应该是：
1 [2, 3, 4]
实际应用
Rest 参数在处理变长参数函数时非常有用。例如，假设有一个函数能够将多个数值相加，我们可以使用 rest 参数来更容易地处理这个问题：
function sum(...args) {
return args.reduce((total, value) => total + value);
}
console.log(sum(1, 2, 3)); // 输出 6
console.log(sum(1, 2, 3, 4, 5)); // 输出 15在这个例子中，我们定义了一个 sum 函数，使用 rest 参数 ...args 接受多个数值，并使用 reduce() 方法将它们相加。这种处理方式非常简单、灵活，而且不需要手动计算函数参数个数。
展开语法
展开语法使用三个点（...）在数组和对象字面量上进行操作。在数组字面量中，它可以帮助我们将一个数组转换为一组独立的值，从而简化函数参数调用。在对象字面量中，它生成新的对象，可以将旧的对象和新的键值对进行组合。
数组展开
我们可以使用展开语法将一个数组解构为一组独立的值，例如以下代码：
const myArray = [1, 2, 3]; console.log(...myArray); // 展开输出 1 2 3
在这个例子中，我们定义了一个数组 myArray，并使用展开语法将其解构为独立的值。这个例子中的输出结果应该是 1 2 3。
很多时候，我们需要将数组作为函数的参数传递给另一个函数。例如，console.log() 方法可以接受任意数量的参数，所以我们可以使用展开语法传递一个数组作为多个参数，如下面的例子：
const myArray = [1, 2, 3]; console.log(...myArray); // 作为多个参数传递，输出 1 2 3
在这个例子中，我们将数组 myArray 解构为多个参数，并将它们作为参数传递给 console.log() 方法。
对象展开
除了数组之外，我们还可以在对象字面量中使用展开语法。这个语法可以将旧的对象和新的键值对组合在一起生成新的对象。例如：
-- -------------------- ---- ------- ----- -------- - - ----- -------- ---- --- -------- ------- -- ----- --------- - - ------------ ---- -- -- -----------------------
在这个例子中，我们定义了一个 myObject 对象，并创建了一个新的 newObject 对象。我们使用展开语法 ...myObject 将原始对象的属性和值解构为新对象的键值对，并添加了一个额外的 age 属性来更新 newObject 的年龄。我们可以看到输出结果是：
{
name: 'Alice',
age: 26,
country: 'China'
}实际应用
展开语法在许多场景下非常有用。例如，我们可以使用它来合并两个数组，而不必使用 concat() 方法。示例如下：
const myArray1 = [1, 2, 3]; const myArray2 = [4, 5, 6]; const newArray = [...myArray1, ...myArray2]; console.log(newArray); // 输出 [1, 2, 3, 4, 5, 6]
在这个例子中，我们使用展开语法 ...myArray1 和 ...myArray2 将两个数组展开为一个新数组 newArray。
总结
在这篇文章中，我们介绍了 ES6 中的 rest 参数和展开语法，并展示了如何使用它们来简化函数参数处理。值得一提的是，这样的代码看起来更加简洁和易于理解，同时让代码更加可读和易于维护。我们强烈建议你在你的代码中应用这两种语法，以提高代码质量和效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64d20457b5eee0b525962450