javascript中实现数组拼接主要有三种方法：1. concat()方法会创建新数组，不修改原数组，适合需要保留原数组的场景；2. 扩展运算符（…）语法更简洁，可读性强，性能在少量数组拼接时表现良好，同样不修改原数组；3. push()方法结合扩展运算符可直接修改原数组，节省内存但会改变原数组，需谨慎使用；若需去重，可先拼接再通过set去除重复元素；在指定位置插入数组可用splice()方法实现，但会修改原数组，建议先复制原数组；性能方面，concat()和扩展运算符相近，push()在大数据量时可能引发栈溢出，应根据是否修改原数组及性能需求选择合适方法。
数组拼接，说白了，就是把几个数组“粘”到一起，变成一个更大的数组。JavaScript里实现这个功能，其实方法挺多的，各有各的特点。
解决方案
JavaScript中实现数组拼接主要有三种常见方法：
concat()
、扩展运算符（
...
）和
push()
方法。选择哪种方法取决于你的具体需求，例如是否需要修改原数组，或者是否需要拼接多个数组。
1.
concat()
方法
concat()
方法是最常用的数组拼接方法之一。它会创建一个新的数组，包含被连接数组的所有元素。原数组不会被修改。
const arr1 = [1, 2, 3]; const arr2 = [4, 5, 6]; const arr3 = [7, 8, 9]; const newArr = arr1.concat(arr2, arr3); // 可以拼接多个数组 console.log(newArr); // 输出: [1, 2, 3, 4, 5, 6, 7, 8, 9] console.log(arr1); // 输出: [1, 2, 3] (原数组未被修改)
concat()
的优点是简单易懂，而且不会修改原数组，避免了一些副作用。缺点是每次调用都会创建一个新的数组，如果需要频繁拼接大量数组，可能会影响性能。
2. 扩展运算符 (
...
)
扩展运算符是ES6引入的新特性，可以更简洁地实现数组拼接。它也能创建新的数组，不会修改原数组。
const arr1 = [1, 2, 3]; const arr2 = [4, 5, 6]; const arr3 = [7, 8, 9]; const newArr = [...arr1, ...arr2, ...arr3]; console.log(newArr); // 输出: [1, 2, 3, 4, 5, 6, 7, 8, 9] console.log(arr1); // 输出: [1, 2, 3] (原数组未被修改)
扩展运算符的优点是语法简洁，可读性好。与
concat()
相比，它在某些情况下可能具有更好的性能，尤其是在拼接少量数组时。
3.
push()
方法
push()
方法用于向数组末尾添加一个或多个元素。如果结合
apply()
方法，可以将一个数组的元素添加到另一个数组中，实现数组拼接。注意：
push()
会修改原数组。
const arr1 = [1, 2, 3]; const arr2 = [4, 5, 6]; arr1.push(...arr2); // 直接将arr2的元素添加到arr1 console.log(arr1); // 输出: [1, 2, 3, 4, 5, 6] (arr1被修改) console.log(arr2); // 输出: [4, 5, 6]
或者使用
apply
const arr1 = [1, 2, 3]; const arr2 = [4, 5, 6]; arr1.push.apply(arr1, arr2); console.log(arr1); // 输出: [1, 2, 3, 4, 5, 6] (arr1被修改) console.log(arr2); // 输出: [4, 5, 6]
push()
的优点是可以避免创建新的数组，节省内存空间。缺点是会修改原数组，如果需要保留原数组，则不适用。另外，如果拼接的数组非常大，
push()
可能会导致栈溢出。
数组拼接时如何处理重复元素？
处理重复元素，方法就比较多了。可以考虑用
Set
来去重，因为
Set
里面的元素都是唯一的。
const arr1 = [1, 2, 3, 3, 4]; const arr2 = [3, 4, 5, 6]; const combinedArr = [...arr1, ...arr2]; // 先拼接 const uniqueArr = [...new Set(combinedArr)]; // 再去重 console.log(uniqueArr); // 输出: [1, 2, 3, 4, 5, 6]
或者，如果数组元素是对象，你需要自定义比较函数来判断对象是否重复。
如何在数组的指定位置插入另一个数组？
在指定位置插入数组，稍微麻烦一点。可以结合
splice()
方法来实现。
splice()
方法可以在数组中添加/删除元素，并返回被删除的元素。
const arr1 = [1, 2, 3, 4, 5]; const arr2 = [10, 20, 30]; const insertIndex = 2; // 在索引为2的位置插入 arr1.splice(insertIndex, 0, ...arr2); // 第一个参数是插入位置，第二个参数是要删除的元素个数（这里是0，表示不删除），后面的参数是要插入的元素 console.log(arr1); // 输出: [1, 2, 10, 20, 30, 3, 4, 5]
splice()
方法会直接修改原数组，所以在使用之前，最好先复制一份原数组，以免造成意外的修改。
数组拼接的性能考量：哪种方法更快？
性能方面，
concat()
和扩展运算符在大多数情况下性能相近，但当需要拼接大量数组时，扩展运算符可能略胜一筹。
push()
方法虽然避免了创建新数组，但在拼接大型数组时，可能会因为参数过多而导致栈溢出。
总的来说，选择哪种方法取决于你的具体需求。如果需要保持原数组不变，
concat()
和扩展运算符是更好的选择。如果对性能要求较高，可以根据实际情况进行测试，选择最适合的方法。
评论（已关闭）
评论已关闭