ES6 中数组的操作更加便捷和高效，经常用到的合并、去重和截取操作也得到了优化。本文将详细介绍 ES6 中数组的合并、去重和截取操作的实现方法及其常见应用。
数组合并
1. concat() 方法
ES6 中的数组合并最常用的方法是使用 concat() 方法。该方法可以将两个或多个数组合并成一个新的数组，并且不改变原数组。
const arr1 = [1, 2, 3]; const arr2 = [4, 5, 6]; const arr3 = arr1.concat(arr2); console.log(arr3); // [1, 2, 3, 4, 5, 6]
使用 concat() 方法时，也可以添加参数，使其可以合并多个数组。
const arr1 = [1, 2, 3]; const arr2 = [4, 5, 6]; const arr3 = [7, 8, 9]; const arr4 = arr1.concat(arr2, arr3); console.log(arr4); // [1, 2, 3, 4, 5, 6, 7, 8, 9]
2. ... 数组展开运算符
还有一种比较常用的合并方法是使用 ... 数组展开运算符。该运算符将一个数组展开成一个逗号分隔的值序列，可以在函数调用中传递数组，或者在数组字面量中创建数组。
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 = [7, 8, 9]; const arr4 = [...arr1, ...arr2, ...arr3]; console.log(arr4); // [1, 2, 3, 4, 5, 6, 7, 8, 9]
数组去重
1. Set 数据结构
最常用的数组去重方法是使用 Set 数据结构。该数据结构是 ES6 中引入的新的数据类型，可以用来存储任何类型的唯一值。
const arr = [1, 1, 2, 3, 3]; const set = new Set(arr); const arr2 = Array.from(set); console.log(arr2); // [1, 2, 3]
2. filter() 方法
另一种去重方法是使用 filter() 方法。该方法可以用来过滤数组中的重复项，只留下不重复的项。
const arr = [1, 1, 2, 3, 3];
const arr2 = arr.filter((item, index, arr) => {
return arr.indexOf(item) === index;
});
console.log(arr2); // [1, 2, 3]数组截取
1. slice() 方法
ES6 中数组截取最常用的方法是使用 slice() 方法。该方法可以从数组中提取出指定的部分，返回一个新数组，并且不改变原数组。
const arr = [1, 2, 3, 4, 5]; const arr2 = arr.slice(1, 4); console.log(arr2); // [2, 3, 4]
2. ... 数组展开运算符
另一种截取方法是使用 ... 数组展开运算符。该运算符可以将一个数组展开成一个逗号分隔的值序列，可以从数组中提取出指定的部分。
const arr = [1, 2, 3, 4, 5]; const [a, b, ...rest] = arr; console.log(a, b, rest); // 1 2 [3, 4, 5]
总结
ES6 中数组的操作更加便捷和高效，使用合适的方法可以更加轻松地实现数组的合并、去重和截取。在开发过程中，需要根据实际情况选择合适的方法来操作数组，使代码更加简洁且高效。
参考代码：
-- -------------------- ---- ------- -- ---- ----- ---- - --- -- --- ----- ---- - --- -- --- ----- ---- - ------------------ ------------------ -- --- -- -- -- -- -- -- ---- ----- --- - --- -- -- -- --- ----- --- - --- --------- ----- ---- - ---------------- ------------------ -- --- -- -- -- ---- ----- --- - --- -- -- -- --- ----- ---- - ------------ --- ------------------ -- --- -- --
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64532157968c7c53b0792859