写在前面:这一篇主要是我对数组操作的常用方法一些总结和概括,毕竟业务中最常用的就是拿到接口的数据进行操作和传递。
ES6数组操作
数组操作首先要注意且牢记splice、sort、reverse这3个常用方法是对数组自身的操作,会改变数组自身。其他会改变自身的方法是增删push/pop/unshift/shift、填充fill和复制填充copyWithin。
展开运算符和解构赋值
用处很多
// 交换变量
[a, b] = [b, a]
//获取剩余参数
[...arr] = [a,...b];
//浅拷贝
const arr = [...arr] //数组
const obj = {...obj} //对象
//数组合并
const arr1 = [1, 2]
const arr2 = [a, b]
const arr = [...arr1, ...arr2]
//数组去重
const arr = [1, 1, 2, 2, 3, 4, 5, 5]
const newArr = [...new Set(arr)]
//取两数组交集
const a = [1, 2, 3, 4, 5,6]
const b = [3, 4, 5, 6, 7, 8]
const Values = [...new Set(a)].filter(item =>
b.includes(item)
)
console.log(Values); // [3, 4, 5, 6]
//数据扁平化(数组摊平)
const obj = {a: '群主', b: '男群友', c: '女裙友', d: '未知性别'}
const getName = function (item) {
return item.includes('群')
}
// 方法
const flatArr = Object.values(obj).flat().filter(item => getName(item))
// 经大佬指点,更加简化(发现自己的抽象能力真的差~)
const flatArr = Object.values(obj).flat().filter(getName)
//flat()函数用来拉平数组结构,可以传参控制拉平的层次
复制代码
数组迭代常用的方法及释义
forEach():遍历数组,让数组每一项做一件事,改变原数组
map():遍历数组,让数组每一项做一件事,然后返回新数组
filter():遍历数组,筛选符合条件的子项,然后返回新数组
reduce():遍历数组,让数组相邻子项进行计算,然后返回累计值
find/findIndex():遍历数组,找到数组内第一项符合条件的子项,返回子项或者下标(判断是否存在)
some(): 遍历数组,查看是否有满足条件的子项,有一个则为true。(判断是否存在)
every():遍历数组,查看是否每个子项都满足条件,全部满足返回true。(判断是否不存在)
复制代码
迭代方法详解
filter()方法
const data = [
{id:1,title:"阿修罗"},
{id:2,title:"阿松大"},
{id:3,title:"阿拉贡"},
{id:4,title:"阿拉善"},
]
//是否存在符合条件的
const hasNum = data.filter(res => {
return res.id == 4;
})
console.log(hasNum)
//筛选符合条件的
let Obj = arrObj.filter(res => res.id > 2)
console.log(Obj) //{id:3,title:"阿拉贡"},{id:4,title:"阿拉善"}
//筛选不符合条件的(其实还是符合条件的,只不过是符合跟意愿相反的条件)
let Obj = arrObj.filter(res => res.id < 2)
console.log(Obj) //{id:1,title:"阿修罗"}
复制代码
find/findIndex
const arr = [1, 2, 3, 4, 5]
const findItem = arr.find(item => item === 2) // 返回子项
const findIndex = arr.findIndex(item => item === 2) // 返回子项的下标
复制代码
some
map
数组常用方法
- splice(起始位置,删除个数,添加的内容)
一般用来删除数据,也能用来替换,返回值是被删除的内容
let array = [1,2,3,4];
array.splice(1,2,"5"); //[1,"5",4]
复制代码
- sort(函数)
不传参则按照字符编码的顺序进行升序排序,传参则传入规定排序顺序的函数,函数要比较两个值,然后返回一个用于说明这两个值的相对顺序的数字
<!--无参数-->
let arr = [1,3,6,4,7];
let arrSort1 = arr.sort();
console.log(arrSort1);//[1,3,4,6,7]
console.log(arr);//[1,3,4,6,7]
console.log(arrSort1 === arr);//true,该方法直接改变原数组
<!--有参数-->
// 升序
let arr = [1,3,6,4,7];
let arrSort1 = arr.sort((a,b)=>{
if(a>b){
return 1;
}else if(a === b){
return 0
}else{
return -1
}
});
//降序
let arr = [1,3,6,4,7];
let arrSort1 = arr.sort((a,b)=>{
if(a>b){
return -1;
}else if(a === b){
return 0
}else{
return 1
}
});
复制代码
End
© 版权声明
文章版权归作者所有,未经允许请勿转载。
THE END