前言
项目过程中,经常会遇到 JS 数组合并的情况,时常为这个纠结。这里整理一下
1、ES6解构
[…arr, …arr2] 会生成新的数组
let arr = [1, 2]
let arr2 = [3, 4]
arr = [...arr, ...arr2]
console.log(arr)
// [1, 2, 3, 4]
2、concat
arr.concat(arr2) 会生成新的数组
let arr = [1, 2]
let arr2 = [3, 4]
arr = arr.concat(arr2)
console.log(arr)
// [1, 2, 3, 4]
3、push
push 结合 …[] 来实现。
会变更原数组
let arr = [1, 2]
let arr2 = [3, 4]
arr.push(...arr2)
console.log(arr)
// [1, 2, 3, 4]
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]
5、遍历添加
array.forEach(item => {
arr.push(item)
})
遍历方法:forEach、map、filter、every、for、for in、for of等。
添加方法:push(后追加)、unshift(前追加)等。
arr值改变成追加后的样子,array值不改变
6、join & split
(arr.join(',') + ',' + array.join(',')).split(',')
原数组值不改变。
默认会把数组中的数字类型转成字符串类型。
数组的项是引用类型时会自动生成’[object Object]',造成数据丢失或错误。文章来源:https://www.toymoban.com/news/detail-775513.html
7、call
arr.push.apply(arr, array)
arr.unshift.apply(arr, array)
原数组值不改变,返回拼接后数组的长度。文章来源地址https://www.toymoban.com/news/detail-775513.html
到了这里,关于JS数组合并的7种常见方法的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!