JavaScript数组合并的三种常用方法详解
作者:青柠时间:2026-10-24 14:16:06浏览:88
本文详细讲解JavaScript中合并数组的三种主流方式。涵盖传统的concat方法、ES5中利用apply调用push的技巧,以及ES6推荐的展开运算符。通过对比不同写法在修改原数组及代码简洁度上的差异,帮助开发者根据实际需求选择最佳方案。
使用concat方法合并数组
第一种方法使用concat函数。该方法会创建并返回一个新数组,包含原数组及参数数组的所有元素,不会修改原始数组。
var a = [1,2,3];
var b=[4,5]
a = a.concat(b);
console.log(a);
//此处输出为 [1, 2, 3 ,4 ,5]
ES5中通过apply调用push合并
第二种方法基于ES5标准。通过Array.prototype.apply将第二个数组作为参数传入push函数,从而将arr2的元素追加到arr1中。注意,这种方式会直接修改arr1原数组。
// ES5 的写法
var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
Array.prototype.push.apply(arr1, arr2);
console.log(arr1)//[0,1,2,3,4,5]
ES6展开运算符与push结合
第三种方法采用ES6语法。利用展开运算符(spread operator)将arr2的元素展开后传递给push函数,实现与ES5类似的效果,即修改原数组arr1。
// ES6 的写法
var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
arr1.push(...arr2);
console.log(arr1)//[0,1,2,3,4,5]
ES6展开运算符构建新数组
// ES6 的写法
var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
var arr3=[...arr1, ...arr2]
console.log(arr3)//[0,1,2,3,4,5]
第四种写法同样基于ES6,但使用展开运算符直接构建新数组arr3。这种方式不修改原数组,而是生成一个包含arr1和arr2所有元素的新数组,代码更为简洁直观。
作者最新文章
ES6模块化中js文件怎么用import和export交互
2026-11-05 17:00:48
JS读取本地文件时报错或无响应的常见原因
2026-11-05 16:32:31
let、const与var的区别:JavaScript变量声明最佳实践
2026-11-05 14:16:38
JS中直接定义静态二维数组的字面量写法
2026-11-05 14:16:08
JS 怎么查找字符串中所有匹配项的位置
2026-11-05 14:15:53
