提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档
前言
js有很多数组方法 本篇文章稍微总结了一些数组方法
以便于个人复习
一.用于增删数组元素的方法
1.push() 添加元素到数组尾部
//push() 将参数添加到数组尾部 改变原数组 返回添加后数组的长度
var arrPush = [1, 2, 3, 4, 5]
var newArrPush = arrPush.push(7, 8, 9)
console.log(arrPush); //(8) [1, 2, 3, 4, 5, 7, 8, 9]
console.log(newArrPush); //8
2.pop() 删除数组末尾的第一个元素
//pop() 删除数组最后一个数 和传入的参数无关 改变原数组 返回删除的元素
var arrPop = [1,2,3,4,5]
var newArrPop = arrPop.pop()
console.log(arrPop); // (4) [1, 2, 3, 4]
console.log(newArrPop); // 5
3.unshift() 添加元素到数组的头部
//unshift() 添加参数到数组的头部 可以传入多个参数 改变原数组 返回添加后的数组长度
var arrUnshift = [1,2,3,4,5]
var newArrUnshift = arrUnshift.unshift([1,2,3],5)
console.log(arrUnshift); // (7) [Array(3), 5, 1, 2, 3, 4, 5]
console.log(newArrUnshift); // 7
4.shift() 删除数组头部的第一个元素
//shift() 删除数组头部的一个元素 和传入的参数无关 改变原数组 返回删除的元素
var arrShift = [1,2,3,4,5]
var newArrShift = arrShift.shift()
console.log(arrShift); // (4) [2, 3, 4, 5]
console.log(newArrShift); // 1
二.用于截取数组的方法
1.slice() 截取数组
//slice() 截取数组 接受两个索引参数 截取两个索引之间的数组 截取的数组不包括第二个索引参数上的元素 如果只传入一个参数,则从这个参数截取到数组末尾
//原数组不改变 返回截取出来的数组
var arrSlice = [1,2,3,4,5]
var newArrSlice = arrSlice.slice(1,3)
console.log(arrSlice); // (5) [1, 2, 3, 4, 5]
console.log(newArrSlice); // (2) [2, 3]
2.splice() 截取或者插入数组元素
//splice() 截取或者插入数组元素 可以传入三个参数 按顺序分别是 开始截取的数组 截取的数组长度 从截取数组的位置开始插入的元素
//原数组改变 返回截取出的数组
var arrSplice = [1,2,3,4,5]
var newArrSplice = arrSplice.splice(1,2,3)
console.log(arrSplice); // (4) [1, 3, 4, 5]
console.log(newArrSplice); // (2) [2, 3]
三.改变数组排序的方法
1.reverse() 翻转数组
//reverse() 翻转数组 接收参数无效 不接受参数 改变原数组 返回新得到的数组
var arrReverse = [1,2,3,4,5]
var newArrReverse = arrReverse.reverse()
console.log(arrReverse); // (5) [5, 4, 3, 2, 1]
console.log(newArrReverse); // (5) [5, 4, 3, 2, 1]
2.sort() 数组排序
//sort() 排序 改变原数组 返回新数组
//不传参数的时候 默认从小到大排序
var arrSort = [2,3,0,1,6,8,1]
var newArrSort = arrSort.sort()
console.log(arrSort); [0, 1, 1, 2, 3, 6, 8]
console.log(newArrSort); [0, 1, 1, 2, 3, 6, 8]
// 可以传入一个函数 用来规定排序的顺序
//当 a-b 的时候 从小到大
var arrSort1 = [2,3,0,1,6,8,1]
var newArrSort1 = arrSort1.sort(function(a,b){
return a-b
})
console.log(newArrSort1); // (7) [0, 1, 1, 2, 3, 6, 8]
//当b-a 的时候 从大到小
var arrSort2 = [2,3,0,1,6,8,1]
var newArrSort2 = arrSort2.sort(function(a,b){
return b-a
})
console.log(newArrSort2); // (7) [8, 6, 3, 2, 1, 1, 0]
//也可以用箭头函数写法
var arrSort1 = [2,3,0,1,6,8,1]
var newArrSort1 = arrSort1.sort((a,b) => b-a)
console.log(newArrSort1); // (7) [8, 6, 3, 2, 1, 1, 0]
四.查找数组元素位置的方法
1.indexOf() 查找数组中元素位置
//indexOf() 从前往后遍历一个数组查找传入的参数位置 不改变原数组 如果找到则返回找到的第一个元素位置 未找到则返回 -1
//如果传入两个参数 则第二个参数是 从第二个参数的索引数 开始查找
var arrIndexOf = [12,24,35,46,78,24]
var newArrIndexOf1 = arrIndexOf.indexOf(1)
console.log(arrIndexOf); // (6) [12, 24, 35, 46, 78, 24]
console.log(newArrIndexOf1); // -1
var newArrIndexOf2 = arrIndexOf.indexOf(24)
console.log(newArrIndexOf2); // 1
var newArrIndexOf3 = arrIndexOf.indexOf(24,3)
console.log(newArrIndexOf3); // 5
2.includes() 查找数组中是否有该元素
//includes() 遍历检查数组中是否有传入的参数 不改变原数组 与 indexOf 的区别在于 includes 返回的是一个布尔值
var arrIncludes = [12,24,35,46,78,24]
var newArrIncludes = arrIncludes.includes(12)
var newArrIncludes1 = arrIncludes.includes(13)
console.log(arrIncludes); // (6) [12, 24, 35, 46, 78, 24]
console.log(newArrIncludes); // true
console.log(newArrIncludes1); // false
五.遍历数组的方法
1.forEach() 遍历数组
//forEach() 遍历数组
// 接收一个函数 函数中有三个参数 依次为当前遍历的项 当前遍历项的索引 当前遍历的数组
//其中只有第一个值是必须传的 剩下两个值可传可不传
//不改变原数组 会将遍历后的元素传给回调函数 可以通过 push 等数组方法 将遍历后的数组输出
var arrForEach = [1,2,3,4,5]
var newArrForEach = []
arrForEach.forEach(function(item,index,arr){
let newItem = item + 1
newArrForEach.push(newItem)
})
console.log(arrForEach); // (5) [1, 2, 3, 4, 5]
console.log(newArrForEach); // (5) [2, 3, 4, 5, 6]
2.some() 遍历数组
//some() 遍历数组
// 接收一个函数 函数中有三个参数 依次为当前遍历的项 当前遍历项的索引 当前遍历的数组
//其中只有第一个值是必须传的 剩下两个值可传可不传
//给数组中的每一项都运行传入的函数 如果存在至少一项符合函数 则返回 true
var arrSome = [1,2,3,4,5]
var newArrSome1 = arrSome.some(function(item,index,arr){
return item >1
})
console.log(newArrSome1); // true
//否则返回 false
var newArrSome1 = arrSome.some((item,index,arr) =>{
return item >6
})
console.log(newArrSome1); // false
3.every() 遍历数组
//every() 遍历数组
// 接收一个函数 函数中有三个参数 依次为当前遍历的项 当前遍历项的索引 当前遍历的数组
//其中只有第一个值是必须传的 剩下两个值可传可不传
//给数组中每一项都运行传入的函数,如果每一项都返回 true 则返回 true
var arrEvery = [1,2,3,4,5]
var newArrEvery = arrEvery.every((item,index,arr)=>{
return item <10
})
console.log(newArrEvery); //true
//否则返回 false
var newArrEvery = arrEvery.every((item)=>{
return item <4
})
console.log(newArrEvery); //false
4.map() 遍历数组
//map() 格式化遍历数组
//根据传入的函数 格式化遍历的每个值 返回格式化的数组 不改变原数组
var arrMap = [1,2,3,4,5]
var newArrMap = arrMap.map((item,index,arr) =>{
return item + 5
})
console.log(arrMap); //(5) [1, 2, 3, 4, 5]
console.log(newArrMap); //(5) [6, 7, 8, 9, 10]
5.filter() 数组过滤器
//filter 数组过滤器
//返回数组中满足过滤要求的数组 原数组不改变
var arrFilter = [1,2,3,4,5,7,8]
var newArrFilter = arrFilter.filter((item,index,arr) =>{
return item >4
})
console.log(arrFilter); // (7) [1, 2, 3, 4, 5, 7, 8]
console.log(newArrFilter); // (3) [5, 7, 8]
六.其他我不知道咋分类的数组方法
1.Array.isArray() 判断是否是一个数组
//Array.isArray() 判断是否是一个数组
var thisArray = [1,3,1,4]
var noArray = 'az'
newThisArray = Array.isArray(thisArray)
console.log(newThisArray); // true
newNoArray = Array.isArray(noArray)
console.log(newNoArray); // false
2.join() 数组转换成字符串
// join() 用于将数组转换成字符串 传入一个分隔符参数 如果不传则默认传入一个逗号 修改原数组 返回新数组
var arrJoin = [1,2,3,4,5]
var newArrJoin = arrJoin.join('|')
console.log(arrJoin); // (5) [1, 2, 3, 4, 5]
console.log(newArrJoin); // 1|2|3|4|5
3.toString() 数组之间转换成字符串
//toString() 将数组转换成字符串 不改变原数组 返回转换成的字符串
var arrToSting = [1,2,3,4,5]
var newArrToSting = arrToSting.toString()
console.log(arrToSting); // (5) [1, 2, 3, 4, 5]
console.log(newArrToSting); //1,2,3,4,5
5.concat() 连接数组
//concat() 用于连接两个数组或者多个数组 返回连接后的新数组
var 数组一 = [1,2,3,4,5]
var 数组二 = [6,7,8,9,0,['s','p']]
var 新数组 = 数组一.concat(数组二)
console.log(新数组); // (11) [1, 2, 3, 4, 5, 6, 7, 8, 9, 0, Array(2)]
总结
大概就这么多吧,少了的有缘再补