什么是扩展运算符，有什么使用场景

扩展运算符（Spread Operator）是 ECMAScript 6（ES6）中引入的一种语法特性，主要用于展开数组或对象的元素/属性。在数组或对象前面使用三个点（...）来表示扩展运算符。

使用场景和代码示例

数组中的扩展运算符

1. 合并数组：

const array1 = [1, 2, 3];
const array2 = [...array1, 4, 5, 6];
console.log(array2); // 输出: [1, 2, 3, 4, 5, 6]

1. 函数参数展开：

function sum(a, b, c) {
return a + b + c;
}

const numbers = [1, 2, 3];
const total = sum(...numbers);
console.log(total); // 输出: 6

1. 复制数组：

const originalArray = [1, 2, 3];
const copiedArray = [...originalArray];
console.log(copiedArray); // 输出: [1, 2, 3]

对象中的扩展运算符

1. 合并对象：

const obj1 = { a: 1, b: 2 };
const obj2 = { b: 3, c: 4 };
const mergedObj = { ...obj1, ...obj2 };
console.log(mergedObj); // 输出: { a: 1, b: 3, c: 4 }

注意：如果两个对象有相同的属性名，那么后面的对象会覆盖前面的对象的属性值。

1. 克隆对象：

const originalObj = { a: 1, b: 2 };
const clonedObj = { ...originalObj };
console.log(clonedObj); // 输出: { a: 1, b: 2 }

注意：对象的扩展运算符只能进行浅拷贝，如果对象的属性值仍然是对象或数组，那么拷贝的将是引用而不是新对象。

剩余参数（Rest Parameters）

扩展运算符在函数参数中还有一个重要的用法，就是作为剩余参数（Rest Parameters），用于收集函数中的剩余参数到一个数组中。

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

const total = sum(1, 2, 3, 4, 5);
console.log(total); // 输出: 15

在这个例子中，...args 收集所有传递给 sum 函数的参数到一个名为 args 的数组中。

总结

扩展运算符提供了一种简洁、优雅的方式来展开数组或对象的元素/属性，在合并数组、克隆数组/对象、以及收集函数剩余参数等场景中非常有用。同时，也需要注意对象扩展运算符的浅拷贝特性以及可能的属性覆盖问题。