其余运算符

其余运算符（也称为剩余参数或扩展运算符）是一种JavaScript语言功能，它允许你将一个数组展开为独立的参数，或者将独立的参数压缩到数组中。

数组展开

在函数调用时，可以使用其余运算符将一个数组展开为独立的参数列表。例如：

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

const nums = [1, 2, 3];

console.log(addNumbers(...nums)); // 输出 6

在这个例子中，数组nums被展开为独立的参数1，2和3传递给addNumbers函数。这意味着可以使用同一数组调用addNumbers函数，而不必像这样：

console.log(addNumbers(nums[0], nums[1], nums[2]));

压缩参数为数组

变量数目不定的函数可以使用其余运算符创建一个包含所有参数的数组。例如：

function foo(...args) {
  console.log(args);
}

foo(1, 2, 3); // 输出 [1, 2, 3]
foo('a', 'b', 'c', 'd'); // 输出 ['a', 'b', 'c', 'd']

在这个例子中，三个参数被压缩到一个数组中。...args声明一个将所有参数捆绑到一个数组中的参数（称为“rest参数”）。

对象展开

在ES6引入之前，合并两个JavaScript对象需要使用类似于以下代码的方法：

const obj1 = { a: 1, b: 2, c: 3 };
const obj2 = { d: 4, e: 5, f: 6 };

const mergedObj = Object.assign({}, obj1, obj2);

console.log(mergedObj); // 输出 {a: 1, b: 2, c: 3, d: 4, e: 5, f: 6}

ES6引入了对象展开运算符，它可以用于更简单地合并对象：

const obj1 = { a: 1, b: 2, c: 3 };
const obj2 = { d: 4, e: 5, f: 6 };

const mergedObj = { ...obj1, ...obj2 };

console.log(mergedObj); // 输出 {a: 1, b: 2, c: 3, d: 4, e: 5, f: 6}

注意，对象展开是浅拷贝，这意味着如果合并的两个对象具有相同的属性（通过名称），则只有最后一个属性被保留。例如：

const obj1 = { a: 1, b: 2, c: 3 };
const obj2 = { c: 4, d: 5, e: 6 };

const mergedObj = { ...obj1, ...obj2 };

console.log(mergedObj); // 输出 {a: 1, b: 2, c: 4, d: 5, e: 6}

在这个例子中，属性c来自obj2，而不是obj1。

结束语

使用其余运算符，可以更方便地编写JavaScript代码。当需要传递一个数组作为参数，或者需要使用所提供的参数以及其他默认参数来调用函数时，其余运算符可能特别有用。此外，在ES6中引入的对象展开运算符可以使合并对象变得更加简单。