JavaScript 展开与剩余运算符及示例

在 JavaScript 编程中，展开运算符（spread operator）和剩余运算符（rest operator）是两个强大且实用的语法特性，它们为开发者提供了更简洁、高效的代码编写方式。

展开运算符使用三个连续的点（...）表示，它可以将数组或对象展开成单个元素。在数组操作方面，展开运算符极大地简化了数组的合并与复制。例如，我们有两个数组 arr1 = [1, 2] 和 arr2 = [3, 4]，要合并这两个数组，传统方法可能需要使用 concat 方法。但使用展开运算符，只需 const newArr = [...arr1,...arr2]，就能轻松得到合并后的数组 [1, 2, 3, 4]。

在对象操作中，展开运算符同样发挥着重要作用。假设我们有一个基础对象 baseObj = { a: 1, b: 2 }，现在要创建一个新对象，它包含基础对象的所有属性，并且有新的属性 c。使用展开运算符，代码可以写成 const newObj = {...baseObj, c: 3 }，这样就得到了 { a: 1, b: 2, c: 3 } 的新对象。

剩余运算符同样用三个点（...）表示，但它的功能与展开运算符相反。剩余运算符用于将函数的多个参数收集到一个数组中，或者从对象中提取剩余的属性。例如，在函数定义时 function sum(...nums) { let total = 0; for (let num of nums) { total += num; } return total; }，这里的 ...nums 就是剩余运算符，它可以收集所有传入的参数，无论参数个数是多少，都能轻松处理。

在对象解构赋值中，剩余运算符也有出色表现。例如 const { a,...rest } = { a: 1, b: 2, c: 3 };，这样 a 会被赋值为 1，rest 会成为一个包含 { b: 2, c: 3 } 的对象。

展开与剩余运算符在 JavaScript 中为开发者带来了极大的便利，它们让代码更加简洁明了，提高了代码的可读性和可维护性。无论是处理数组还是对象，合理运用这两个运算符，都能让编程工作变得更加高效。