Js数组常见函数,常见操作场景。

*此文章仅仅针对数组对象,纯数字数组太过简单,无需多说

先声明3个数组,就以这3个数组为列,进行工作中常用的数组操作模拟

		let arr1 = [{id: '1',name: '小张'}, {id: '2',name: '小李'}, {id: '3',name: '小王'}, {id: '4',name: '小刘'}]
		let arr2 = [{id: '1',name: '小张'}, {id: '2',name: '小李'}, {id: '3',name: '小王'}]
		let arr3 = [{id: '1',name: '小张'}, {id: '2',name: '小李'}, {id: '5',name: '小狗'}]

1、多个数组合并concat

let arrConcat = arr1.concat(arr2,arr3) // 数组合并

结果:

        Js数组常见函数,常见操作场景。_第1张图片

2、数组去重filter+map

		let map = new Map();
        let noRepeatArr = arrConcat.filter(item=>{
			if (!map.has(item.id)) {
				return map.set(item.id, item);
			}
		})
		console.log(noRepeatArr)

结果:

Js数组常见函数,常见操作场景。_第2张图片

 3、数组排序,重写sort方法

		arrConcat.sort((a, b)=> {
			if (a.id < b.id) {
				return 1  //返回正数 ,b排列在a之前
			} else {
				return -1 //返回负数 ,a排列在b之前
			}
		})
		console.log(arrConcat)

结果:

Js数组常见函数,常见操作场景。_第3张图片

4、两个数组取交集(两个数组都存在的部分)

		const arr2Map = arr2.map(item => item.id);
		const intersectionArr = arr1.filter(item => arr2Map.includes(item.id))
		console.log(intersectionArr);

结果:

Js数组常见函数,常见操作场景。_第4张图片

 5、两个数组取差集

    let diff = arr1.filter(item => arr2.every(every => every.id != item.id));

 结果:

你可能感兴趣的:(前端,javascript,开发语言,ecmascript)