JavaScript 中展开(spread)运算符和剩余(Rest)运算符有什么区别？

展开运算符（spread operator）和剩余运算符（rest operator）在 JavaScript 中都使用三个点 ...，但它们的应用场景和作用是不同的。

1. 展开运算符（Spread Operator）：

   • 用于展开可迭代对象（比如数组、对象、字符串等），将其拆分为单独的值。在函数调用或者数组/对象字面量中，可以将数组、对象等展开为单独的元素。

   // 数组展开
   const arr1 = [1, 2, 3];
   const arr2 = [...arr1, 4, 5]; // [1, 2, 3, 4, 5]
   
   // 对象展开
   const obj1 = { a: 1, b: 2 };
   const obj2 = { ...obj1, c: 3 }; // { a: 1, b: 2, c: 3 }
   

2. 剩余运算符（Rest Operator）：

   • 用于将多个参数或剩余的参数收集成一个数组。它在函数的参数列表中使用，将多余的参数收集为一个数组。

   function sum(...args) {
     return args.reduce((acc, val) => acc + val, 0);
   }
   
   sum(1, 2, 3, 4); // args 将是一个包含所有参数的数组 [1, 2, 3, 4]
   

关键区别在于使用场景：展开运算符用于展开数组或对象，而剩余运算符用于收集多余的参数并将它们组成一个数组。展开运算符是将一个可迭代对象展开成独立的值，而剩余运算符是将多个参数合并为一个数组。