JS数组合并(5种)

简介: JS数组合并(5种)

前言

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

简单而实用的for

最容易想到的莫过于 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]

arr.concat(arr2)

会生成新的数组。

let arr = [1, 2]
let arr2 = [3, 4]
arr = arr.concat(arr2)
console.log(arr)
// [1, 2, 3, 4]

arr.push.apply(arr, arr2)

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

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

会变更原数组。

let arr = [1, 2]
let arr2 = [3, 4]
arr.push.apply(arr, arr2)
console.log(arr)
// [1, 2, 3, 4]

[…arr, …arr2]

ES6 的语法,简单而实用。

会生成新的数组。

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

push(…arr)

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

会变更原数组。

let arr = [1, 2]
let arr2 = [3, 4]
arr.push(...arr2)
console.log(arr)
// [1, 2, 3, 4]

最后

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

相关文章
|
8天前
|
存储 JavaScript 索引
js开发:请解释什么是ES6的Map和Set,以及它们与普通对象和数组的区别。
ES6引入了Map和Set数据结构。Map的键可以是任意类型且有序,与对象的字符串或符号键不同;Set存储唯一值,无重复。两者皆可迭代,支持for...of循环。Map有get、set、has、delete等方法,Set有add、delete、has方法。示例展示了Map和Set的基本操作。
29 3
|
3天前
|
前端开发 JavaScript
前端 js 经典:数组常用方法总结
前端 js 经典:数组常用方法总结
12 0
|
8天前
|
JavaScript
通过使用online表单的获取使用,了解vue.js数组的常用操作
通过使用online表单的获取使用,了解vue.js数组的常用操作
10 0
|
8天前
|
存储 JavaScript 前端开发
深入了解JavaScript中的indexOf()方法:实现数组元素的搜索和索引获取
深入了解JavaScript中的indexOf()方法:实现数组元素的搜索和索引获取
10 0
|
8天前
|
JavaScript 前端开发
js关于数组的方法
js关于数组的方法
12 0
|
8天前
|
JavaScript 前端开发
js怎么清空数组?
js怎么清空数组?
14 0
|
8天前
|
存储 JavaScript 前端开发
js处理数组的方法
js处理数组的方法
14 2
|
8天前
|
JavaScript 前端开发 索引
JavaScript 数组的索引方法数组转换为字符串方法
JavaScript 数组的索引方法数组转换为字符串方法
|
8天前
|
JavaScript 前端开发
JavaScript 数组的添加删除和排序
JavaScript 数组的添加删除和排序
|
8天前
|
JavaScript 前端开发
js 操作数组的方法
js 操作数组的方法
24 4