ES6 中如何使用扩展运算符进行数组合并

在 JavaScript 中，合并两个或多个数组是一项非常常见的操作。在 ES6 中，我们可以使用扩展运算符（...）实现数组的合并操作。

扩展运算符的概念

扩展运算符可以将一个数组转换为用逗号分隔的参数序列。这个序列可以作为函数参数的列表，或者用于数组和对象的展开。

const arr = [1, 2, 3];
console.log(...arr); // 1 2 3

数组合并

在 ES6 中，我们可以使用扩展运算符将两个或多个数组合并为一个数组。

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

const arr3 = [...arr1, ...arr2];

console.log(arr3); // [1,2,3,4,5,6]

你也可以将一个数组插入到另一个数组的中间位置。

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

const arr3 = [...arr1.slice(0, 2), ...arr2, ...arr1.slice(2)];

console.log(arr3); // [1,2,4,5,6,3]

扩展运算符与函数参数

扩展运算符在函数参数列表中非常有用。它可以将一个数组转换为一个参数序列，让我们能够使用 apply() 方法调用函数。

function sum(x, y, z) {
  return x + y + z;
}

const numbers = [1, 2, 3];

console.log(sum(...numbers)); // 6

扩展运算符与对象展开

除了可以用于数组，扩展运算符还可以将一个对象的所有属性复制到另一个对象中。

const obj1 = { a: 1, b: 2 };
const obj2 = { ...obj1, c: 3 };

console.log(obj2); // {a: 1, b: 2, c: 3}

总结

扩展运算符是 ES6 中一个非常实用的语法特性，它可以简化代码，提高可读性。在数组合并、函数参数传递、对象复制等方面都有广泛的应用。在实际开发中，请多加运用扩展运算符，发挥它的魔力吧！

示例代码

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

const arr3 = [...arr1, ...arr2];

console.log(arr3); // [1,2,3,4,5,6]

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