js-一般数组及数组对象的合并(并集)

2,397 阅读3分钟

本文已参与「新人创作礼」活动,一起开启掘金创作之路。

数组及数组对象的合并(并集)

1、使用扩展运算符求合并(...)

注解:扩展运算符...的作用是将一个数组转为用逗号隔开的参数序列,并提供了数组合并的新写法

const a = [1,2,3]
console.log(...a) // 则输出1 2 3
conost b = [3,4,5]
console.log(...a,...b) //则输出的是 1 2 3 3 4 5
// 将数组a和数组b分别展开后放进[]中变成新的数组
console.log([...a,...b]) // 则输出的是 123345b展开后的每一项push到a中 可以这样写a.push(...b)
// 因此可以用于数组的拼接,想取ab的合并可以使用扩展运算符...

扩展运算符同样也适用于数组对象的合并

const aa = [{name: '张三', age: 18},{name:'李四', age: 19}]
const bb = [{name: '王五'}]
const cc = [...aa, ...bb]
// 得到cc的值为aa和bb的合并:[{name: '张三', age: 18},{name:'李四', age: 19},{name: '王五'}]
扩展篇

1、因为扩展运算符是将数组转为用逗号隔开的参数序列,所以可使用他获取数组中最大值例如:

const arr1 = [1,2,3,4,5,6,7,8,9] //求两个数组中的最大值
const arr2 = [100,200,300]
console.log(Math.max(...arr1,...arr2)) // 300

2、扩展运算符可以将字符串转为真正的数组

console.log([...'hello']) // ['h','e','l','l','o']
// 可用于返回某字符串的长度 例如封装一个返回字符串长度的函数
function getStrLength (str) { return [...str].length }
2、new Set()和Array.from()数组合并,因set的唯一性,所以会去重
const aa = [1,2,3]
const bb = [2,3,4]
const cc = [1,2,3,4,5,6,7,8,9]
const res = Array.from(new Set([...aa, ...bb, ...cc]))
console.log(res) // [1, 2, 3, 4, 5, 6, 7, 8, 9]

该方法用于数组对象的话,只会合并,不会去重

const aa = [{name: '张三', age: 18},{name:'李四', age: 19}]
const bb = [{name: '王五'}]
const cc = [{name: '王五'},{name: '张三', age: 18}]
const dd = [{name: '王五'}]
const res = Array.from(new Set([...aa, ...bb,...cc, ...dd]))
console.log(res)
// [{name: '张三', age: 18},
// {name: '李四', age: 19},
// {name: '王五'},
// {name: '王五'},
// {name: '张三', age: 18},
// {name: '王五'}]
3、通过concat数组合并

注解:用于连接两个或多个数组,不会更改现有数组,而是返回一个新数组,其中包含已连接数组的值

const aa = [1,2,3]
const bb = [2,3,4]
const cc = [4,5,6]
const dd = aa.concat(bb,cc)
console.log(dd) // [1, 2, 3, 2, 3, 4, 4, 5, 6]

同样适用于数组对象的合并

const aa = [{name: '张三', age: 18},{name:'李四', age: 19}]
const bb = [{name: '王五'}]
const cc = [].concat(aa, bb)
console.log(cc) // [{name: '张三', age: 18},{name:'李四', age: 19},{name: '王五'}]
4、通过apply数组合并

注解:apply方法传递的参数列表是参数数组,会改变原数组

const aa = [1,2,3]
const bb = [2,3,4]
aa.push.apply(aa, bb);
console.log(dd) // [1, 2, 3, 2, 3, 4]
5、forEach循环或者for循环push
const aa = [1,2,3]
const bb = [2,3,4]
const cc = [4,5,6]
bb.forEach(item => {
    aa.push(item)
})
console.log(aa) // [1, 2, 3, 2, 3, 4]
for(let i=0; i < cc.length; i++){
   bb.push(cc[i])
}
console.log(bb) // [2, 3, 4, 4, 5, 6] 同样适用于数组对象的合并