JS数组合并(5种)

最新推荐文章于 2025-01-18 07:11:30 发布

m0_67403013

最新推荐文章于 2025-01-18 07:11:30 发布

阅读量297

点赞数

分类专栏：前端 html 文章标签：网络 tcp/ip vue.js

本文链接：https://blog.csdn.net/m0_67403013/article/details/123349328

版权

23 篇文章

订阅专栏

23 篇文章

订阅专栏

本文介绍了JavaScript中几种常见的数组合并方法，包括使用for循环、concat、push.apply以及ES6的扩展运算符。这些方法分别适用于不同的场景，有的会改变原数组，有的则生成新数组。理解并掌握这些技巧能帮助开发者更高效地处理数组操作。

摘要由CSDN通过智能技术生成

项目过程中，经常会遇到 JS 数组合并的情况，时常为这个纠结。这里整理一下。

最容易想到的莫过于 for 了。

会变更原数组，当然也可以写成生成新数组的形式。

let arr = [1, 2]
let arr2 = [3, 4]

for (let i in arr2) {
    arr.push(arr2[i])
}

console.log(arr)
// [1, 2, 3, 4]

会生成新的数组。

let arr = [1, 2]
let arr2 = [3, 4]

arr = arr.concat(arr2)

console.log(arr)
// [1, 2, 3, 4]

第一种 for 循环就是使用的 push 来实现的。

因为 push 是可以接收多个参数的，所以我们可以使用 apply 来实现。

会变更原数组。

let arr = [1, 2]
let arr2 = [3, 4]

arr.push.apply(arr, arr2)

console.log(arr)
// [1, 2, 3, 4]

ES6 的语法，简单而实用。

会生成新的数组。

let arr = [1, 2]
let arr2 = [3, 4]

arr = [...arr, ...arr2]

console.log(arr)
// [1, 2, 3, 4]

push 结合 ...[] 来实现。

会变更原数组。

let arr = [1, 2]
let arr2 = [3, 4]

arr.push(...arr2)

console.log(arr)
// [1, 2, 3, 4]

实现方式大同小异，可以理解那最容易理解的一部分。