蜡笔小新语录: 人生就是手脚快的人赢啊,只是傻傻看着,就什么也得不到哦!
作者希冀: 希望前端开发者 在情场得意, 在基金和股票市场 一路涨涨涨
以下只是笔者在业务开发中会遇见的对于数据处理的一些数组方法 ,总结下来是为了节约开
发工时,增加摸鱼的时间;分享出来是为了帮助cv工作者,增加他们的摸鱼时间。
我们要一起做最强CV工程师
JavaScript 功能数组方法实现
分割指定长度的元素数组
// 有兴趣的可以看一下函数的默认参数
const arrayChunk = (list, size=1, arrayPiece=[] ) => {
const temp = [...list]
if(size <= 0 ){
retrun arrayPiece
}
while(temp.length){
arrayPiece.push(temp.splice(0,size))
}
reutrn arrayPiece
}
console.log(arrayChunk([1, 2, 3, 4])) // [[1], [2], [3], [4]]
console.log(arrayChunk([1, 2, 3, 4, 5, 6], 2)) // [[1, 2, 3], [4, 5, 6]]
console.log(arrayChunk([1, 2, 3, 4], 0)) // []
console.log(arrayChunk([1, 2, 3, 4], -1)) // []
数组的交集
// 1. 普通数组
intersection(list, ...args)=> {
// 采用箭头函数简写的语法
list.filter(item => args.every(list => list.includes(item)))
}
console.log(intersection([12,22, 11], [22, 3])) // [22]
console.log(intersection([11, 22], [33, 44,55])) // []
// 2. 对象数组
cosnt brandList=[{ brand:'吉利', id:1},{ brand:'沃尔沃',id:2 } ]
cosnt GoodBrandList=[{ brand:'领克', id:1},{ brand:'沃尔沃',id:2 } ]
const result= GoodBrandList.filter( item => {
return brandList.some(childItem => JSON.stringfy(childItem) === JSON.stringfy(item) )
})
console.log(result); // [{ brand:'沃尔沃',id:2 } ]
数组并集
// 普通数组
const arr1 = [1, 2, 3, 4, 5, 8, 9]
const arr2 = [5, 6, 7, 8, 9];
const result = arr1.concat(arr2.filter(item => !arr1.includes(item)))
console.log(result) //[1, 2, 3, 4, 5, 8, 9, 6, 7]
// 对象数组
cosnt brandList=[{ brand:'吉利', id:1},{ brand:'沃尔沃',id:2 } ]
cosnt GoodBrandList=[{ brand:'领克', id:1},{ brand:'沃尔沃',id:2 } ]
let arrayBrands = brandList.concat(GoodBrandList);
let result = [];
let obj = [];
// 具体可以查看reduce的传入参数的意义
// 这部分在做去重
result = arrayBrands.reduce(function (prev, cur, index, arr) {
obj[cur.id] ? '' : obj[cur.id] = true && prev.push(cur);
return prev;
}, []);
console.log(result);
// [{ brand:'吉利', id:1},{ brand:'领克', id:1},{ brand:'沃尔沃',id:2 } ]
数组差集
// 普通数组
const arr1 = [1, 2, 3, 4, 5, 8, 9]
const arr2 = [5, 6, 7, 8, 9];
const diff = arr1.filter(item => !new Set(arr2).has(item))
console.log(diff) //[ 1, 2, 3, 4 ]
// 对象数组
// brandList 相对于 GoodBrandList 所没有的
cosnt brandList=[{ brand:'吉利', id:1},{ brand:'沃尔沃',id:2 } ]
cosnt GoodBrandList=[{ brand:'领克', id:1},{ brand:'沃尔沃',id:2 } ]
let result = brandList.filter(function (item) {
return GoodBrandList.every(childitem => JSON.stringify(childitem) !== JSON.stringify(item))
})
console.log(result); // [{ brand:'领克', id:1} ]
// 数组替换可以结果交换
数组补集
// 两个数组各自没有的集合
// 普通数组
const arr1 = [1, 2, 3, 4, 5, 8, 9]
const arr2 = [5, 6, 7, 8, 9];
const difference = Array.from(new Set(arr1.concat(arr2).filter(v => !new Set(arr1).has(v) || !new Set(arr2).has(v))))
console.log(difference) //[ 1, 2, 3, 4, 6, 7 ]
// 数组对象
cosnt brandList=[{ brand:'吉利', id:1},{ brand:'沃尔沃',id:2 } ]
cosnt GoodBrandList=[{ brand:'领克', id:1},{ brand:'沃尔沃',id:2 } ]
let newBrands = brandList.concat(GoodBrandList);
let result = newBrands.filter(function (item) {
return brandList.every(childItem => JSON.stringify(childItem) !== JSON.stringify(item)) || GoodBrandList.every(childItem => JSON.stringify(childItem) !== JSON.stringify(item))
})
console.log(result);
// [{ brand:'领克', id:1},{ brand:'吉利', id:1} ]
数组去重
// 普通数组
console.log(Array.from(new Set([1, 2, 3, 3, 4, 4]))) //[1,2,3,4]
console.log([...new Set([1, 2, 3, 3, 4, 4])]) //[1,2,3,4]
// 数组对象
cosnt brandList=[{ brand:'吉利', id:1},{ brand:'吉利', id:1},{ brand:'沃尔沃',id:2 } ]
const result = [];
brandList.forEach(item=>{
!result.some(childItem => JSON.stringify(childItem) === JSON.stringify(item)) && result.push(item)
})
console.log(result)
// [{ brand:'吉利', id:1},{ brand:'沃尔沃',id:2 } ]
数组扁平化
//ES6
let es6Arr = [0,[1, 2], [3, 4]];
console.log(es6Arr.flat(Infinity))
// reduce
function flatten(arr) {
return arr.reduce((result, item)=> {
return result.concat(Array.isArray(item) ? flatten(item) : item);
}, []);
}
// ES5 -- 递归
function myFlat(arr){
let flatArr = []
arr.map(item => Array.isArray(item) === true ? flatArr = flatArr.concat(myFlat(item)) : flatArr.push(item) )
return flatArr
}