ES7 中关于 Rest 参数的新特性及应用

在 ES6 中，我们已经认识到了“剩余参数”的概念，即使用 Rest 参数将多个函数参数转换成一个数组。而在 ES7 中，Rest 参数又有了新的应用和特性。

Rest 参数的基础用法

首先，我们来回顾一下 Rest 参数的基础用法。

function sum(...nums) {
  return nums.reduce((acc, num) => acc + num, 0);
}

console.log(sum(1,2,3,4)); // 输出：10

上面的代码中，sum 函数的参数为 Rest 参数 ...nums，它将所有传入的参数转换成一个数组，然后使用 reduce() 方法求和。

Rest 参数中的数组解构

ES7 中，我们可以在 Rest 参数中使用数组解构语法。

function multiply([a, b, ...others], multiplier) {
  const rest = others.map(num => num * multiplier);
  return [a * multiplier, b * multiplier, ...rest];
}

console.log(multiply([1,2,3,4,5], 2));
// 输出 [2, 4, 6, 8, 10]

上述代码中，multiply 函数接收一个数组参数和一个乘数参数，对数组中的每个数进行乘法运算，并返回新数组。Rest 参数 ...others 使用了数组解构语法，将数组中第 1 个和第 2 个元素取出来，其余的都保存到了 others 数组中。

Rest 参数和箭头函数

Rest 参数在箭头函数中也有应用，可以省略 arguments 对象的使用。

const sum = (...nums) => nums.reduce((acc, num) => acc + num, 0);

console.log(sum(1,2,3,4)); // 输出：10

上面的代码中，使用了箭头函数和 Rest 参数，实现了一个将传入的参数求和的函数。这样可以避免使用 arguments 对象，看起来更加简洁明了。

Rest 参数和发散操作符

发散操作符 ... 不仅可以将一个数组发散成多个参数，还可以在函数调用和字面量中创建数组。在使用 Rest 参数时，我们可以和发散操作符结合使用。

const arr1 = [1,2,3];
const arr2 = [4,5,6];

const arr3 = [...arr1, ...arr2];
console.log(arr3); // 输出 [1, 2, 3, 4, 5, 6]

上面的代码中，我们使用了发散操作符将 arr1 和 arr2 数组合并成了一个新的数组 arr3。

总结

通过本文的介绍，我们了解了 ES7 中关于 Rest 参数的新特性和应用。Rest 参数不仅可以将多个函数参数转换成一个数组，还可以使用数组解构语法、箭头函数和发散操作符，让代码更加简洁明了。这些特性在实际的开发中很有用，建议我们多加掌握和实践。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6493500e48841e989410adc0